Merge pull request #546 from alleslabs/feat/404

fix: selected chain 404

CHANGELOG.md

@@ -64,6 +64,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Improvements
 
+- [#546](https://github.com/alleslabs/celatone-frontend/pull/546) Handle 404 on the current selected chain
 - [#540](https://github.com/alleslabs/celatone-frontend/pull/540) Add open proposal configuration
 - [#532](https://github.com/alleslabs/celatone-frontend/pull/532) Implement new Amplitude structure
 - [#538](https://github.com/alleslabs/celatone-frontend/pull/538) Add empty state in query and execute with json schema

src/lib/app-provider/hooks/useNetworkChange.ts

@@ -14,11 +14,8 @@ export const useNetworkChange = (
   const navigate = useInternalNavigate();
 
   useEffect(() => {
-    const networkRoute = router.query.network
-      ? getFirstQueryParam(router.query.network, DEFAULT_SUPPORTED_CHAIN_ID)
-      : router.asPath.split("/")[1];
-
-    if (router.isReady || router.pathname === "/404") {
+    if (router.isReady) {
+      const networkRoute = getFirstQueryParam(router.query.network);
       // Redirect to default chain if there is no network query provided
       if (!router.query.network) {
         navigate({
@@ -30,14 +27,29 @@ export const useNetworkChange = (
         router.pathname === "/[network]" &&
         !SUPPORTED_CHAIN_IDS.includes(networkRoute)
       ) {
+        // Redirect to default network 404 if `/invalid_network`
         navigate({
-          pathname: "/",
-          replace: true,
+          pathname: "/404",
+          query: {
+            network: DEFAULT_SUPPORTED_CHAIN_ID,
+          },
         });
       } else if (networkRoute !== networkRef.current) {
         networkRef.current = networkRoute;
         handleOnChainIdChange(networkRoute);
       }
+    } else if (router.pathname === "/404") {
+      const networkRoute = router.asPath.split("/")[1];
+      // Redirect to the current network 404 if `/current_network/random_path`
+      // If the current network is also invalid, redicrect to default network 404
+      navigate({
+        pathname: "/404",
+        query: {
+          network: SUPPORTED_CHAIN_IDS.includes(networkRoute)
+            ? networkRoute
+            : DEFAULT_SUPPORTED_CHAIN_ID,
+        },
+      });
     }
   }, [
     handleOnChainIdChange,