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

feat(poc): remove router from layout navbar

Browse Source
This commit is contained in:
Björn Meyer 2023-07-17 09:10:09 +02:00
parent 67e5c46b9b
commit 6e09bf12c4
1 changed files with 13 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
components/layout/navbar/search.tsx
View File

@ -1,28 +1,29 @@
'use client'; 'use client';
import { useRouter, useSearchParams } from 'next/navigation'; // import { useRouter, useSearchParams } from 'next/navigation';
import SearchIcon from 'components/icons/search'; import SearchIcon from 'components/icons/search';
import { createUrl } from 'lib/utils'; // import { createUrl } from 'lib/utils';
export default function Search() { export default function Search() {
const router = useRouter(); //const router = useRouter();
const searchParams = useSearchParams(); //const searchParams = useSearchParams();
function onSubmit(e: React.FormEvent<HTMLFormElement>) { function onSubmit(e: React.FormEvent<HTMLFormElement>) {
e.preventDefault(); e.preventDefault();
const val = e.target as HTMLFormElement; const val = e.target as HTMLFormElement;
const search = val.search as HTMLInputElement; const search = val.search as HTMLInputElement;
const newParams = new URLSearchParams(searchParams.toString()); console.log(`Search:` + search);
// const newParams = new URLSearchParams(searchParams.toString());
if (search.value) { // if (search.value) {
newParams.set('q', search.value); // newParams.set('q', search.value);
} else { // } else {
newParams.delete('q'); // newParams.delete('q');
} // }
router.push(createUrl('/search', newParams)); // router.push(createUrl('/search', newParams));
} }
return ( return (
@ -35,7 +36,7 @@ export default function Search() {
name="search" name="search"
placeholder="Search for products..." placeholder="Search for products..."
autoComplete="off" autoComplete="off"
defaultValue={searchParams?.get('q') || ''} // defaultValue={searchParams?.get('q') || ''}
className="w-full px-4 py-2 text-black dark:bg-black dark:text-gray-100" className="w-full px-4 py-2 text-black dark:bg-black dark:text-gray-100"
/> />
<div className="absolute right-0 top-0 mr-3 flex h-full items-center"> <div className="absolute right-0 top-0 mr-3 flex h-full items-center">