From f99e0aba70efad0deb907d8e27f09fc9f527c8a4 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Fri, 17 Feb 2023 17:07:50 +0700
Subject: Refactor

---
 src/lib/home/components/PreferredBrand.jsx | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 src/lib/home/components/PreferredBrand.jsx

(limited to 'src/lib/home/components/PreferredBrand.jsx')

diff --git a/src/lib/home/components/PreferredBrand.jsx b/src/lib/home/components/PreferredBrand.jsx
new file mode 100644
index 00000000..3d3b1b69
--- /dev/null
+++ b/src/lib/home/components/PreferredBrand.jsx
@@ -0,0 +1,30 @@
+import { Swiper, SwiperSlide } from "swiper/react"
+import usePreferredBrand from "../hooks/usePreferredBrand"
+import PreferredBrandSkeleton from "./Skeleton/PreferredBrandSkeleton"
+import BrandCard from "@/lib/brand/components/BrandCard"
+
+const PreferredBrand = () => {
+  const { preferredBrands } = usePreferredBrand()
+  
+  return (
+    <div className="px-4">
+      <div className="font-medium mb-4">Brand Pilihan</div>
+      { preferredBrands.isLoading && <PreferredBrandSkeleton /> }
+      { !preferredBrands.isLoading && (
+        <Swiper 
+          slidesPerView={3.5} 
+          spaceBetween={8}
+          freeMode 
+        >
+          { preferredBrands.data?.manufactures.map((brand) => (
+            <SwiperSlide key={brand.id}>
+              <BrandCard brand={brand} />
+            </SwiperSlide>
+          )) }
+        </Swiper>
+      ) }
+    </div>
+  )
+}
+
+export default PreferredBrand
\ No newline at end of file
-- 
cgit v1.2.3

