diff --git a/shared/constants/metametrics.ts b/shared/constants/metametrics.ts
index 82c6a557be4f..3caee8b7d088 100644
--- a/shared/constants/metametrics.ts
+++ b/shared/constants/metametrics.ts
@@ -779,6 +779,7 @@ export enum MetaMetricsEventCategory {
Tokens = 'Tokens',
Transactions = 'Transactions',
Wallet = 'Wallet',
+ Confirmations = 'Confirmations',
///: BEGIN:ONLY_INCLUDE_IF(build-mmi)
MMI = 'Institutional',
///: END:ONLY_INCLUDE_IF
@@ -831,6 +832,7 @@ export enum MetaMetricsEventLocation {
TokenDetails = 'token_details',
TokenDetection = 'token_detection',
TokenMenu = 'token_menu',
+ Transaction = 'transaction',
}
export enum MetaMetricsEventUiCustomization {
diff --git a/ui/pages/confirmations/components/confirm/header/header-info.test.tsx b/ui/pages/confirmations/components/confirm/header/header-info.test.tsx
index 08a8d3f9d1fc..3e0372c6b9b5 100644
--- a/ui/pages/confirmations/components/confirm/header/header-info.test.tsx
+++ b/ui/pages/confirmations/components/confirm/header/header-info.test.tsx
@@ -20,14 +20,55 @@ const mockStore = {
},
confirm: {
currentConfirmation: {
+ id: 'testApprovalId',
msgParams: {
from: '0x0dcd5d886577d5081b0c52e242ef29e70be3e7bc',
+ signatureMethod: 'eth_signTypedData_v4',
},
- type: 'eth_signTypedData_v4',
+ type: 'eth_signTypedData',
},
},
};
+const cases = [
+ {
+ description: 'for a signature',
+ store: {
+ ...mockStore,
+ },
+ expectedEvent: {
+ category: MetaMetricsEventCategory.Confirmations,
+ event: MetaMetricsEventName.AccountDetailsOpened,
+ properties: {
+ action: 'Confirm Screen',
+ location: MetaMetricsEventLocation.SignatureConfirmation,
+ signature_type: 'eth_signTypedData_v4',
+ },
+ },
+ },
+ {
+ description: 'for a transaction',
+ store: {
+ ...mockStore,
+ confirm: {
+ currentConfirmation: {
+ id: 'testApprovalId',
+ type: 'a_transaction_type',
+ },
+ },
+ },
+ expectedEvent: {
+ category: MetaMetricsEventCategory.Confirmations,
+ event: MetaMetricsEventName.AccountDetailsOpened,
+ properties: {
+ action: 'Confirm Screen',
+ location: MetaMetricsEventLocation.Transaction,
+ transaction_type: 'a_transaction_type',
+ },
+ },
+ },
+];
+
const render = () => {
const store = configureStore(mockStore);
return renderWithProvider(
@@ -58,29 +99,23 @@ describe('Header', () => {
});
});
- it(`sends "${MetaMetricsEventName.AccountDetailsOpened}" metametric`, () => {
- const mockTrackEvent = jest.fn();
- const { getByLabelText } = renderWithProvider(
-
- {}}
- />
- ,
- configureStore(mockStore),
- );
- const accountInfoIcon = getByLabelText('Account details');
- fireEvent.click(accountInfoIcon);
+ cases.forEach(({ description, store, expectedEvent }) => {
+ it(`sends "${MetaMetricsEventName.AccountDetailsOpened}" metametric ${description}`, () => {
+ const mockTrackEvent = jest.fn();
+ const { getByLabelText } = renderWithProvider(
+
+ {}}
+ />
+ ,
+ configureStore(store),
+ );
+ const accountInfoIcon = getByLabelText('Account details');
+ fireEvent.click(accountInfoIcon);
- expect(mockTrackEvent).toHaveBeenNthCalledWith(1, {
- category: MetaMetricsEventCategory.Transactions,
- event: MetaMetricsEventName.AccountDetailsOpened,
- properties: {
- action: 'Confirm Screen',
- location: MetaMetricsEventLocation.SignatureConfirmation,
- signature_type: 'eth_signTypedData_v4',
- },
+ expect(mockTrackEvent).toHaveBeenNthCalledWith(1, expectedEvent);
});
});
});
diff --git a/ui/pages/confirmations/components/confirm/header/header-info.tsx b/ui/pages/confirmations/components/confirm/header/header-info.tsx
index b94839220498..0f40b35f00ef 100644
--- a/ui/pages/confirmations/components/confirm/header/header-info.tsx
+++ b/ui/pages/confirmations/components/confirm/header/header-info.tsx
@@ -46,6 +46,8 @@ import {
import { useBalance } from '../../../hooks/useBalance';
import useConfirmationRecipientInfo from '../../../hooks/useConfirmationRecipientInfo';
import { REDESIGN_TRANSACTION_TYPES } from '../../../utils';
+import { SignatureRequestType } from '../../../types/confirm';
+import { isSignatureTransactionType } from '../../../utils/confirm';
const HeaderInfo = ({
showAdvancedDetails,
@@ -66,16 +68,30 @@ const HeaderInfo = ({
const { balance: balanceToUse } = useBalance(fromAddress);
+ const isSignature = isSignatureTransactionType(currentConfirmation);
+
+ const eventProps = isSignature
+ ? {
+ location: MetaMetricsEventLocation.SignatureConfirmation,
+ signature_type: (currentConfirmation as SignatureRequestType)?.msgParams
+ ?.signatureMethod,
+ }
+ : {
+ location: MetaMetricsEventLocation.Transaction,
+ transaction_type: currentConfirmation?.type,
+ };
+
function trackAccountModalOpened() {
- trackEvent({
- category: MetaMetricsEventCategory.Transactions,
+ const event = {
+ category: MetaMetricsEventCategory.Confirmations,
event: MetaMetricsEventName.AccountDetailsOpened,
properties: {
action: 'Confirm Screen',
- location: MetaMetricsEventLocation.SignatureConfirmation,
- signature_type: currentConfirmation?.type,
+ ...eventProps,
},
- });
+ };
+
+ trackEvent(event);
}
const isShowAdvancedDetailsToggle = REDESIGN_TRANSACTION_TYPES.includes(
diff --git a/ui/pages/confirmations/types/confirm.ts b/ui/pages/confirmations/types/confirm.ts
index a48e1d4984ba..ab472318fcac 100644
--- a/ui/pages/confirmations/types/confirm.ts
+++ b/ui/pages/confirmations/types/confirm.ts
@@ -26,6 +26,7 @@ export type SignatureRequestType = {
origin: string;
data: string | TypedSignDataV1Type;
version?: string;
+ signatureMethod?: string;
siwe?: {
isSIWEMessage: boolean;
parsedMessage: null | {