refactor: add wagmi tx step type for to driver

Author: spsjvc

packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx

@@ -4,6 +4,7 @@ import Tippy from '@tippyjs/react'
 import { constants, utils } from 'ethers'
 import { useLatest } from 'react-use'
 import { useAccount, useConfig } from 'wagmi'
+import { writeContract } from '@wagmi/core'
 import { TransactionResponse } from '@ethersproject/providers'
 import { twMerge } from 'tailwind-merge'
 import { scaleFrom18DecimalsToNativeTokenDecimals } from '@arbitrum/sdk'
@@ -430,6 +431,34 @@ export function TransferPanel() {
           return { error: error as unknown as Error }
         }
       }
+
+      case 'tx_wagmi': {
+        try {
+          const txHash = await writeContract(
+            wagmiConfig,
+            step.payload.txRequest
+          )
+          const txReceipt =
+            await context.transferStarter.sourceChainProvider.waitForTransaction(
+              txHash
+            )
+
+          return { data: txReceipt }
+        } catch (error) {
+          // capture error and show toast for anything that's not user rejecting error
+          if (!isUserRejectedError(error)) {
+            handleError({
+              error,
+              label: step.payload.txRequestLabel,
+              category: 'transaction_signing'
+            })
+
+            errorToast(`${(error as Error)?.message ?? error}`)
+          }
+
+          return { error: error as unknown as Error }
+        }
+      }
     }
   }
 

packages/arb-token-bridge-ui/src/ui-driver/UiDriver.ts

@@ -1,5 +1,6 @@
 import { BigNumber, providers } from 'ethers'
 import { BridgeTransferStarter } from '@/token-bridge-sdk/BridgeTransferStarter'
+import { SimulateContractReturnType } from '@wagmi/core'
 
 import { DialogType } from '../components/common/Dialog2'
 
@@ -32,6 +33,13 @@ export type UiDriverStep =
         txRequestLabel: string
       }
     }
+  | {
+      type: 'tx_wagmi'
+      payload: {
+        txRequest: SimulateContractReturnType['request']
+        txRequestLabel: string
+      }
+    }
 
 export type UiDriverStepType = UiDriverStep['type']
 
@@ -55,7 +63,7 @@ export type UiDriverStepResultFor<TStepType extends UiDriverStepType> =
     ? boolean
     : TStepType extends 'scw_tooltip'
     ? void
-    : TStepType extends 'tx_ethers'
+    : TStepType extends 'tx_ethers' | 'tx_wagmi'
     ? Result<providers.TransactionReceipt>
     : never
 

packages/arb-token-bridge-ui/src/ui-driver/UiDriverCommon.ts

@@ -61,3 +61,29 @@ export const stepGeneratorForTransactionEthers: UiDriverStepGeneratorForTransact
       return data
     }
   }
+
+export type UiDriverStepGeneratorForTransactionWagmi<
+  TStep extends UiDriverStep = UiDriverStep
+> = (
+  context: UiDriverContext,
+  payload: UiDriverStepPayloadFor<'tx_wagmi'>
+) => AsyncGenerator<
+  TStep,
+  providers.TransactionReceipt | void,
+  UiDriverStepResultFor<TStep['type']>
+>
+
+export const stepGeneratorForTransactionWagmi: UiDriverStepGeneratorForTransactionWagmi =
+  async function* (context, payload) {
+    if (context.isSmartContractWallet) {
+      yield* step({ type: 'scw_tooltip' })
+    }
+
+    const { error, data } = yield* step({ type: 'tx_wagmi', payload })
+
+    if (typeof error !== 'undefined') {
+      yield* step({ type: 'return' })
+    } else {
+      return data
+    }
+  }