fix: 🐛 nav update

HuskyHsu · Dec 16, 2023 · 5cd011a · 5cd011a
1 parent af40b5d
commit 5cd011a
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 17 deletions.
diff --git a/src/pages/Pokedex/UseFilter.ts b/src/pages/Pokedex/UseFilter.ts
@@ -11,18 +11,13 @@ const localStorageKey = 'pokeDexPage';
 
 export function UseFilter() {
   const [searchParams, setSearchParams] = useSearchParams();
+  const [display, setDisplay] = useState<Display>({
+    advancedFilter: false,
+    EVs: false,
+    ability: false,
+  });
 
   let cacheObj = getJsonCache(localStorageKey);
-  useEffect(() => {
-    for (const key of Object.keys(cacheObj)) {
-      if (searchParams.get(key) === null) {
-        setSearchParams((prev) => {
-          prev.set(key, cacheObj[key as keyof typeof cacheObj]);
-          return prev;
-        });
-      }
-    }
-  }, [cacheObj, searchParams, setSearchParams]);
 
   const filter: Filter = {
     keyword: searchParams.get('keyword') || '',
@@ -34,12 +29,6 @@ export function UseFilter() {
     tags: new Set((searchParams.get('tags') || '').split('-').filter(Boolean)),
   };
 
-  const [display, setDisplay] = useState<Display>({
-    advancedFilter: false,
-    EVs: false,
-    ability: false,
-  });
-
   const updateState = (key: ValueKeys<Filter, string>[keyof Filter]) => {
     return (val: string) => {
       if (val === '') {

diff --git a/src/routers/layouts/MainLayout/MainLayout.tsx b/src/routers/layouts/MainLayout/MainLayout.tsx
@@ -7,12 +7,20 @@ import { Icon } from '@/newComponents';
 import { Loading } from '@/newComponents/common';
 import { useBackToTopContext } from '@/newComponents/contexts';
 import { Item } from './Item';
+import { getJsonCache } from '@/store';
+
+const localStorageKey = 'pokeDexPage';
 
 function MainLayout() {
   const { ref, toggleVisibility } = useBackToTopContext();
   const location = useLocation();
   const navigate = useNavigate();
 
+  let cacheObj = getJsonCache(localStorageKey);
+  const navLink = Object.entries(cacheObj)
+    .map(([key, val]) => `${key}=${val}`)
+    .join('&');
+
   const hash = location.pathname.split('/')[1];
 
   const updateNav = (to: string) => {
@@ -59,7 +67,7 @@ function MainLayout() {
             text={'圖鑑清單'}
             color="bg-custom-red"
             selected={['pokedex', ''].includes(hash)}
-            onClick={() => updateNav('')}
+            onClick={() => updateNav(`/?${navLink}`)}
           >
             <Icon.Books className="h-5 w-5 fill-current" />
           </Item>