From a3a3062ae14c79a3ff2d489cd2b2c9988da52010 Mon Sep 17 00:00:00 2001
From: MananTank <manantankm@gmail.com>
Date: Thu, 16 Jan 2025 21:55:22 +0000
Subject: [PATCH] [TOOL-3111] Nebula: Add events on transaction button (#5970)

---
 .../components/ExecuteTransactionCard.tsx     | 23 +++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/apps/dashboard/src/app/nebula-app/(app)/components/ExecuteTransactionCard.tsx b/apps/dashboard/src/app/nebula-app/(app)/components/ExecuteTransactionCard.tsx
index a9ac130a3b2..3b8a1150e02 100644
--- a/apps/dashboard/src/app/nebula-app/(app)/components/ExecuteTransactionCard.tsx
+++ b/apps/dashboard/src/app/nebula-app/(app)/components/ExecuteTransactionCard.tsx
@@ -20,6 +20,7 @@ import {
 } from "thirdweb";
 import { useSendTransaction } from "thirdweb/react";
 import { TransactionButton } from "../../../../components/buttons/TransactionButton";
+import { useTrack } from "../../../../hooks/analytics/useTrack";
 import { useV5DashboardChain } from "../../../../lib/v5-adapter";
 import { getSDKTheme } from "../../../components/sdk-component-theme";
 import type { NebulaTxData } from "./Chats";
@@ -78,6 +79,7 @@ export function ExecuteTransactionCardLayout(props: {
   const chain = useV5DashboardChain(txData.chainId);
   const isTransactionSent =
     props.status.type === "confirming" || props.status.type === "confirmed";
+  const trackEvent = useTrack();
 
   const explorer = chain.blockExplorers?.[0]?.url;
 
@@ -99,6 +101,13 @@ export function ExecuteTransactionCardLayout(props: {
             txChainID={txData.chainId}
             variant="default"
             onClick={async () => {
+              trackEvent({
+                category: "nebula",
+                action: "execute_transaction",
+                label: "attempt",
+                chainId: txData.chainId,
+              });
+
               const tx = prepareTransaction({
                 chain: chain,
                 client: props.client,
@@ -115,6 +124,13 @@ export function ExecuteTransactionCardLayout(props: {
                 const submittedReceipt = await sendTransaction.mutateAsync(tx);
                 txHash = submittedReceipt.transactionHash;
 
+                trackEvent({
+                  category: "nebula",
+                  action: "execute_transaction",
+                  label: "sent",
+                  chainId: txData.chainId,
+                });
+
                 // wait for receipt
                 props.setStatus({
                   type: "confirming",
@@ -127,6 +143,13 @@ export function ExecuteTransactionCardLayout(props: {
                   type: "confirmed",
                   txHash: confirmReceipt.transactionHash,
                 });
+
+                trackEvent({
+                  category: "nebula",
+                  action: "execute_transaction",
+                  label: "confirmed",
+                  chainId: txData.chainId,
+                });
               } catch {
                 props.setStatus({
                   type: "failed",