Detecting if the user is on the wrong network

You can easily detect if the user is on the wrong network using the useNetwork hook from wagmi.

import { useNetwork } from 'wagmi'

const Page = () => {
  const { activeChain } = useNetwork()

  // checks if the user is not on mainnet. 1 => mainnet's chain ID. See https://chainlist.org/ for other chains
  const wrongNetwork = activeChain?.id !== 1

  return <div>{wrongNetwork && <p>You are on the wrong network!</p>}</div>
}

Last updated on June 1, 2022