Fixes relevance removing search query (#1076)

vercel · Jul 14, 2023 · 3455367 · 3455367
1 parent 37b436a
commit 3455367
Showing 1 changed file with 14 additions and 16 deletions.
diff --git a/components/layout/search/filter/item.tsx b/components/layout/search/filter/item.tsx
@@ -13,6 +13,7 @@ function PathFilterItem({ item }: { item: PathFilterItem }) {
   const searchParams = useSearchParams();
   const [active, setActive] = useState(pathname === item.path);
   const newParams = new URLSearchParams(searchParams.toString());
+  const DynamicTag = active ? 'p' : Link;
 
   newParams.delete('q');
 
@@ -22,7 +23,7 @@ function PathFilterItem({ item }: { item: PathFilterItem }) {
 
   return (
     <li className="mt-2 flex text-black dark:text-white" key={item.title}>
-      <Link
+      <DynamicTag
         href={createUrl(item.path, newParams)}
         className={clsx(
           'w-full text-sm underline-offset-4 hover:underline dark:hover:text-gray-100',
@@ -32,7 +33,7 @@ function PathFilterItem({ item }: { item: PathFilterItem }) {
         )}
       >
         {item.title}
-      </Link>
+      </DynamicTag>
     </li>
   );
 }
@@ -42,33 +43,30 @@ function SortFilterItem({ item }: { item: SortFilterItem }) {
   const searchParams = useSearchParams();
   const [active, setActive] = useState(searchParams.get('sort') === item.slug);
   const q = searchParams.get('q');
+  const href = createUrl(
+    pathname,
+    new URLSearchParams({
+      ...(q && { q }),
+      ...(item.slug && item.slug.length && { sort: item.slug })
+    })
+  );
+  const DynamicTag = active ? 'p' : Link;
 
   useEffect(() => {
     setActive(searchParams.get('sort') === item.slug);
   }, [searchParams, item.slug]);
 
-  const href =
-    item.slug && item.slug.length
-      ? createUrl(
-          pathname,
-          new URLSearchParams({
-            ...(q && { q }),
-            sort: item.slug
-          })
-        )
-      : pathname;
-
   return (
     <li className="mt-2 flex text-sm text-black dark:text-white" key={item.title}>
-      <Link
-        prefetch={false}
+      <DynamicTag
+        prefetch={!active ? false : undefined}
         href={href}
         className={clsx('w-full', {
           'underline underline-offset-4': active
         })}
       >
         {item.title}
-      </Link>
+      </DynamicTag>
     </li>
   );
 }