fix: imperatively send SwapSigned (#5207)

src/components/swap/ConfirmSwapModal.tsx

@@ -1,10 +1,9 @@
 import { Trans } from '@lingui/macro'
-import { sendAnalyticsEvent, Trace } from '@uniswap/analytics'
-import { EventName, ModalName } from '@uniswap/analytics-events'
+import { Trace } from '@uniswap/analytics'
+import { ModalName } from '@uniswap/analytics-events'
 import { Trade } from '@uniswap/router-sdk'
 import { Currency, CurrencyAmount, Percent, Token, TradeType } from '@uniswap/sdk-core'
-import { formatSwapSignedAnalyticsEventProperties } from 'lib/utils/analytics'
-import { ReactNode, useCallback, useEffect, useMemo, useState } from 'react'
+import { ReactNode, useCallback, useMemo, useState } from 'react'
 import { InterfaceTrade } from 'state/routing/types'
 import { tradeMeaningfullyDiffers } from 'utils/tradeMeaningFullyDiffer'
 
@@ -49,7 +48,6 @@ export default function ConfirmSwapModal({
   // shouldLogModalCloseEvent lets the child SwapModalHeader component know when modal has been closed
   // and an event triggered by modal closing should be logged.
   const [shouldLogModalCloseEvent, setShouldLogModalCloseEvent] = useState(false)
-  const [lastTxnHashLogged, setLastTxnHashLogged] = useState<string | null>(null)
   const showAcceptChanges = useMemo(
     () => Boolean(trade && originalTrade && tradeMeaningfullyDiffers(trade, originalTrade)),
     [originalTrade, trade]
@@ -123,13 +121,6 @@ export default function ConfirmSwapModal({
     [onModalDismiss, modalBottom, modalHeader, swapErrorMessage]
   )
 
-  useEffect(() => {
-    if (!attemptingTxn && isOpen && txHash && trade && txHash !== lastTxnHashLogged) {
-      sendAnalyticsEvent(EventName.SWAP_SIGNED, formatSwapSignedAnalyticsEventProperties({ trade, txHash }))
-      setLastTxnHashLogged(txHash)
-    }
-  }, [attemptingTxn, isOpen, txHash, trade, lastTxnHashLogged])
-
   return (
     <Trace modal={ModalName.CONFIRM_SWAP}>
       <TransactionConfirmationModal

src/hooks/useSwapCallback.tsx

@@ -1,8 +1,11 @@
 // eslint-disable-next-line no-restricted-imports
+import { sendAnalyticsEvent } from '@uniswap/analytics'
+import { EventName } from '@uniswap/analytics-events'
 import { Trade } from '@uniswap/router-sdk'
 import { Currency, Percent, TradeType } from '@uniswap/sdk-core'
 import { useWeb3React } from '@web3-react/core'
 import { SwapCallbackState, useSwapCallback as useLibSwapCallBack } from 'lib/hooks/swap/useSwapCallback'
+import { formatSwapSignedAnalyticsEventProperties } from 'lib/utils/analytics'
 import { ReactNode, useMemo } from 'react'
 
 import { useTransactionAdder } from '../state/transactions/hooks'
@@ -47,6 +50,10 @@ export function useSwapCallback(
     }
     return () =>
       libCallback().then((response) => {
+        sendAnalyticsEvent(
+          EventName.SWAP_SIGNED,
+          formatSwapSignedAnalyticsEventProperties({ trade, txHash: response.hash })
+        )
         addTransaction(
           response,
           trade.tradeType === TradeType.EXACT_INPUT