import { GetStaticPropsContext, InferGetStaticPropsType } from 'next' import getSiteInfo from '@lib/bigcommerce/api/operations/get-site-info' import useSearch from '@lib/bigcommerce/products/use-search' import { Layout } from '@components/core' import { Container, Grid } from '@components/ui' import { ProductCard } from '@components/product' import { useRouter } from 'next/router' export async function getStaticProps({ preview }: GetStaticPropsContext) { const { categories, brands } = await getSiteInfo() return { props: { categories, brands }, } } export default function Home({ categories, brands, }: InferGetStaticPropsType) { const router = useRouter() const { q } = router.query const { data } = useSearch({ search: typeof q === 'string' ? q : '', }) return (
  • All Categories
  • {categories.map((cat) => (
  • {cat.name}
  • ))}
  • All Designers
  • {brands.flatMap(({ node }) => (
  • {node.name}
  • ))}
{data ? ( <> {q && (
{data.found ? ( <>Showing {data.products.length} results for ) : ( <>There are no products that match )}{' '} "{q}"
)} ) : (
Searching...
)}
  • Relevance
  • Latest arrivals
  • Trending
  • Price: Low to high
  • Price: High to low
) } Home.Layout = Layout