34 řádky
803 B
TypeScript
34 řádky
803 B
TypeScript
import { useNetwork, useSwitchNetwork } from 'wagmi'
|
|
|
|
export function NetworkSwitcher() {
|
|
const { chain } = useNetwork()
|
|
const { chains, error, isLoading, pendingChainId, switchNetwork } =
|
|
useSwitchNetwork()
|
|
|
|
if (!chain) return null
|
|
|
|
return (
|
|
<div>
|
|
<div>
|
|
Connected to {chain?.name ?? chain?.id}
|
|
{chain?.unsupported && ' (unsupported)'}
|
|
</div>
|
|
|
|
{switchNetwork && (
|
|
<div>
|
|
{chains.map((x) =>
|
|
x.id === chain?.id ? null : (
|
|
<button key={x.id} onClick={() => switchNetwork(x.id)}>
|
|
{x.name}
|
|
{isLoading && x.id === pendingChainId && ' (switching)'}
|
|
</button>
|
|
),
|
|
)}
|
|
</div>
|
|
)}
|
|
|
|
<div>{error && error.message}</div>
|
|
</div>
|
|
)
|
|
}
|