🔨 refactor: filter one product vatiant

:%s

framework/commerce/types/product.ts

@@ -64,6 +64,7 @@ export type ProductCard = {
   collection?: string,
   isNotSell?: boolean
   productVariantId?:string
+  productVariantName?:string
 }
 
 export type SearchProductsBody = {

framework/vendure/api/operations/get-all-products.ts

@@ -5,7 +5,7 @@ import { normalizeSearchResult } from '../../utils/normalize'
 import { getAllProductsQuery } from '../../utils/queries/get-all-products-query'
 import { OperationContext } from '@commerce/api/operations'
 
-export type ProductVariables = { first?: number, facetValueIds?: string[], collectionSlug?:string }
+export type ProductVariables = { first?: number, facetValueIds?: string[], collectionSlug?:string, groupByProduct?:boolean }
 
 export default function getAllProductsOperation({
   commerce,
@@ -32,7 +32,7 @@ export default function getAllProductsOperation({
         take: vars.first,
         facetValueIds: vars.facetValueIds,
         collectionSlug : vars.collectionSlug,
-        groupByProduct: true,
+        groupByProduct: vars.groupByProduct??true,
       },
     }
     const { data } = await config.fetch<GetAllProductsQuery>(query, {

framework/vendure/schema.d.ts

@@ -3039,7 +3039,7 @@ export type SearchResultFragment = { __typename?: 'SearchResult' } & Pick<
   SearchResult,
   'productId' | 'sku' | 'productName' | 'description' | 'slug' | 'sku' | 'currencyCode'
   | 'productAsset' | 'price' | 'priceWithTax' | 'currencyCode' 
-  | 'collectionIds' | 'productVariantId' | 'facetValueIds'
+  | 'collectionIds' | 'productVariantId' | 'facetValueIds' | "productVariantName"
 > & {
     productAsset?: Maybe<
       { __typename?: 'SearchResultAsset' } & Pick<

framework/vendure/utils/fragments/search-result-fragment.ts

@@ -8,6 +8,7 @@ export const searchResultFragment = /* GraphQL */ `
     sku
     currencyCode
     productVariantId
+    productVariantName
     productAsset {
       id
       preview

framework/vendure/utils/normalize.ts

@@ -11,6 +11,7 @@ export function normalizeSearchResult(item: SearchResultFragment): ProductCard {
     price: (item.priceWithTax as any).min / 100,
     currencyCode: item.currencyCode,
     productVariantId: item.productVariantId,
+    productVariantName:item.productVariantName,
     facetValueIds: item.facetValueIds,
     collectionIds: item.collectionIds,
     

pages/index.tsx

@@ -1,15 +1,13 @@
 import { ProductCard } from '@commerce/types/product';
 import { ProductVariables } from '@framework/api/operations/get-all-products';
-import { Facet, Product } from '@framework/schema';
 import { Collection, FacetValue } from '@framework/schema';
 import commerce from '@lib/api/commerce';
-import { ifError } from 'assert';
 import { GetStaticPropsContext } from 'next';
 import { Layout } from 'src/components/common';
 import { FeaturedProductsCarousel, FreshProducts, HomeBanner, HomeCategories, HomeCollection, HomeCTA, HomeFeature, HomeRecipe, HomeSubscribe, HomeVideo } from 'src/components/modules/home';
 import HomeSpice from 'src/components/modules/home/HomeSpice/HomeSpice';
 import { FACET } from 'src/utils/constanst.utils';
-import { getAllFeaturedFacetId, getFacetIdByName, getFreshProductFacetId } from 'src/utils/funtion.utils';
+import { FilterOneVatiant, getFacetIdByName } from 'src/utils/funtion.utils';
 import { CODE_FACET_DISCOUNT, CODE_FACET_FEATURED } from 'src/utils/constanst.utils';
 import { getAllFacetValueIdsByParentCode, getAllFacetValuesForFeatuedProducts, getAllPromies, getFreshFacetId } from 'src/utils/funtion.utils';
 import { PromiseWithKey } from 'src/utils/types.utils';
@@ -78,7 +76,9 @@ export async function getStaticProps({
     props.freshProducts = []
   }
 
-  const veggieProductvariables: ProductVariables = {}
+  const veggieProductvariables: ProductVariables = {
+    groupByProduct:false
+  }
   const veggieId = getFacetIdByName(facets,FACET.CATEGORY.PARENT_NAME,FACET.CATEGORY.VEGGIE)
   if (veggieId) {
     veggieProductvariables.facetValueIds = [veggieId]
@@ -121,7 +121,7 @@ export async function getStaticProps({
     const rs = await Promise.all(promises)
 
     promisesWithKey.map((item, index) => {
-      props[item.key] = item.keyResult ? rs[index][item.keyResult] : rs[index]
+      props[item.key] = item.keyResult ? FilterOneVatiant(rs[index][item.keyResult]) : rs[index]
       return null
     })
 

src/components/common/ProductCard/ProductCard.tsx

@@ -31,6 +31,7 @@ const ProductCardComponent = ({
   isNotSell,
   isSingleButton,
   productVariantId,
+  productVariantName
 }: ProductCardProps) => {
 
   const {addProduct,loading} = useAddProductToCart()
@@ -84,7 +85,7 @@ const ProductCardComponent = ({
         <div className={s.cardMidTop}>
           <Link href={`${ROUTE.PRODUCT_DETAIL}/${slug}`}>
             <a>
-              <div className={s.productname}>{name} </div>
+              <div className={s.productname}>{productVariantName} </div>
             </a>
           </Link>
           <div className={s.productWeight}>{weight}</div>

src/utils/funtion.utils.ts

@@ -1,4 +1,5 @@
 import { Facet } from "@commerce/types/facet";
+import { ProductCard } from "@commerce/types/product";
 import { Collection, FacetValue, SearchResultSortParameter } from './../../framework/vendure/schema.d';
 import { CODE_FACET_DISCOUNT, CODE_FACET_FEATURED, CODE_FACET_FEATURED_VARIANT, FACET, PRODUCT_SORT_OPTION_VALUE } from "./constanst.utils";
 import { PromiseWithKey, SortOrder } from "./types.utils";
@@ -139,4 +140,16 @@ export const getCategoryNameFromCollectionId = (colelctions: Collection[], colle
 
 export function getAllPromies(promies: PromiseWithKey[]) {
   return promies.map(item => item.promise)
+}
+
+export const FilterOneVatiant = (products:ProductCard[]) => {
+  let idList:string[] = []
+  let filtedProduct: ProductCard[]=[]
+  products.map((product:ProductCard)=>{
+    if(!idList.includes(product.id)){
+      filtedProduct.push(product)
+      idList.push(product.id)
+    }
+  })
+  return filtedProduct
 }