diff --git a/src/components/Swap/Layout.tsx b/src/components/Swap/Layout.tsx index 9f2eb9a..0e53140 100644 --- a/src/components/Swap/Layout.tsx +++ b/src/components/Swap/Layout.tsx @@ -62,6 +62,8 @@ interface SwapLayoutProps { sendDisabled: boolean; isSending: boolean; sendButtonText: string; + switchToRightChain: () => any; + isSwitchingChainsPending: boolean; } const SwapLayout: React.FC = ({ @@ -93,6 +95,8 @@ const SwapLayout: React.FC = ({ sendDisabled, isSending, sendButtonText, + switchToRightChain, + isSwitchingChainsPending, }) => { const [sourceTokenOpen, setSourceTokenOpen] = useState(false); const [destinationTokenOpen, setDestinationTokenOpen] = useState(false); @@ -368,17 +372,17 @@ const SwapLayout: React.FC = ({ ) : ( )} diff --git a/src/components/Swap/index.tsx b/src/components/Swap/index.tsx index e02f445..ab99d1c 100644 --- a/src/components/Swap/index.tsx +++ b/src/components/Swap/index.tsx @@ -12,7 +12,7 @@ import { computeSendType, sendTypeDetails } from "./hooks/computeSendType"; import useSwapErrors from "./hooks/useSwapErrors"; import useTokenSelection from "./hooks/useTokenSelection"; import { formatAddress } from "@/lib/utils"; -import { useAccount } from "wagmi"; +import { useAccount, useSwitchChain } from "wagmi"; import { useZetaChainClient } from "@/providers/UniversalKitProvider"; import { useBitcoinWallet } from "@/index"; @@ -30,6 +30,7 @@ export const Swap: React.FC = ({ config, }) => { const { address, chainId } = useAccount(); + const { switchChain, isPending: isSwitchingChainsPending } = useSwitchChain(); const { address: bitcoin } = useBitcoinWallet(); const client = useZetaChainClient(); @@ -80,6 +81,11 @@ export const Swap: React.FC = ({ client ); + const switchToRightChain = () => { + sourceTokenSelected && + switchChain({ chainId: Number(sourceTokenSelected.chain_id) }); + }; + const { isAmountGTFee, isAmountLTBalance } = useAmountValidation( sourceTokenSelected, destinationTokenSelected, @@ -195,6 +201,8 @@ export const Swap: React.FC = ({ sendDisabled={sendDisabled} isSending={isSending} sendButtonText={sendButtonText} + switchToRightChain={switchToRightChain} + isSwitchingChainsPending={isSwitchingChainsPending} /> ); diff --git a/src/wagmi.ts b/src/wagmi.ts index 4de3975..2eabb97 100644 --- a/src/wagmi.ts +++ b/src/wagmi.ts @@ -1,9 +1,21 @@ import { getDefaultConfig } from "@rainbow-me/rainbowkit"; -import { bscTestnet, sepolia, zetachainAthensTestnet } from "wagmi/chains"; +import { + bscTestnet, + sepolia, + zetachainAthensTestnet, + baseSepolia, + polygonAmoy, +} from "wagmi/chains"; export const config = getDefaultConfig({ appName: "RainbowKit demo", projectId: "YOUR_PROJECT_ID", - chains: [sepolia, bscTestnet, zetachainAthensTestnet], + chains: [ + sepolia, + bscTestnet, + zetachainAthensTestnet, + baseSepolia, + polygonAmoy, + ], ssr: false, });