feat(analytics): add event for insufficient gas warnings (#5671)

### Description

When preparing a tx in the various flows, if it fails with insufficient
gas, add an analytics event.

### Test plan

Unit tests, manual

### Related issues

- Fixes ACT-1256

### Backwards compatibility

Yes

### Network scalability

If a new NetworkId and/or Network are added in the future, the changes
in this PR will:

- [x] Continue to work without code changes, OR trigger a compilation
error (guaranteeing we find it when a new network is added)

src/analytics/Events.tsx

@@ -355,6 +355,7 @@ export enum TransactionEvents {
   transaction_confirmed = 'transaction_confirmed',
   transaction_error = 'transaction_error',
   transaction_exception = 'transaction_exception',
+  transaction_prepare_insufficient_gas = 'transaction_prepare_insufficient_gas',
 }
 
 export enum CeloExchangeEvents {

src/analytics/Properties.tsx

@@ -49,6 +49,7 @@ import {
   HooksEnablePreviewOrigin,
   ScrollDirection,
   SendOrigin,
+  TransactionOrigin,
   WalletConnectPairingOrigin,
 } from 'src/analytics/types'
 import { ErrorMessages } from 'src/app/ErrorMessages'
@@ -707,6 +708,10 @@ interface TransactionEventsProperties {
     error: string
     feeCurrencyAddress?: string
   } & Web3LibraryProps
+  [TransactionEvents.transaction_prepare_insufficient_gas]: {
+    networkId: NetworkId
+    origin: TransactionOrigin
+  }
 }
 
 interface CeloExchangeEventsProperties {

src/analytics/docs.ts

@@ -367,6 +367,7 @@ export const eventDocs: Record<AnalyticsEventType, string> = {
   [TransactionEvents.transaction_confirmed]: `when a transaction is confirmed by the blockchain`,
   [TransactionEvents.transaction_error]: `when a transaction submission emits an error (only for contract-kit)`,
   [TransactionEvents.transaction_exception]: `when a transaction submission throws`,
+  [TransactionEvents.transaction_prepare_insufficient_gas]: `when a transaction cannot be prepared due to insufficient gas. Includes networkId and origin props to identify the transaction being attempted. For swaps, the networkId is always the source network`,
   [CeloExchangeEvents.celo_withdraw_completed]: `when the transaction for the withdrawal is completed`,
 
   // The CICO landing page accessible from the Settings Menu

src/analytics/types.ts

@@ -31,3 +31,12 @@ export enum HooksEnablePreviewOrigin {
   Scan = 'scan',
   Deeplink = 'deeplink',
 }
+
+export type TransactionOrigin =
+  | 'send'
+  | 'swap'
+  | 'earn-deposit'
+  | 'earn-withdraw'
+  | 'jumpstart-send'
+  | 'jumpstart-claim'
+  | 'wallet-connect'

src/earn/prepareTransactions.test.ts

@@ -143,6 +143,7 @@ describe('prepareTransactions', () => {
         spendToken: mockToken,
         spendTokenAmount: new BigNumber(5),
         isGasSubsidized: false,
+        origin: 'earn-deposit',
       })
     })
 
@@ -203,6 +204,7 @@ describe('prepareTransactions', () => {
         spendToken: mockToken,
         spendTokenAmount: new BigNumber(5),
         isGasSubsidized: true,
+        origin: 'earn-deposit',
       })
     })
   })
@@ -276,6 +278,7 @@ describe('prepareTransactions', () => {
         baseTransactions: expectedTransactions,
         feeCurrencies: [mockFeeCurrency],
         isGasSubsidized: true,
+        origin: 'earn-withdraw',
       })
     })
 
@@ -311,6 +314,7 @@ describe('prepareTransactions', () => {
         baseTransactions: expectedTransactions,
         feeCurrencies: [mockFeeCurrency],
         isGasSubsidized: false,
+        origin: 'earn-withdraw',
       })
     })
   })

src/earn/prepareTransactions.ts

@@ -101,6 +101,7 @@ export async function prepareSupplyTransactions({
     spendToken: token,
     spendTokenAmount: new BigNumber(amount),
     isGasSubsidized,
+    origin: 'earn-deposit',
   })
 }
 
@@ -183,5 +184,6 @@ export async function prepareWithdrawAndClaimTransactions({
     feeCurrencies,
     baseTransactions,
     isGasSubsidized,
+    origin: 'earn-withdraw',
   })
 }

src/jumpstart/JumpstartTransactionDetailsScreen.test.tsx

@@ -267,6 +267,7 @@ describe('JumpstartTransactionDetailsScreen', () => {
     expect(prepareTransactions).toHaveBeenCalledWith({
       baseTransactions: [expect.objectContaining({ to: mockRetiredContractAddress })],
       feeCurrencies: expect.any(Array),
+      origin: 'jumpstart-claim',
     })
   })
 

src/jumpstart/JumpstartTransactionDetailsScreen.tsx

@@ -99,6 +99,7 @@ function JumpstartTransactionDetailsScreen({ route }: Props) {
       const preparedTransactions = await prepareTransactions({
         feeCurrencies,
         baseTransactions: [reclaimTx],
+        origin: 'jumpstart-claim',
       })
 
       switch (preparedTransactions.type) {

src/jumpstart/usePrepareJumpstartTransactions.test.ts

@@ -86,6 +86,7 @@ describe('usePrepareJumpstartTransactions', () => {
       spendToken: mockCeloTokenBalance,
       spendTokenAmount: new BigNumber(sendTokenAmountInSmallestUnit),
       baseTransactions: expectedBaseTransactions,
+      origin: 'jumpstart-send',
     })
     expect(publicClient.celo.readContract).toHaveBeenCalledTimes(1)
     expect(publicClient.celo.readContract).toHaveBeenCalledWith({

src/jumpstart/usePrepareJumpstartTransactions.ts

@@ -116,6 +116,7 @@ export function usePrepareJumpstartTransactions() {
         spendToken: token,
         spendTokenAmount: sendTokenAmountInSmallestUnit,
         baseTransactions,
+        origin: 'jumpstart-send',
       })
     },
     {

src/swap/useSwapQuote.ts

@@ -149,6 +149,7 @@ async function prepareSwapTransactions(
     baseTransactions,
     // We still want to prepare the transactions even if the user doesn't have enough balance
     throwOnSpendTokenAmountExceedsBalance: false,
+    origin: 'swap',
   })
 }