diff --git a/package.json b/package.json index 18445ef0..a9b9cba3 100644 --- a/package.json +++ b/package.json @@ -45,6 +45,7 @@ "@wagmi/chains": "^1.6.0", "@wagmi/core": "~0.10.17", "@walletconnect/modal": "^2.6.1", + "ethers": "5.7.2", "rc-tooltip": "^6.0.1", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/src/refactor/helpers/ethers.ts b/src/refactor/helpers/ethers.ts new file mode 100644 index 00000000..4037e36a --- /dev/null +++ b/src/refactor/helpers/ethers.ts @@ -0,0 +1,25 @@ +import { useMemo } from 'react'; +import { usePublicClient, useWalletClient } from 'wagmi'; +import type { Provider } from '@wagmi/core'; +import { Signer } from 'ethers'; +import { publicClientToProvider, walletClientToSigner } from './wagmi'; + +export const useEthersProvider = (): Provider | undefined => { + const publicClient = usePublicClient(); + const provider = useMemo(() => { + if (publicClient) publicClientToProvider(publicClient); + return undefined; + }, [publicClient]); + + return provider; +}; + +export const useEthersSigner = (): Signer | undefined => { + const { data: walletClient } = useWalletClient(); + const signer = useMemo(() => { + if (walletClient) walletClientToSigner(walletClient); + return undefined; + }, [walletClient]); + + return signer; +}; diff --git a/src/refactor/helpers/wagmi.ts b/src/refactor/helpers/wagmi.ts new file mode 100644 index 00000000..c6406e86 --- /dev/null +++ b/src/refactor/helpers/wagmi.ts @@ -0,0 +1,32 @@ +import { type PublicClient, type WalletClient } from 'wagmi'; + +import { providers } from 'ethers'; +import { type HttpTransport } from 'viem'; + +export function publicClientToProvider(publicClient: PublicClient) { + const { chain, transport } = publicClient; + const network = { + chainId: chain.id, + name: chain.name, + ensAddress: chain.contracts?.ensRegistry?.address, + }; + if (transport.type === 'fallback') + return new providers.FallbackProvider( + (transport.transports as ReturnType[]).map( + ({ value }) => new providers.JsonRpcProvider(value?.url, network) + ) + ); + return new providers.JsonRpcProvider(transport.url as string, network); +} + +export function walletClientToSigner(walletClient: WalletClient) { + const { account, chain, transport } = walletClient; + const network = { + chainId: chain.id, + name: chain.name, + ensAddress: chain.contracts?.ensRegistry?.address, + }; + const provider = new providers.Web3Provider(transport, network); + const signer = provider.getSigner(account.address); + return signer; +} diff --git a/src/refactor/wallet-client/wallet/use-wallet.ts b/src/refactor/wallet-client/wallet/use-wallet.ts index e1df3522..496d073c 100644 --- a/src/refactor/wallet-client/wallet/use-wallet.ts +++ b/src/refactor/wallet-client/wallet/use-wallet.ts @@ -3,7 +3,7 @@ import { useChainModal, useAccountModal, } from '@rainbow-me/rainbowkit'; -import type { Connector } from '@wagmi/core'; +import type { Connector, Provider } from '@wagmi/core'; import { useEffect, useMemo, useState } from 'react'; import { @@ -15,6 +15,9 @@ import { PublicClient, WalletClient, } from 'wagmi'; +import { Signer } from 'ethers'; + +import { useEthersProvider, useEthersSigner } from '../../helpers/ethers'; export interface UseWalletReturn { address?: `0x${string}`; @@ -25,6 +28,8 @@ export interface UseWalletReturn { shortAddress?: `0x${string}`; publicClient?: PublicClient; walletClient?: WalletClient; + signer?: Signer; + provider?: Provider; connector?: Connector; isConnected?: boolean; isConnecting?: boolean; @@ -58,8 +63,13 @@ const useWallet = (): UseWalletReturn => { const [compareAddress, setCompareAddress] = useState(address); const { data: walletClient, isLoading: isLoadingWalletClient } = useWalletClient(); - const { disconnect, disconnectAsync } = useDisconnect(); + + const signer = useEthersSigner(); + const publicClient = usePublicClient(); + const provider = useEthersProvider(); + + const { disconnect, disconnectAsync } = useDisconnect(); const { data: balanceResult, // isError: isErrorBalance, @@ -121,6 +131,8 @@ const useWallet = (): UseWalletReturn => { compareAddress, publicClient, walletClient, + signer, + provider, connector, isConnected, isConnecting, @@ -145,6 +157,8 @@ const useWallet = (): UseWalletReturn => { compareAddress, publicClient, walletClient, + signer, + provider, connector, isConnected, isConnecting, diff --git a/yarn.lock b/yarn.lock index 989aa05c..146d0431 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8092,7 +8092,7 @@ eth-rpc-errors@^4.0.2: dependencies: fast-safe-stringify "^2.0.6" -ethers@^5.7.2, ethers@~5.7.2: +ethers@5.7.2, ethers@^5.7.2, ethers@~5.7.2: version "5.7.2" resolved "https://registry.yarnpkg.com/ethers/-/ethers-5.7.2.tgz#3a7deeabbb8c030d4126b24f84e525466145872e" integrity sha512-wswUsmWo1aOK8rR7DIKiWSw9DbLWe6x98Jrn8wcTflTVvaXhAMaB5zGAXy0GYQEQp9iO1iSHWVyARQm11zUtyg==