crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-22 20:26:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refractor

Browse Source
This commit is contained in:
gowarezzz
2021-08-19 09:50:38 +07:00
parent 0e7e7b7d5f
commit 0f82dfdcba
441 changed files with 191 additions and 81002 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
pages/index.tsx
View File

@@ -4,6 +4,7 @@ import { ProductCard } from '@components/product'
import { Grid, Marquee, Hero } from '@components/ui'
// import HomeAllProductsGrid from '@components/common/HomeAllProductsGrid'
import type { GetStaticPropsContext, InferGetStaticPropsType } from 'next'
import HomeAllProductsGrid from '@components/common/HomeAllProductsGrid'
export async function getStaticProps({
preview,
@@ -37,52 +38,16 @@ export async function getStaticProps({
export default function Home({
products,
categories,
brands,
}: InferGetStaticPropsType<typeof getStaticProps>) {
return (
<>
<Grid variant="filled">
{products.slice(0, 3).map((product: any, i: number) => (
<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: any, i: number) => (
<ProductCard key={product.id} product={product} variant="slim" />
))}
</Marquee>
<Hero
headline=" Dessert dragée halvah croissant."
description="Cupcake ipsum dolor sit amet lemon drops pastry cotton candy. Sweet carrot cake macaroon bonbon croissant fruitcake jujubes macaroon oat cake. Soufflé bonbon caramels jelly beans. Tiramisu sweet roll cheesecake pie carrot cake. "
/>
<Grid layout="B" variant="filled">
{products.slice(0, 3).map((product: any, i: number) => (
<ProductCard
key={product.id}
product={product}
imgProps={{
width: i === 0 ? 1080 : 540,
height: i === 0 ? 1080 : 540,
}}
/>
))}
</Grid>
<Marquee>
{products.slice(3).map((product: any, i: number) => (
<ProductCard key={product.id} product={product} variant="slim" />
))}
</Marquee>
{/* <HomeAllProductsGrid
newestProducts={products}
<HomeAllProductsGrid
products={products}
categories={categories}
brands={brands}
/> */}
/>
</>
)
}

42
pages/orders.tsx
View File

@@ -1,42 +0,0 @@
import type { GetStaticPropsContext } from 'next'
import commerce from '@lib/api/commerce'
import { Bag } from '@components/icons'
import { Layout } from '@components/common'
import { Container, Text } from '@components/ui'
export async function getStaticProps({
preview,
locale,
locales,
}: GetStaticPropsContext) {
const config = { locale, locales }
const pagesPromise = commerce.getAllPages({ config, preview })
const siteInfoPromise = commerce.getSiteInfo({ config, preview })
const { pages } = await pagesPromise
const { categories } = await siteInfoPromise
return {
props: { pages, categories },
}
}
export default function Orders() {
return (
<Container>
<Text variant="pageHeading">My Orders</Text>
<div className="flex-1 p-24 flex flex-col justify-center items-center ">
<span className="border border-dashed border-secondary rounded-full flex items-center justify-center w-16 h-16 p-12 bg-primary text-primary">
<Bag className="absolute" />
</span>
<h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
No orders found
</h2>
<p className="text-accent-6 px-10 text-center pt-2">
Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
</p>
</div>
</Container>
)
}
Orders.Layout = Layout

48
pages/profile.tsx
View File

@@ -1,48 +0,0 @@
import type { GetStaticPropsContext } from 'next'
import useCustomer from '@framework/customer/use-customer'
import commerce from '@lib/api/commerce'
import { Layout } from '@components/common'
import { Container, Text } from '@components/ui'
export async function getStaticProps({
preview,
locale,
locales,
}: GetStaticPropsContext) {
const config = { locale, locales }
const pagesPromise = commerce.getAllPages({ config, preview })
const siteInfoPromise = commerce.getSiteInfo({ config, preview })
const { pages } = await pagesPromise
const { categories } = await siteInfoPromise
return {
props: { pages, categories },
}
}
export default function Profile() {
const { data } = useCustomer()
return (
<Container>
<Text variant="pageHeading">My Profile</Text>
{data && (
<div className="grid lg:grid-cols-12">
<div className="lg:col-span-8 pr-4">
<div>
<Text variant="sectionHeading">Full Name</Text>
<span>
{data.firstName} {data.lastName}
</span>
</div>
<div className="mt-5">
<Text variant="sectionHeading">Email</Text>
<span>{data.email}</span>
</div>
</div>
</div>
)}
</Container>
)
}
Profile.Layout = Layout

9
pages/search.tsx
View File

@@ -1,9 +0,0 @@
import { getSearchStaticProps } from '@lib/search-props'
import type { GetStaticPropsContext } from 'next'
import Search from '@components/search'
export async function getStaticProps(context: GetStaticPropsContext) {
return getSearchStaticProps(context)
}
export default Search

16
pages/search/[category].tsx
View File

@@ -1,16 +0,0 @@
import { getSearchStaticProps } from '@lib/search-props'
import type { GetStaticPathsResult, GetStaticPropsContext } from 'next'
import Search from '@components/search'
export async function getStaticProps(context: GetStaticPropsContext) {
return getSearchStaticProps(context)
}
export function getStaticPaths(): GetStaticPathsResult {
return {
paths: [],
fallback: 'blocking',
}
}
export default Search

16
pages/search/designers/[name].tsx
View File

@@ -1,16 +0,0 @@
import { getSearchStaticProps } from '@lib/search-props'
import type { GetStaticPathsResult, GetStaticPropsContext } from 'next'
import Search from '@components/search'
export async function getStaticProps(context: GetStaticPropsContext) {
return getSearchStaticProps(context)
}
export function getStaticPaths(): GetStaticPathsResult {
return {
paths: [],
fallback: 'blocking',
}
}
export default Search

16
pages/search/designers/[name]/[category].tsx
View File

@@ -1,16 +0,0 @@
import { getSearchStaticProps } from '@lib/search-props'
import type { GetStaticPathsResult, GetStaticPropsContext } from 'next'
import Search from '@components/search'
export async function getStaticProps(context: GetStaticPropsContext) {
return getSearchStaticProps(context)
}
export function getStaticPaths(): GetStaticPathsResult {
return {
paths: [],
fallback: 'blocking',
}
}
export default Search

71
pages/wishlist.tsx
View File

@@ -1,71 +0,0 @@
import type { GetStaticPropsContext } from 'next'
import commerce from '@lib/api/commerce'
import { Heart } from '@components/icons'
import { Layout } from '@components/common'
import { Text, Container } from '@components/ui'
import { useCustomer } from '@framework/customer'
import { WishlistCard } from '@components/wishlist'
import useWishlist from '@framework/wishlist/use-wishlist'
export async function getStaticProps({
preview,
locale,
locales,
}: GetStaticPropsContext) {
// Disabling page if Feature is not available
if (!process.env.COMMERCE_WISHLIST_ENABLED) {
return {
notFound: true,
}
}
const config = { locale, locales }
const pagesPromise = commerce.getAllPages({ config, preview })
const siteInfoPromise = commerce.getSiteInfo({ config, preview })
const { pages } = await pagesPromise
const { categories } = await siteInfoPromise
return {
props: {
pages,
categories,
},
}
}
export default function Wishlist() {
const { data: customer } = useCustomer()
// @ts-ignore Shopify - Fix this types
const { data, isLoading, isEmpty } = useWishlist({ includeProducts: true })
return (
<Container>
<div className="mt-3 mb-20">
<Text variant="pageHeading">My Wishlist</Text>
<div className="group flex flex-col">
{isLoading || isEmpty ? (
<div className="flex-1 px-12 py-24 flex flex-col justify-center items-center ">
<span className="border border-dashed border-secondary flex items-center justify-center w-16 h-16 bg-primary p-12 rounded-lg text-primary">
<Heart className="absolute" />
</span>
<h2 className="pt-6 text-2xl font-bold tracking-wide text-center">
Your wishlist is empty
</h2>
<p className="text-accent-6 px-10 text-center pt-2">
Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
</p>
</div>
) : (
data &&
// @ts-ignore Shopify - Fix this types
data.items?.map((item) => (
<WishlistCard key={item.id} product={item.product! as any} />
))
)}
</div>
</div>
</Container>
)
}
Wishlist.Layout = Layout