From f62b2345f463695ef0f8f79830cd76b6e0332821 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Sat, 13 Jan 2024 10:35:22 +0700
Subject: Refactor src migrate folder

---
 .../product-slider/components/ProductSlider.tsx    | 42 ++++++++++++++++++++++
 1 file changed, 42 insertions(+)
 create mode 100644 src-migrate/modules/product-slider/components/ProductSlider.tsx

(limited to 'src-migrate/modules/product-slider/components')

diff --git a/src-migrate/modules/product-slider/components/ProductSlider.tsx b/src-migrate/modules/product-slider/components/ProductSlider.tsx
new file mode 100644
index 00000000..6ef9f688
--- /dev/null
+++ b/src-migrate/modules/product-slider/components/ProductSlider.tsx
@@ -0,0 +1,42 @@
+import 'swiper/css'
+
+import React from 'react'
+import { Swiper, SwiperSlide } from 'swiper/react'
+import { FreeMode } from 'swiper'
+
+import ProductCard from '~/modules/product-card'
+import { IProduct } from '~/types/product'
+import useDevice from '@/core/hooks/useDevice'
+
+type Props = {
+  products: IProduct[],
+  productLayout?: 'vertical' | 'horizontal',
+}
+
+const ProductSlider = ({ products, productLayout }: Props) => {
+  const { isDesktop, isMobile } = useDevice()
+
+  return (
+    <div>
+      <Swiper
+        slidesPerView={isDesktop ? 6.7 : 1.85}
+        spaceBetween={isDesktop ? 16 : 12}
+        prefix='product-slider'
+        modules={[FreeMode]}
+        freeMode={{ enabled: true, sticky: false }}
+        className='!pb-0.5'
+      >
+        {products.map((product) => (
+          <SwiperSlide key={product.id}>
+            <ProductCard
+              product={product}
+              layout={productLayout}
+            />
+          </SwiperSlide>
+        ))}
+      </Swiper>
+    </div >
+  )
+}
+
+export default ProductSlider
\ No newline at end of file
-- 
cgit v1.2.3