fix: Track more safe creation steps (#3965)

* fix: Track more safe creation steps * Update src/utils/events/createLoadSafe.ts Co-authored-by: Aaron Cook <[email protected]> * fix: Check for wallet rejection before tracking * fix: Remove back button after safe creation submission Co-authored-by: Aaron Cook <[email protected]>
5afe · Jun 15, 2022 · b83b3e4 · b83b3e4
1 parent 468e0b0
commit b83b3e4
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 12 deletions.
diff --git a/src/routes/CreateSafePage/components/SafeCreationProcess.tsx b/src/routes/CreateSafePage/components/SafeCreationProcess.tsx
@@ -131,6 +131,7 @@ const createNewSafe = (userAddress: string, onHash: (hash: string) => void): Pro
     deploymentTx
       .send(sendParams)
       .once('transactionHash', (txHash) => {
+        trackEvent(CREATE_SAFE_EVENTS.SUBMIT_CREATE_SAFE)
         onHash(txHash)
 
         saveToStorage(SAFE_PENDING_CREATION_STORAGE_KEY, {
@@ -255,6 +256,7 @@ function SafeCreationProcess(): ReactElement {
   }
 
   const onRetry = (): void => {
+    trackEvent(CREATE_SAFE_EVENTS.RETRY_CREATE_SAFE)
     const safeCreationFormValues = loadSavedDataOrLeave()
 
     if (!safeCreationFormValues) {
@@ -272,6 +274,7 @@ function SafeCreationProcess(): ReactElement {
   }
 
   const onCancel = () => {
+    trackEvent(CREATE_SAFE_EVENTS.CANCEL_CREATE_SAFE)
     removeFromStorage(SAFE_PENDING_CREATION_STORAGE_KEY)
     goToWelcomePage()
   }

diff --git a/src/routes/opening/index.tsx b/src/routes/opening/index.tsx
@@ -6,7 +6,6 @@ import styled from 'styled-components'
 import { ErrorFooter } from 'src/routes/opening/components/Footer'
 import { isConfirmationStep, steps } from './steps'
 
-import Button from 'src/components/layout/Button'
 import Heading from 'src/components/layout/Heading'
 import Img from 'src/components/layout/Img'
 import Paragraph from 'src/components/layout/Paragraph'
@@ -25,6 +24,9 @@ import { showNotification } from 'src/logic/notifications/store/notifications'
 import { getNewSafeAddressFromLogs } from 'src/routes/opening/utils/getSafeAddressFromLogs'
 import { getExplorerInfo } from 'src/config'
 import PrefixedEthHashInfo from 'src/components/PrefixedEthHashInfo'
+import { trackEvent } from 'src/utils/googleTagManager'
+import { CREATE_SAFE_EVENTS } from 'src/utils/events/createLoadSafe'
+import { isWalletRejection } from 'src/logic/wallets/errors'
 
 export const SafeDeployment = ({
   creationTxHash,
@@ -119,6 +121,9 @@ export const SafeDeployment = ({
         setStepIndex(1)
         setIntervalStarted(true)
       } catch (err) {
+        if (isWalletRejection(err)) {
+          trackEvent(CREATE_SAFE_EVENTS.REJECT_CREATE_SAFE)
+        }
         onError(err)
       }
     }
@@ -309,12 +314,6 @@ export const SafeDeployment = ({
           ) : null}
         </BodyFooter>
       </Body>
-
-      {stepIndex !== 0 && (
-        <BackButton color="primary" minWidth={140} onClick={onCancel} data-testid="safe-creation-back-btn">
-          Back
-        </BackButton>
-      )}
     </Wrapper>
   )
 }
@@ -418,8 +417,3 @@ const BodyFooter = styled.div`
   justify-content: center;
   align-items: flex-end;
 `
-
-const BackButton = styled(Button)`
-  grid-column: 2;
-  margin: 20px auto 0;
-`
diff --git a/src/utils/events/createLoadSafe.ts b/src/utils/events/createLoadSafe.ts
@@ -20,6 +20,22 @@ const CREATE_SAFE = {
     event: GTM_EVENT.META,
     action: 'Threshold',
   },
+  SUBMIT_CREATE_SAFE: {
+    event: GTM_EVENT.META,
+    action: 'Submit Safe creation',
+  },
+  REJECT_CREATE_SAFE: {
+    event: GTM_EVENT.META,
+    action: 'Reject Safe creation',
+  },
+  RETRY_CREATE_SAFE: {
+    event: GTM_EVENT.META,
+    action: 'Retry Safe creation',
+  },
+  CANCEL_CREATE_SAFE: {
+    event: GTM_EVENT.META,
+    action: 'Cancel Safe creation',
+  },
   CREATED_SAFE: {
     event: GTM_EVENT.META,
     action: 'Created Safe',