[LW-10261] add posthog cancel dapp tx events (#1117)

* fix: adds posthog actions on confirm and cancel dapp transactions * fix: match the set of strings to the previous confirm click * fix: adds cancel posthog analytics for confirmation screen
input-output-hk · May 7, 2024 · 8b4f652 · 8b4f652
1 parent 5f2c036
commit 8b4f652
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 9 deletions.
diff --git a/apps/browser-extension-wallet/src/features/dapp/components/SignTransaction.tsx b/apps/browser-extension-wallet/src/features/dapp/components/SignTransaction.tsx
@@ -57,6 +57,13 @@ export const SignTransaction = (): React.ReactElement => {
     return !password;
   }, [request, password]);
 
+  const onCancel = () => {
+    analytics.sendEventToPostHog(PostHogAction.SendTransactionConfirmationCancelClick, {
+      [TX_CREATION_TYPE_KEY]: TxCreationType.External
+    });
+    setPreviousView();
+  };
+
   return (
     <Layout title={undefined}>
       <div className={styles.passwordContainer}>
@@ -82,12 +89,7 @@ export const SignTransaction = (): React.ReactElement => {
         >
           {t('dapp.confirm.btn.confirm')}
         </Button>
-        <Button
-          onClick={setPreviousView}
-          color="secondary"
-          className={styles.actionBtn}
-          data-testid="sign-transaction-cancel"
-        >
+        <Button onClick={onCancel} color="secondary" className={styles.actionBtn} data-testid="sign-transaction-cancel">
           {t('dapp.confirm.btn.cancel')}
         </Button>
       </div>

diff --git a/...-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmTransaction.tsx b/...-extension-wallet/src/features/dapp/components/confirm-transaction/ConfirmTransaction.tsx
@@ -46,7 +46,7 @@ export const ConfirmTransaction = (): React.ReactElement => {
     fetchTxType();
   }, [req]);
 
-  const onConfirm = () => {
+  const onConfirmTransaction = () => {
     analytics.sendEventToPostHog(PostHogAction.SendTransactionSummaryConfirmClick, {
       [TX_CREATION_TYPE_KEY]: TxCreationType.External
     });
@@ -85,6 +85,13 @@ export const ConfirmTransaction = (): React.ReactElement => {
     };
   }, [setSignTxRequest, setDappInfo]);
 
+  const onCancelTransaction = () => {
+    analytics.sendEventToPostHog(PostHogAction.SendTransactionSummaryCancelClick, {
+      [TX_CREATION_TYPE_KEY]: TxCreationType.External
+    });
+    disallowSignTx(true);
+  };
+
   useOnBeforeUnload(disallowSignTx);
 
   return (
@@ -97,7 +104,7 @@ export const ConfirmTransaction = (): React.ReactElement => {
       {!confirmTransactionError && (
         <div className={styles.actions}>
           <Button
-            onClick={onConfirm}
+            onClick={onConfirmTransaction}
             loading={isHardwareWallet && isConfirmingTx}
             data-testid="dapp-transaction-confirm"
             className={styles.actionBtn}
@@ -109,7 +116,7 @@ export const ConfirmTransaction = (): React.ReactElement => {
           <Button
             color="secondary"
             data-testid="dapp-transaction-cancel"
-            onClick={() => disallowSignTx(true)}
+            onClick={onCancelTransaction}
             className={styles.actionBtn}
           >
             {t('dapp.confirm.btn.cancel')}

diff --git a/packages/common/src/analytics/types.ts b/packages/common/src/analytics/types.ts
@@ -132,7 +132,9 @@ export enum PostHogAction {
   SendClick = 'send | send | click',
   SendTransactionDataReviewTransactionClick = 'send | transaction data | review transaction | click',
   SendTransactionSummaryConfirmClick = 'send | transaction summary | confirm | click',
+  SendTransactionSummaryCancelClick = 'send | transaction summary | cancel | click',
   SendTransactionConfirmationConfirmClick = 'send | transaction confirmation | confirm | click',
+  SendTransactionConfirmationCancelClick = 'send | transaction confirmation | cancel | click',
   SendTransactionConfirmed = 'send | transaction confirmed',
   SendAllDoneView = 'send | all done | view',
   SendAllDoneViewTransactionClick = 'send | all done | view transaction | click',