diff --git a/src/components/DefaultLayout.tsx b/src/components/DefaultLayout.tsx index 4c6f56a2b2f67103f7d461b12b3169d0dbefa8f6..cd84d36c0d761ac75eea0948b7fdf28a9d09265c 100644 --- a/src/components/DefaultLayout.tsx +++ b/src/components/DefaultLayout.tsx @@ -291,8 +291,8 @@ function Search({ className }: { className?: string }) { e.preventDefault(); let form = e.currentTarget; let query = form.query.value; - if (query === "") router.push("/search"); - router.push("/search?q=" + encodeURIComponent(query)); + const newPath = query === "" ? "/search" : "/search?q=" + encodeURIComponent(query); + if (router.pathname !== newPath) router.push(newPath); }; const onChange = (e: React.ChangeEvent<HTMLInputElement>) => { setQuery(e.target.value); diff --git a/src/pages/search.tsx b/src/pages/search.tsx index d8c171dc33603cc3ef6dc1a98dd2dc199d9f18ea..5b7b0e99429aaaced4a760547b7ee8fa39ce5511 100644 --- a/src/pages/search.tsx +++ b/src/pages/search.tsx @@ -62,7 +62,9 @@ export default function Search() { // TODO: this code needs more cleanup, variable names are not very descriptive useEffect(() => { - setQuery(params.get("q")); + if (params.has("q")) setQuery(params.get("q")); + else if (query !== undefined && query !== null && query.length > 0) setQuery(""); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [params]); const updateSearchResults = () => { @@ -91,7 +93,7 @@ export default function Search() { }; // eslint-disable-next-line react-hooks/exhaustive-deps - useEffect(updateSearchResults, [query, api, router]); + useEffect(updateSearchResults, [query, api]); const [updateQueryDeferred, updateQueryNow] = useDebounce(() => { setQuery(workingQuery.current);