Adds Sending SupERC20 & SupWETH Hooks (#587)

* Adds useSendSupERC20

* Adds useSendSuperchainWETH

* Adds changeset

* Adds useCrossChainSendETH

* export new hooks

* lint

.changeset/cuddly-cougars-do.md

@@ -0,0 +1,5 @@
+---
+"@eth-optimism/wagmi": patch
+---
+
+Added useSendSupERC20 & useSendSuperchainWETH

packages/wagmi/src/hooks/useCrossChainSendETH.ts

@@ -0,0 +1,30 @@
+import {
+  contracts,
+  type CrossChainSendETHParameters,
+  superchainWETHABI,
+} from '@eth-optimism/viem'
+import { useCallback } from 'react'
+import { useConfig, useWriteContract } from 'wagmi'
+
+export const useCrossChainSendETH = () => {
+  const config = useConfig()
+  const { writeContractAsync, isError, isPending, isSuccess } =
+    useWriteContract({ config })
+
+  const crossChainSendETH = useCallback(
+    (params: CrossChainSendETHParameters) => {
+      const { to, chainId, value } = params
+
+      return writeContractAsync({
+        abi: superchainWETHABI,
+        address: contracts.superchainWETH.address,
+        value,
+        functionName: 'sendETH',
+        args: [to, BigInt(chainId)],
+      })
+    },
+    [writeContractAsync],
+  )
+
+  return { crossChainSendETH, isError, isPending, isSuccess }
+}

packages/wagmi/src/hooks/useSendSupERC20.ts

@@ -0,0 +1,27 @@
+import type { SendSupERC20Parameters } from '@eth-optimism/viem'
+import { contracts, superchainTokenBridgeABI } from '@eth-optimism/viem'
+import { useCallback } from 'react'
+import { useConfig, useWriteContract } from 'wagmi'
+
+export const useSendSupERC20 = () => {
+  const config = useConfig()
+
+  const { writeContractAsync, isError, isPending, isSuccess } =
+    useWriteContract({ config })
+
+  const sendSupERC20 = useCallback(
+    (params: SendSupERC20Parameters) => {
+      const { tokenAddress, to, amount, chainId } = params
+
+      return writeContractAsync({
+        abi: superchainTokenBridgeABI,
+        address: contracts.superchainTokenBridge.address,
+        functionName: 'sendERC20',
+        args: [tokenAddress, to, amount, BigInt(chainId)],
+      })
+    },
+    [writeContractAsync],
+  )
+
+  return { sendSupERC20, isError, isPending, isSuccess }
+}

packages/wagmi/src/hooks/useSendSuperchainWETH.ts

@@ -0,0 +1,30 @@
+import {
+  contracts,
+  type SendSupERC20Parameters,
+  type SendSuperchainWETHParameters,
+} from '@eth-optimism/viem'
+import { useCallback } from 'react'
+
+import { useSendSupERC20 } from './useSendSupERC20.js'
+
+export const useSendSuperchainWETH = () => {
+  const { sendSupERC20, isError, isPending, isSuccess } = useSendSupERC20()
+
+  const sendSuperchainWETH = useCallback(
+    (params: SendSuperchainWETHParameters) => {
+      const { to, amount, chainId } = params
+
+      const sendSupERC20Params = {
+        tokenAddress: contracts.superchainWETH.address,
+        to,
+        amount,
+        chainId,
+      } as unknown as SendSupERC20Parameters
+
+      return sendSupERC20(sendSupERC20Params)
+    },
+    [sendSupERC20],
+  )
+
+  return { sendSuperchainWETH, isError, isPending, isSuccess }
+}

packages/wagmi/src/index.ts

@@ -1,3 +1,6 @@
 // hooks
+export { useCrossChainSendETH } from '@/hooks/useCrossChainSendETH.js'
 export { useRelayL2ToL2Message } from '@/hooks/useRelayL2ToL2Message.js'
 export { useSendL2ToL2Message } from '@/hooks/useSendL2ToL2Message.js'
+export { useSendSupERC20 } from '@/hooks/useSendSupERC20.js'
+export { useSendSuperchainWETH } from '@/hooks/useSendSuperchainWETH.js'