🐛 bug: caroucel to carousel

:%s

pages/test.tsx

@@ -1,6 +1,96 @@
 import { useState } from 'react'
 import { ButtonCommon, Layout, ModalCommon } from 'src/components/common'
-
+import { CollectionCarcousel } from 'src/components/modules/home'
+import image5 from '../public/assets/images/image5.png'
+import image6 from '../public/assets/images/image6.png'
+import image7 from '../public/assets/images/image7.png'
+import image8 from '../public/assets/images/image8.png'
+const dataTest = [
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+  {
+    name: 'Carrot',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image7.src,
+  },
+  {
+    name: 'Salad',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image8.src,
+  },
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+  {
+    name: 'Carrot',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image7.src,
+  },
+  {
+    name: 'Salad',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image8.src,
+  },
+  {
+    name: 'Tomato',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image5.src,
+  },
+  {
+    name: 'Cucumber',
+    weight: '250g',
+    category: 'VEGGIE',
+    price: 'Rp 27.500',
+    imageSrc: image6.src,
+  },
+]
 export default function Test() {
   const [visible, setVisible] = useState(false)
   const onClose = () => {
@@ -17,6 +107,13 @@ export default function Test() {
 					Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur officiis dolorum ea incidunt. Sint, cum ullam. Labore vero quod itaque, officia magni molestias! Architecto deserunt soluta laborum commodi nesciunt delectus similique temporibus distinctio? Facere eaque minima enim modi magni, laudantium, animi mollitia beatae repudiandae maxime labore error nesciunt, nisi est?
 				</div>
 			</ModalCommon>
+      <CollectionCarcousel
+        data={dataTest}
+        itemKey="product-2"
+        title="VEGGIE"
+        subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
+        category={"veggie"}
+      />
     </>
   )
 }

src/components/modules/home/CollectionCarcousel/CollectionCarcousel.tsx

@@ -7,7 +7,7 @@ import {
 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'
+import s from './CollectionCarcousel.module.scss'
 interface ColectionCarcoucelProps extends CollectionHeadingProps {
   data: ProductCardProps[]
   itemKey: string

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

@@ -1,5 +1,5 @@
 import React from 'react'
-import { CollectionCarcoucel } from '..'
+import { CollectionCarcousel } from '..'
 import image5 from '../../../../../public/assets/images/image5.png'
 import image6 from '../../../../../public/assets/images/image6.png'
 import image7 from '../../../../../public/assets/images/image7.png'
@@ -95,7 +95,7 @@ const dataTest = [
 const HomeCollection = (props: HomeCollectionProps) => {
   return (
     <div className="w-full">
-      <CollectionCarcoucel
+      <CollectionCarcousel
         type="highlight"
         data={dataTest}
         itemKey="product-1"
@@ -103,35 +103,35 @@ const HomeCollection = (props: HomeCollectionProps) => {
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-2"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-3"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-4"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-5"
         title="VEGGIE"
         subtitle="Last call! Shop deep deals on 100+ bulk picks while you can."
         category={"veggie"}
       />
-      <CollectionCarcoucel
+      <CollectionCarcousel
         data={dataTest}
         itemKey="product-6"
         title="VEGGIE"

src/components/modules/home/index.ts

@@ -1,5 +1,5 @@
 export { default as HomeBanner } from './HomeBanner/HomeBanner'
-export { default as CollectionCarcoucel } from './CollectionCarcoucel/CollectionCarcoucel'
+export { default as CollectionCarcousel } from './CollectionCarcousel/CollectionCarcousel'
 export { default as HomeCategories } from './HomeCategories/HomeCategories'
 export { default as HomeCTA } from './HomeCTA/HomeCTA'
 export { default as HomeSubscribe } from './HomeSubscribe/HomeSubscribe'