Created
August 10, 2023 15:31
-
-
Save slavik0329/2e5b6fc31cb745b65d3d37f7cf1d7b36 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { type PublicClient, type WalletClient } from "@wagmi/core"; | |
import { providers } from "ethers"; | |
import { type HttpTransport } from "viem"; | |
import { useEffect, useState } from "react"; | |
import type { JsonRpcProvider, JsonRpcSigner } from "@ethersproject/providers"; | |
import { usePublicClient, useWalletClient } from "wagmi"; | |
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<HttpTransport>[]).map( | |
({ value }) => new providers.JsonRpcProvider(value?.url, network) | |
) | |
); | |
return new providers.JsonRpcProvider(transport.url, 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; | |
} | |
export function useSigner() { | |
const { data: walletClient } = useWalletClient(); | |
const [signer, setSigner] = useState<JsonRpcSigner | undefined>(undefined); | |
useEffect(() => { | |
async function getSigner() { | |
if (!walletClient) return; | |
const tmpSigner = walletClientToSigner(walletClient); | |
setSigner(tmpSigner); | |
} | |
getSigner(); | |
}, [walletClient]); | |
return signer; | |
} | |
export function useProvider() { | |
const publicClient = usePublicClient(); | |
const [provider, setProvider] = useState<JsonRpcProvider | undefined>(undefined); | |
useEffect(() => { | |
async function getSigner() { | |
if (!publicClient) return; | |
const tmpProvider = publicClientToProvider(publicClient); | |
setProvider(tmpProvider as JsonRpcProvider); | |
} | |
getSigner(); | |
}, [publicClient]); | |
return provider; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Here's a similar utils file that works for me in CRA, https://gist.github.com/Rashmi-278/8728ff58e50d043c98ac1ef9612ff1df
ethers 5.7.2