Merge branch 'develop' into doc/manual-scenario-show-test-network-tog…

…gle-21988
MetaMask · Jun 26, 2024 · 40e9078 · 40e9078
2 parents 17bf6f6 + daf1ef2
commit 40e9078
Show file tree

Hide file tree

Showing 4 changed files with 82 additions and 28 deletions.
diff --git 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
@@ -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(
-        <MetaMetricsContext.Provider value={mockTrackEvent}>
-          <HeaderInfo
-            showAdvancedDetails={false}
-            // eslint-disable-next-line no-empty-function
-            setShowAdvancedDetails={() => {}}
-          />
-        </MetaMetricsContext.Provider>,
-        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(
+          <MetaMetricsContext.Provider value={mockTrackEvent}>
+            <HeaderInfo
+              showAdvancedDetails={false}
+              // eslint-disable-next-line no-empty-function
+              setShowAdvancedDetails={() => {}}
+            />
+          </MetaMetricsContext.Provider>,
+          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
@@ -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
@@ -26,6 +26,7 @@ export type SignatureRequestType = {
     origin: string;
     data: string | TypedSignDataV1Type;
     version?: string;
+    signatureMethod?: string;
     siwe?: {
       isSIWEMessage: boolean;
       parsedMessage: null | {