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

viewed prodyct

Browse Source
This commit is contained in:
DatNguyen
2021-10-15 11:18:29 +07:00
parent 98265d0f2b
commit 14fa653713
12 changed files with 113 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
pages/product/[slug].tsx
View File

@@ -1,22 +1,48 @@
import { Product } from '@framework/schema'
import { Collection } from '@commerce/types/collection'
import { Product, ProductCard } from '@commerce/types/product'
import commerce from '@lib/api/commerce'
import { GetStaticPathsContext, GetStaticPropsContext, InferGetStaticPropsType } from 'next'
import { useEffect } from 'react'
import { Layout, RecipeDetail, RecommendedRecipes, RelevantBlogPosts } from 'src/components/common'
import { useLocalStorage } from 'src/components/hooks/useLocalStorage'
import { ProductInfoDetail, ReleventProducts, ViewedProducts } from 'src/components/modules/product-detail'
import { MAX_PRODUCT_CAROUSEL, REVALIDATE_TIME } from 'src/utils/constanst.utils'
import { LOCAL_STORAGE_KEY, MAX_PRODUCT_CAROUSEL, REVALIDATE_TIME } from 'src/utils/constanst.utils'
import { BLOGS_DATA_TEST, INGREDIENT_DATA_TEST, RECIPE_DATA_TEST } from 'src/utils/demo-data'
import { getAllPromies } from 'src/utils/funtion.utils'
import { PromiseWithKey } from 'src/utils/types.utils'
export default function Slug({ product, relevantProducts, collections }: InferGetStaticPropsType<typeof getStaticProps>) {
interface Props {
relevantProducts: ProductCard[],
product: Product,
collections: Collection[]
}
export default function Slug({ product, relevantProducts, collections }: Props) {
const [viewedProduct,setViewedProduct] = useLocalStorage<Product[]>(LOCAL_STORAGE_KEY.VIEWEDPRODUCT, []);
useEffect(() => {
// const local = localStorage.getItem(LOCAL_STORAGE_KEY.VIEWEDPRODUCT)
// if(local){
// const oldList:Product[] = JSON.parse(local)
// if(!oldList.find(p => p.id === product.id)){
// localStorage.setItem(LOCAL_STORAGE_KEY.VIEWEDPRODUCT,JSON.stringify([...oldList,product]))
// }
// }else{
// localStorage.setItem(LOCAL_STORAGE_KEY.VIEWEDPRODUCT,JSON.stringify([product]))
// }
if(viewedProduct){
if(!viewedProduct.find(p => p.id === product.id)){
setViewedProduct([...viewedProduct, product])
}
}else{
setViewedProduct([product])
}
}, [product])
return <>
<ProductInfoDetail productDetail={product} collections={collections}/>
<ProductInfoDetail productDetail={product}/>
<RecipeDetail ingredients={INGREDIENT_DATA_TEST} />
<RecommendedRecipes data={RECIPE_DATA_TEST} />
<ReleventProducts data={relevantProducts} collections={collections}/>
<ViewedProducts />
<ViewedProducts/>
<RelevantBlogPosts data={BLOGS_DATA_TEST} title="relevent blog posts" />
</>
}
@@ -68,7 +94,6 @@ export async function getStaticProps({
})
promisesWithKey.push({ key: 'collections', promise: collectionsPromise, keyResult: 'collections' })
try {
const promises = getAllPromies(promisesWithKey)
const rs = await Promise.all(promises)