commerce/pages/index.tsx
Michael Bromley da4371090d
Vendure provider (#223)
* Minimal list/detail views working with Vendure

* Implement useCart/useAddItem

* Implement useUpdateItem & useRemoveItem

* Implement useSearch

* Add operations codegen, tidy up

* Dummy checkout page

* Implement auth/customer hooks

* Use env var for Shop API url

* Add some documentation

* Improve error handling

* Optimize preview image size

* Fix accidental change

* Update Vendure provider to latest changes

* Vendure provider: split out gql operations, remove unused files

* Update Vendure provider readme

* Add local next.config to Vendure provider, update docs

* Update to use demo server

* Fix build errors

* Use proxy for vendure api

* Simplify instructions in Vendure readme

* Refactor Vendure checkout api handler

* Improve image quality
2021-05-27 18:06:56 -03:00

115 lines
3.1 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { Layout } from '@components/common'
import { Grid, Marquee, Hero } from '@components/ui'
import { ProductCard } from '@components/product'
// import HomeAllProductsGrid from '@components/common/HomeAllProductsGrid'
import type { GetStaticPropsContext, InferGetStaticPropsType } from 'next'
import { getConfig } from '@framework/api'
import getAllProducts from '@framework/product/get-all-products'
import getSiteInfo from '@framework/common/get-site-info'
import getAllPages from '@framework/common/get-all-pages'
export async function getStaticProps({
preview,
locale,
}: GetStaticPropsContext) {
const config = getConfig({ locale })
const { products } = await getAllProducts({
variables: { first: 12 },
config,
preview,
})
// const { categories, brands } = await getSiteInfo({ config, preview })
// const { pages } = await getAllPages({ config, preview })
return {
props: {
products,
categories: [],
brands: [],
pages: [],
},
revalidate: 14400,
}
}
export default function Home({
products,
brands,
categories,
}: InferGetStaticPropsType<typeof getStaticProps>) {
return (
<>
<Grid>
{products.slice(0, 3).map((product, i) => (
<ProductCard
key={product.id}
product={product}
imgProps={{
width: i === 0 ? 1080 : 540,
height: i === 0 ? 1080 : 540,
}}
/>
))}
</Grid>
<Marquee variant="secondary">
{products.slice(0, 3).map((product, i) => (
<ProductCard
key={product.id}
product={product}
variant="slim"
imgProps={{
width: 320,
height: 320,
}}
/>
))}
</Marquee>
<Hero
headline="Release Details: The Yeezy BOOST 350 V2 Natural'"
description="
The Yeezy BOOST 350 V2 lineup continues to grow. We recently had the
Carbon iteration, and now release details have been locked in for
this Natural joint. Revealed by Yeezy Mafia earlier this year, the
shoe was originally called Abez, which translated to Tin in
Hebrew. Its now undergone a name change, and will be referred to as
Natural."
/>
<Grid layout="B">
{products.slice(0, 3).map((product, i) => (
<ProductCard
key={product.id}
product={product}
imgProps={{
width: i === 0 ? 1080 : 540,
height: i === 0 ? 1080 : 540,
}}
/>
))}
</Grid>
<Marquee>
{products.slice(0, 3).map((product, i) => (
<ProductCard
key={product.id}
product={product}
variant="slim"
imgProps={{
width: 320,
height: 320,
}}
/>
))}
</Marquee>
{/* <HomeAllProductsGrid
newestProducts={products}
categories={categories}
brands={brands}
/> */}
</>
)
}
Home.Layout = Layout