From ea849354b90a96c4ff879056d7a78ac0af3b1191 Mon Sep 17 00:00:00 2001
From: Josh DeCristi <joshdecristi@Joshs-MacBook-Pro.local>
Date: Wed, 17 May 2023 01:06:08 -0400
Subject: [PATCH] fix: redirect to 404 if token address is not valid

---
 pages/reserve-overview.page.tsx | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/pages/reserve-overview.page.tsx b/pages/reserve-overview.page.tsx
index 5531c3b8ef..2e341f2564 100644
--- a/pages/reserve-overview.page.tsx
+++ b/pages/reserve-overview.page.tsx
@@ -19,24 +19,30 @@ import { ContentContainer } from '../src/components/ContentContainer';
 export default function ReserveOverview() {
   const router = useRouter();
   const { reserves } = useAppDataContext();
-  const underlyingAsset = router.query.underlyingAsset as string;
   const { breakpoints } = useTheme();
   const lg = useMediaQuery(breakpoints.up('lg'));
 
+  const [reserve, setReserve] = useState<ComputedReserveData>();
   const [mode, setMode] = useState<'overview' | 'actions' | ''>('');
 
+  const underlyingAsset = router.query.underlyingAsset as string;
+
   useEffect(() => {
     if (!mode) setMode('overview');
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [lg]);
 
-  const reserve = reserves.find(
-    (reserve) => reserve.underlyingAsset === underlyingAsset
-  ) as ComputedReserveData;
+    if (router.isReady && reserves.length) {
+      const reserveFound = reserves.find((reserve) => reserve.underlyingAsset === underlyingAsset);
+
+      if (reserveFound) setReserve(reserveFound);
+      else router.replace('/404');
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [lg, router.isReady, reserves.length]);
 
   const isOverview = mode === 'overview';
 
-  return (
+  return reserve ? (
     <AssetCapsProvider asset={reserve}>
       <ReserveTopDetails underlyingAsset={underlyingAsset} />
 
@@ -92,7 +98,7 @@ export default function ReserveOverview() {
         </Box>
       </ContentContainer>
     </AssetCapsProvider>
-  );
+  ) : null;
 }
 
 ReserveOverview.getLayout = function getLayout(page: React.ReactElement) {