diff --git a/package.json b/package.json index 0d7c3d5..71d548e 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "ghost-dao-interface", "private": true, - "version": "0.7.3", + "version": "0.7.4", "type": "module", "scripts": { "dev": "vite", diff --git a/src/App.jsx b/src/App.jsx index 0f52ad6..e1d3e9a 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -160,7 +160,7 @@ function App() { setWrongNetworkToastId(null); } } - }, [chainId, addressChainId, isConnected]) + }, [chainId, addressChainId, isConnected, wrongNetworkToastId]) useEffect(() => { if (errorMessage) { diff --git a/src/components/TopBar/SelectNetwork.jsx b/src/components/TopBar/SelectNetwork.jsx index 2c8a848..a4b1770 100644 --- a/src/components/TopBar/SelectNetwork.jsx +++ b/src/components/TopBar/SelectNetwork.jsx @@ -12,8 +12,8 @@ import { isNetworkAvailable } from "../../constants"; import { parseKnownToken } from "../../components/Token/Token"; import { useSwitchChain } from 'wagmi'; -import toast from "react-hot-toast"; import { useNavigate, useLocation } from 'react-router-dom'; +import toast from "react-hot-toast"; function SelectNetwork({ chainId, wrongNetworkToastId, setWrongNetworkToastId, small }) { const theme = useTheme(); @@ -25,29 +25,43 @@ function SelectNetwork({ chainId, wrongNetworkToastId, setWrongNetworkToastId, s const [networkId, setNetworkId] = useState(chainId); useEffect(() => { - if (chainId !== networkId) setNetworkId(chainId); - }, [chainId]) - - useEffect(() => { - const chainName = chains.find((chain) => chain.id === chainId).name; const parts = pathname.split('/'); if (parts.length > 2) { - parts[1] = chainName.toLowerCase(); - const newPath = parts.join("/"); - navigate(newPath); + let targetChain = chains.at(0); + const chainName = parts[1].toLowerCase(); + const chain = chains.find(chain => chain.name.toLowerCase() === chainName); + if (chain && targetChain.name !== chain.name) { + targetChain = chain; + } + changeNetworkId(targetChain.name, targetChain.id) } - }, [chains, chainId]) + }, []) - const handleChange = (event) => { - const chainName = chains.find((chain) => chain.id === event.target.value).name; + useEffect(() => { + if (chainId !== networkId) setNetworkId(chainId); + }, [chainId, networkId]) + + const changeNetworkId = (chainName, newNetworkId) => { toast.dismiss(wrongNetworkToastId); const toastId = toast.loading(`Trying to connect to ${chainName} network... Wait please`, { position: 'bottom-right' }); setWrongNetworkToastId(toastId); - setNetworkId(event.target.value); - switchChain({ chainId: event.target.value }); + setNetworkId(newNetworkId); + switchChain({ chainId: newNetworkId }); + } + + const handleChange = (event) => { + const chainName = chains.find((chain) => chain.id === event.target.value).name; + changeNetworkId(chainName, event.target.value); + + const parts = pathname.split('/'); + if (parts.length > 2) { + parts[1] = chainName.toLowerCase(); + const newPath = parts.join("/"); + navigate(newPath, { replace: true }); + } } return( diff --git a/src/containers/NotFound/NotFound.jsx b/src/containers/NotFound/NotFound.jsx index d132362..b180570 100644 --- a/src/containers/NotFound/NotFound.jsx +++ b/src/containers/NotFound/NotFound.jsx @@ -31,7 +31,6 @@ export default function NotFound({ }); setWrongNetworkToastId(toastId); - setNetworkId(newChainId); switchChain({ chainId: newChainId }); }