🐛 bug: fix bug before merge to common

:%s

src/components/modules/home/CollectionCarcoucel/CollectionCarcoucel.tsx

@@ -1,16 +1,18 @@
 import React from 'react'
 import {
   CollectionHeading,
-  ProductCaroucel,
+  ProductCarousel,
   ViewAllItem,
 } from 'src/components/common'
 import { CollectionHeadingProps } from 'src/components/common/CollectionHeading/CollectionHeading'
 import { ProductCardProps } from 'src/components/common/ProductCard/ProductCard'
+import { QUERY_KEY, ROUTE } from 'src/utils/constanst.utils'
 import s from './CollectionCarcoucel.module.scss'
 interface ColectionCarcoucelProps extends CollectionHeadingProps {
   data: ProductCardProps[]
   itemKey: string
-  viewAllLink?: string
+  viewAllLink?: string,
+  category:string
 }
 
 const ColectionCarcoucel = ({
@@ -18,7 +20,8 @@ const ColectionCarcoucel = ({
   itemKey,
   title,
   subtitle,
-  type
+  type,
+  category
 }: ColectionCarcoucelProps) => {
   return (
     <div className={s.colectionCarcoucelWarpper}>
@@ -31,11 +34,11 @@ const ColectionCarcoucel = ({
           ></CollectionHeading>
         </div>
         <div className={s.right}>
-          <ViewAllItem link="#"/>
+          <ViewAllItem link={`${ROUTE.PRODUCTS}/?${QUERY_KEY.BRAND}=${category}`}/>
         </div>
       </div>
       <div className={s.bot}>
-        <ProductCaroucel data={data} itemKey={itemKey} />
+        <ProductCarousel data={data} itemKey={itemKey} />
       </div>
     </div>
   )

src/components/modules/home/HomeCollection/HomeCollection.tsx

@@ -96,40 +96,47 @@ const HomeCollection = (props: HomeCollectionProps) => {
   return (
     <div className="w-full">
       <CollectionCarcoucel
+        type="highlight"
         data={dataTest}
         itemKey="product-1"
-        title="VEGGIE"
+        title="Fresh Products Today"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
       />
       <CollectionCarcoucel
         data={dataTest}
         itemKey="product-2"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
       />
       <CollectionCarcoucel
         data={dataTest}
         itemKey="product-3"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
       />
       <CollectionCarcoucel
         data={dataTest}
         itemKey="product-4"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
       />
       <CollectionCarcoucel
         data={dataTest}
         itemKey="product-5"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
       />
       <CollectionCarcoucel
         data={dataTest}
         itemKey="product-6"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
       />
     </div>
   )

src/components/modules/home/HomeRecipe/HomeRecipe.module.scss

@@ -17,6 +17,7 @@
 			padding-bottom: 3.2rem; 
       @apply flex justify-start spacing-horizontal;
       .tab{
+          font-family: var(--font-heading);
           padding: 1.6rem 1.6rem 0.8rem 1.6rem;
           font-size: 2.4rem;
           line-height: 2.8rem;
@@ -31,9 +32,4 @@
 					
       }
   }
-  // :global(.keen-slider__slide){
-	// 	@screen 2xl{
-	// 		margin-right: 2rem;
-	// 	}
-  // }
 }

src/components/modules/home/HomeRecipe/HomeRecipe.tsx

@@ -1,17 +1,50 @@
 import React from 'react'
 import {  HeadingCommon, ViewAllItem } from 'src/components/common'
 import { RecipeCardProps } from 'src/components/common/RecipeCard/RecipeCard'
-import RecipeCaroucel from 'src/components/common/RecipeCaroucel/RecipeCaroucel'
+import RecipeCarousel from 'src/components/common/RecipeCarousel/RecipeCarousel'
 import s from './HomeRecipe.module.scss'
 import classNames from 'classnames';
+import image13 from "../../../../../public/assets/images/image13.png"
+import image14 from "../../../../../public/assets/images/image14.png"
+import image12 from "../../../../../public/assets/images/image12.png"
+
 interface HomeRecipeProps {
-  data: RecipeCardProps[]
-  itemKey: string
-  title: string
+  data?: RecipeCardProps[]
+  itemKey?: string
+  title?: string
   viewAllLink?: string
 }
 
-const HomeRecipe = ({ data, itemKey, title }: HomeRecipeProps) => {
+
+
+const recipe:RecipeCardProps[] = [{
+  title: "Special Recipe of Vietnamese Phở",
+  description:"Alright, before we get to the actual recipe, let’s chat for a sec about the ingredients.  To make this pho soup recipe, you will need:",
+  imageSrc: image12.src
+},{
+  title: "Original Recipe of Curry",
+  description:"Chicken curry is common to several countries including India, countries in Asia and the Caribbean. My favorite of them though is this aromatic Indian...",
+  imageSrc: image13.src
+},{
+  title: "The Best Recipe of Beef Noodle Soup",
+  description:"The broth for Bun Bo Hue is prepared by slowly simmering various types of beef and pork bones (ox tail, beef shank, pork neck bones, pork feet,...",
+  imageSrc: image14.src
+},{
+  title: "Special Recipe of Vietnamese Phở",
+  description:"Alright, before we get to the actual recipe, let’s chat for a sec about the ingredients.  To make this pho soup recipe, you will need:",
+  imageSrc: image12.src
+},{
+  title: "Original Recipe of Curry",
+  description:"Chicken curry is common to several countries including India, countries in Asia and the Caribbean. My favorite of them though is this aromatic Indian...",
+  imageSrc: image13.src
+},{
+  title: "The Best Recipe of Beef Noodle Soup",
+  description:"The broth for Bun Bo Hue is prepared by slowly simmering various types of beef and pork bones (ox tail, beef shank, pork neck bones, pork feet,...",
+  imageSrc: image14.src
+}]
+
+
+const HomeRecipe = ({ data =recipe, itemKey="home-recipe", title="Special Recipes" }: HomeRecipeProps) => {
   return (
     <div className={s.homeRecipeWarpper}>
       <div className={s.top}>
@@ -28,7 +61,7 @@ const HomeRecipe = ({ data, itemKey, title }: HomeRecipeProps) => {
         <button className={s.tab}>Special Recipes</button>
       </div>
       <div className={s.bot}>
-        <RecipeCaroucel data={data} itemKey={itemKey} />
+        <RecipeCarousel data={data} itemKey={itemKey} />
       </div>
     </div>
   )

src/components/modules/home/index.ts

@@ -4,3 +4,4 @@ export { default as HomeCTA } from './HomeCTA/HomeCTA'
 export { default as HomeSubscribe } from './HomeSubscribe/HomeSubscribe'
 export { default as HomeVideo } from './HomeVideo/HomeVideo'
 export { default as HomeCollection } from './HomeCollection/HomeCollection'
+export { default as HomeRecipe } from './HomeRecipe/HomeRecipe'