✨ feat:(product detail) get relevant product

:%s

pages/product/[slug].tsx

@@ -1,21 +1,21 @@
 
+import { Product } from '@framework/schema'
 import commerce from '@lib/api/commerce'
 import { GetStaticPathsContext, GetStaticPropsContext, InferGetStaticPropsType } from 'next'
 import { Layout, RecipeDetail, RecommendedRecipes, RelevantBlogPosts } from 'src/components/common'
 import { ProductInfoDetail, ReleventProducts, ViewedProducts } from 'src/components/modules/product-detail'
-import { REVALIDATE_TIME } from 'src/utils/constanst.utils'
+import { 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 }: InferGetStaticPropsType<typeof getStaticProps>) {
-  console.log("product: ", product)
+export default function Slug({ product, relevantProducts }: InferGetStaticPropsType<typeof getStaticProps>) {
 
   return <>
     <ProductInfoDetail />
     <RecipeDetail ingredients={INGREDIENT_DATA_TEST} />
     <RecommendedRecipes data={RECIPE_DATA_TEST} />
-    <ReleventProducts />
+    <ReleventProducts data={relevantProducts}/>
     <ViewedProducts />
     <RelevantBlogPosts data={BLOGS_DATA_TEST} title="relevent blog posts" />
   </>
@@ -31,12 +31,34 @@ export async function getStaticProps({
   let promisesWithKey = [] as PromiseWithKey[]
   let props = {} as any
 
-  const productPromise = commerce.getProduct({
+  const product = await commerce.getProduct({
     variables: { slug: params!.slug },
     config,
     preview,
   })
-  promisesWithKey.push({ key: 'product', promise: productPromise, keyResult: 'product' })
+  props.product = product
+
+
+  if (!product) {
+    throw new Error(`Product with slug '${params!.slug}' not found`)
+  }
+
+  // relevant product
+  const relevantFacetIds = product.facetValueIds
+  if (relevantFacetIds && relevantFacetIds.length > 0) {
+    const relevantProductsPromise = commerce.getAllProducts({
+      variables: {
+        first: MAX_PRODUCT_CAROUSEL,
+        facetValueIds: relevantFacetIds,
+      },
+      config,
+      preview,
+    })
+    promisesWithKey.push({ key: 'relevantProducts', promise: relevantProductsPromise, keyResult: 'products' })
+  } else {
+    props.relevantProducts = []
+  }
+
 
   try {
     const promises = getAllPromies(promisesWithKey)
@@ -47,12 +69,17 @@ export async function getStaticProps({
       return null
     })
 
+    if (props.relevantProducts.length > 0) {
+      const relevantProducts = props.relevantProducts.filter((item: Product) => item.id !== product.id)
+      props.relevantProducts = relevantProducts
+    }
+
     return {
       props,
       revalidate: REVALIDATE_TIME,
     }
   } catch (err) {
-
+    console.log('err: ', err)
   }
 }