crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-03-14 14:42:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

Removes unnecessary useEffect's on search sorts (#1124)

Browse Source
This commit is contained in:
Kai Hao 2023-07-29 00:19:13 +08:00 committed by GitHub
parent 61b134a66c
commit 049d903a5b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 2 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/layout/search/filter/item.tsx
View File

@ -5,22 +5,17 @@ import { SortFilterItem } from 'lib/constants';
import { createUrl } from 'lib/utils';
import Link from 'next/link';
import { usePathname, useSearchParams } from 'next/navigation';
import { useEffect, useState } from 'react';
import type { ListItem, PathFilterItem } from '.';
function PathFilterItem({ item }: { item: PathFilterItem }) {
const pathname = usePathname();
const searchParams = useSearchParams();
const [active, setActive] = useState(pathname === item.path);
const active = pathname === item.path;
const newParams = new URLSearchParams(searchParams.toString());
const DynamicTag = active ? 'p' : Link;
newParams.delete('q');
useEffect(() => {
setActive(pathname === item.path);
}, [pathname, item.path]);
return (
<li className="mt-2 flex text-black dark:text-white" key={item.title}>
<DynamicTag
@ -41,7 +36,7 @@ function PathFilterItem({ item }: { item: PathFilterItem }) {
function SortFilterItem({ item }: { item: SortFilterItem }) {
const pathname = usePathname();
const searchParams = useSearchParams();
const [active, setActive] = useState(searchParams.get('sort') === item.slug);
const active = searchParams.get('sort') === item.slug;
const q = searchParams.get('q');
const href = createUrl(
pathname,
@ -52,10 +47,6 @@ function SortFilterItem({ item }: { item: SortFilterItem }) {
);
const DynamicTag = active ? 'p' : Link;
useEffect(() => {
setActive(searchParams.get('sort') === item.slug);
}, [searchParams, item.slug]);
return (
<li className="mt-2 flex text-sm text-black dark:text-white" key={item.title}>
<DynamicTag