diff --git a/example/app/providers.tsx b/example/app/providers.tsx
index 44c30ff..93274d0 100644
--- a/example/app/providers.tsx
+++ b/example/app/providers.tsx
@@ -2,16 +2,16 @@
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import { createConfig, http, WagmiProvider } from 'wagmi'
-import { baseGoerli, goerli, optimismGoerli } from 'wagmi/chains'
+import { base, mainnet, optimism } from 'wagmi/chains'
 
 const queryClient = new QueryClient()
 
 const config = createConfig({
-  chains: [goerli, baseGoerli, optimismGoerli],
+  chains: [base, mainnet, optimism],
   transports: {
-    [goerli.id]: http(),
-    [baseGoerli.id]: http(),
-    [optimismGoerli.id]: http(),
+    [base.id]: http(),
+    [mainnet.id]: http(),
+    [optimism.id]: http(),
   },
 })
 
diff --git a/example/components/DepositContainer.tsx b/example/components/DepositContainer.tsx
index 644381b..207370b 100644
--- a/example/components/DepositContainer.tsx
+++ b/example/components/DepositContainer.tsx
@@ -1,14 +1,10 @@
+import { networkToChainId } from '@/constants/networkToChainId'
 import { useState } from 'react'
 import { AssetTypeToggle } from './AssetTypeToggle'
 import { DepositERC20 } from './DepositERC20'
 import { DepositETH } from './DepositETH'
 import { NetworkSelector } from './NetworkSelector'
 
-const networkToChainId: Record<'optimism' | 'base', number> = {
-  base: 84531,
-  optimism: 420,
-}
-
 export function DepositContainer() {
   const [selectedAssetType, setSelectedAssetType] = useState<'eth' | 'erc20'>('eth')
   const [selectedNetwork, setSelectedNetwork] = useState<'optimism' | 'base'>('base')
diff --git a/example/components/FinalizeContainer.tsx b/example/components/FinalizeContainer.tsx
index 9c1ae63..e6ede93 100644
--- a/example/components/FinalizeContainer.tsx
+++ b/example/components/FinalizeContainer.tsx
@@ -1,12 +1,8 @@
+import { networkToChainId } from '@/constants/networkToChainId'
 import { useState } from 'react'
 import { FinalizeWithdrawalTransaction } from './FinalizeWithdrawalTransaction'
 import { NetworkSelector } from './NetworkSelector'
 
-const networkToChainId: Record<'optimism' | 'base', number> = {
-  base: 84531,
-  optimism: 420,
-}
-
 export function FinalizeContainer() {
   const [selectedNetwork, setSelectedNetwork] = useState<'optimism' | 'base'>('base')
   return (
diff --git a/example/components/ProveContainer.tsx b/example/components/ProveContainer.tsx
index c7315eb..d7ef3b9 100644
--- a/example/components/ProveContainer.tsx
+++ b/example/components/ProveContainer.tsx
@@ -1,12 +1,8 @@
+import { networkToChainId } from '@/constants/networkToChainId'
 import { useState } from 'react'
 import { NetworkSelector } from './NetworkSelector'
 import { ProveWithdrawalTransaction } from './ProveWithdrawalTransaction'
 
-const networkToChainId: Record<'optimism' | 'base', number> = {
-  base: 84531,
-  optimism: 420,
-}
-
 export function ProveContainer() {
   const [selectedNetwork, setSelectedNetwork] = useState<'optimism' | 'base'>('base')
   return (
diff --git a/example/components/WithdrawContainer.tsx b/example/components/WithdrawContainer.tsx
index 33b4081..5deb3d7 100644
--- a/example/components/WithdrawContainer.tsx
+++ b/example/components/WithdrawContainer.tsx
@@ -1,14 +1,10 @@
+import { networkToChainId } from '@/constants/networkToChainId'
 import { useState } from 'react'
 import { AssetTypeToggle } from './AssetTypeToggle'
 import { NetworkSelector } from './NetworkSelector'
 import { WithdrawERC20 } from './WithdrawERC20'
 import { WithdrawETH } from './WithdrawETH'
 
-const networkToChainId: Record<'optimism' | 'base', number> = {
-  base: 84531,
-  optimism: 420,
-}
-
 export function WithdrawContainer() {
   const [selectedAssetType, setSelectedAssetType] = useState<'eth' | 'erc20'>('eth')
   const [selectedNetwork, setSelectedNetwork] = useState<'optimism' | 'base'>('base')
diff --git a/example/components/WithdrawERC20.tsx b/example/components/WithdrawERC20.tsx
index ef07268..a840110 100644
--- a/example/components/WithdrawERC20.tsx
+++ b/example/components/WithdrawERC20.tsx
@@ -1,3 +1,4 @@
+import { chainIdToExplorer } from '@/constants/chainIdToExplorer'
 import { useSimulateWithdrawERC20, useWriteWithdrawERC20 } from 'op-wagmi'
 import { useState } from 'react'
 import { Address, erc20Abi, isAddress, parseUnits } from 'viem'
@@ -8,11 +9,6 @@ import { InputGroup } from './InputGroup'
 
 const cbETHL2 = '0x7c6b91D9Be155A6Db01f749217d76fF02A7227F2'
 
-const chainIdToExplorer: Record<number, string> = {
-  84531: 'https://goerli.basescan.org',
-  420: 'https://goerli-optimism.etherscan.io',
-}
-
 type WithdrawERC20Props = {
   selectedChainId: number
 }
diff --git a/example/components/WithdrawETH.tsx b/example/components/WithdrawETH.tsx
index 381cf42..acaf77b 100644
--- a/example/components/WithdrawETH.tsx
+++ b/example/components/WithdrawETH.tsx
@@ -1,3 +1,4 @@
+import { chainIdToExplorer } from '@/constants/chainIdToExplorer'
 import { useSimulateWithdrawETH, useWriteWithdrawETH } from 'op-wagmi'
 import { useState } from 'react'
 import { Address, parseEther } from 'viem'
@@ -5,11 +6,6 @@ import { Action, ActionToggle } from './ActionToggle'
 import { Button } from './Button'
 import { InputGroup } from './InputGroup'
 
-const chainIdToExplorer: Record<number, string> = {
-  84531: 'https://goerli.basescan.org',
-  420: 'https://goerli-optimism.etherscan.io',
-}
-
 type WithdrawETHProps = {
   selectedChainId: number
 }
diff --git a/example/constants/chainIdToExplorer.ts b/example/constants/chainIdToExplorer.ts
new file mode 100644
index 0000000..dadf201
--- /dev/null
+++ b/example/constants/chainIdToExplorer.ts
@@ -0,0 +1,6 @@
+import { base, optimism } from 'viem/chains'
+
+export const chainIdToExplorer: Record<number, string> = {
+  [base.id]: base.blockExplorers.default.url,
+  [optimism.id]: optimism.blockExplorers.default.url,
+}
diff --git a/example/constants/networkToChainId.ts b/example/constants/networkToChainId.ts
new file mode 100644
index 0000000..9adb625
--- /dev/null
+++ b/example/constants/networkToChainId.ts
@@ -0,0 +1,6 @@
+import { base, optimism } from 'viem/chains'
+
+export const networkToChainId: Record<'optimism' | 'base', number> = {
+  base: base.id,
+  optimism: optimism.id,
+}