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

Search functionality

Browse Source
This commit is contained in:
Belen Curcio 2020-10-12 11:10:20 -03:00
parent aa8e8fe89d
commit 2a087905a7
2 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
components/core/Searchbar/Searchbar.tsx
View File

@ -19,10 +19,15 @@ const Searchbar: FC<Props> = ({ className }) => {
<input
className={s.input}
placeholder="Search for products..."
onChange={(e) => {
onKeyUp={(e) => {
e.preventDefault()
router.push('/search')
console.log('changing')
if (e.key === 'Enter') {
router.push({
pathname: `/search`,
query: { q: e.currentTarget.value },
})
}
}}
/>
<div className={s.iconContainer}>

4
pages/search.tsx
View File

@ -4,6 +4,7 @@ import { Layout } from '@components/core'
import { Grid, Marquee, Hero } from '@components/ui'
import { ProductCard } from '@components/product'
import getSiteInfo from '@lib/bigcommerce/api/operations/get-site-info'
import { useRouter } from 'next/router'
export async function getStaticProps({ preview }: GetStaticPropsContext) {
const { products } = await getAllProducts()
@ -19,6 +20,7 @@ export default function Home({
categories,
brands,
}: InferGetStaticPropsType<typeof getStaticProps>) {
const router = useRouter()
return (
<div className="grid grid-cols-12 gap-8 mt-3 mb-20">
<div className="col-span-2">
@ -45,7 +47,7 @@ export default function Home({
</div>
<div className="col-span-8">
<div className="mb-12">
Showing 8 results for "<strong>Jacket</strong>"
Showing 8 results for "<strong>{router.query.q}</strong>"
</div>
<Grid
items={[