diff --git a/src/components/modals/SwitchNetwork.tsx b/src/components/modals/SwitchNetwork.tsx index 7130d0d2dc..ef54ea81bb 100644 --- a/src/components/modals/SwitchNetwork.tsx +++ b/src/components/modals/SwitchNetwork.tsx @@ -28,6 +28,7 @@ const defaultNetworks = Object.keys(networksConfig).map(key => ({ networkId: Number(key), chainType: networksConfig[Number(key)].chainType, })); + interface ISwitchNetworkModal extends IModal { desc?: string; customNetworks?: INetworkIdWithChain[]; @@ -39,12 +40,12 @@ const SwitchNetwork: FC = ({ setShowModal, }) => { const { isAnimating, closeModal } = useModalAnimation(setShowModal); - const { switchChain } = useSwitchChain(); const { formatMessage } = useIntl(); const { walletChainType, handleSingOutAndSignInWithEVM, + setPendingNetworkId, handleSignOutAndSignInWithSolana, chain, } = useGeneralWallet(); @@ -59,6 +60,17 @@ const SwitchNetwork: FC = ({ }; }) || defaultNetworks; + const handleNetworkItemClick = (networkId: number) => { + if (walletChainType === ChainType.SOLANA) { + setPendingNetworkId(networkId); + handleSingOutAndSignInWithEVM(); + closeModal(); // Close the modal since we cannot control the wallet modal + } else { + switchChain?.({ chainId: networkId }); + closeModal(); + } + }; + return ( = ({ {desc &&

{desc}

} {networks?.map(({ networkId, chainType }) => ( { - if (walletChainType === ChainType.SOLANA) { - handleSingOutAndSignInWithEVM(); - } - if ( - walletChainType === ChainType.EVM && - chainType === ChainType.SOLANA - ) { - handleSignOutAndSignInWithSolana(); - } else { - switchChain?.({ chainId: networkId }); - } - closeModal(); - }} + onClick={() => handleNetworkItemClick(networkId)} $isSelected={networkId === chainId} key={networkId} $baseTheme={theme} diff --git a/src/providers/generalWalletProvider.tsx b/src/providers/generalWalletProvider.tsx index 8b0bb12e0e..112fcd1da2 100644 --- a/src/providers/generalWalletProvider.tsx +++ b/src/providers/generalWalletProvider.tsx @@ -14,7 +14,7 @@ import { Transaction, SystemProgram, } from '@solana/web3.js'; -import { useBalance, useDisconnect, useAccount } from 'wagmi'; +import { useBalance, useDisconnect, useAccount, useSwitchChain } from 'wagmi'; import { getWalletClient } from '@wagmi/core'; import { WalletAdapterNetwork } from '@solana/wallet-adapter-base'; import { useWeb3Modal } from '@web3modal/wagmi/react'; @@ -58,6 +58,7 @@ interface IGeneralWalletContext { handleSignOutAndShowWelcomeModal: () => Promise; isOnSolana: boolean; isOnEVM: boolean; + setPendingNetworkId: (id: number | null) => void; } // Create the context export const GeneralWalletContext = createContext({ @@ -76,6 +77,7 @@ export const GeneralWalletContext = createContext({ handleSignOutAndShowWelcomeModal: async () => {}, isOnSolana: false, isOnEVM: false, + setPendingNetworkId: () => {}, }); const getPhantomSolanaProvider = () => { @@ -93,6 +95,9 @@ export const GeneralWalletProvider: React.FC<{ const [walletChainType, setWalletChainType] = useState( null, ); + const [pendingNetworkId, setPendingNetworkId] = useState( + null, + ); const [walletAddress, setWalletAddress] = useState(null); const [balance, setBalance] = useState(); const [isConnected, setIsConnected] = useState(false); @@ -106,6 +111,7 @@ export const GeneralWalletProvider: React.FC<{ const router = useRouter(); const { token } = useAppSelector(state => state.user); const { setVisible, visible } = useWalletModal(); + const { switchChain } = useSwitchChain(); const isGIVeconomyRoute = useMemo( () => checkIsGIVeconomyRoute(router.route), @@ -266,6 +272,13 @@ export const GeneralWalletProvider: React.FC<{ } }, [walletChainType, nonFormattedEvBalance, solanaBalance]); + useEffect(() => { + if (walletChainType === ChainType.EVM && pendingNetworkId !== null) { + switchChain?.({ chainId: pendingNetworkId }); + setPendingNetworkId(null); + } + }, [walletChainType, pendingNetworkId]); + const signMessage = async ( message: string, ): Promise => { @@ -408,6 +421,7 @@ export const GeneralWalletProvider: React.FC<{ handleSignOutAndShowWelcomeModal, isOnSolana, isOnEVM, + setPendingNetworkId, }; // Render the provider component with the provided context value