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/CategoryHome.jsx           | 28 ++++++++++++
 src/lib/home/components/CategoryHomeId.jsx         | 19 ++++++++
 src/lib/home/components/HeroBanner.jsx             | 50 ++++++++++++++++++++++
 src/lib/home/components/PopularProduct.jsx         | 24 +++++++++++
 src/lib/home/components/PreferredBrand.jsx         | 30 +++++++++++++
 .../components/Skeleton/PopularProductSkeleton.jsx | 10 +++++
 .../components/Skeleton/PreferredBrandSkeleton.jsx | 12 ++++++
 7 files changed, 173 insertions(+)
 create mode 100644 src/lib/home/components/CategoryHome.jsx
 create mode 100644 src/lib/home/components/CategoryHomeId.jsx
 create mode 100644 src/lib/home/components/HeroBanner.jsx
 create mode 100644 src/lib/home/components/PopularProduct.jsx
 create mode 100644 src/lib/home/components/PreferredBrand.jsx
 create mode 100644 src/lib/home/components/Skeleton/PopularProductSkeleton.jsx
 create mode 100644 src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx

(limited to 'src/lib/home/components')

diff --git a/src/lib/home/components/CategoryHome.jsx b/src/lib/home/components/CategoryHome.jsx
new file mode 100644
index 00000000..0bca9846
--- /dev/null
+++ b/src/lib/home/components/CategoryHome.jsx
@@ -0,0 +1,28 @@
+import ProductSlider from "@/lib/product/components/ProductSlider"
+import useCategoryHome from "../hooks/useCategoryHome"
+import PopularProductSkeleton from "./Skeleton/PopularProductSkeleton"
+
+const CategoryHome = ({ id }) => {
+  const { categoryHome } = useCategoryHome({ id })
+  
+  return (
+    <div className="p-4 relative bg-yellow_r-2">
+      { categoryHome.data ? (
+        <ProductSlider 
+          products={{
+            products: categoryHome.data?.[0].products,
+            banner: {
+              image: categoryHome.data?.[0].image,
+              name: categoryHome.data?.[0].name,
+              url: `/shop/search?category=${categoryHome.data?.[0].name}`
+            }
+          }} 
+          simpleTitle
+          bannerMode
+        />
+      ) : <PopularProductSkeleton /> }
+    </div>
+  )
+}
+
+export default CategoryHome
\ No newline at end of file
diff --git a/src/lib/home/components/CategoryHomeId.jsx b/src/lib/home/components/CategoryHomeId.jsx
new file mode 100644
index 00000000..4cbbd1fc
--- /dev/null
+++ b/src/lib/home/components/CategoryHomeId.jsx
@@ -0,0 +1,19 @@
+import { LazyLoadComponent } from "react-lazy-load-image-component"
+import useCategoryHomeId from "../hooks/useCategoryHomeId"
+import CategoryHome from "./CategoryHome"
+
+const CategoryHomeId = () => {
+  const { categoryHomeIds } = useCategoryHomeId()
+
+  return (
+    <div className="flex flex-col gap-y-6">
+      { categoryHomeIds.data?.map((id) => (
+        <LazyLoadComponent key={id}>
+          <CategoryHome id={id} />
+        </LazyLoadComponent>
+      )) }
+    </div>
+  )
+}
+
+export default CategoryHomeId
\ No newline at end of file
diff --git a/src/lib/home/components/HeroBanner.jsx b/src/lib/home/components/HeroBanner.jsx
new file mode 100644
index 00000000..604ca8ac
--- /dev/null
+++ b/src/lib/home/components/HeroBanner.jsx
@@ -0,0 +1,50 @@
+import ImageSkeleton from "@/core/components/elements/Skeleton/ImageSkeleton"
+import useHeroBanner from "../hooks/useHeroBanner"
+import Image from "@/core/components/elements/Image/Image"
+
+// Swiper
+import { Swiper, SwiperSlide } from "swiper/react"
+import { Pagination, Autoplay } from "swiper"
+import "swiper/css"
+import "swiper/css/pagination"
+import "swiper/css/autoplay"
+
+const swiperBanner = {
+  pagination: { dynamicBullets: true },
+  autoplay: {
+    delay: 6000,
+    disableOnInteraction: false
+  },
+  modules: [Pagination, Autoplay]
+}
+
+const HeroBanner = () => {
+  const { heroBanners } = useHeroBanner()
+  
+  return (
+    <div className="min-h-[200px]">
+      { heroBanners.isLoading && <ImageSkeleton /> }
+      { !heroBanners.isLoading && (
+        <Swiper
+          slidesPerView={1}
+          pagination={swiperBanner.pagination} 
+          modules={swiperBanner.modules}
+          autoplay={swiperBanner.autoplay}
+          className="border-b border-gray_r-6"
+        >
+          { heroBanners.data?.map((banner, index) => (
+            <SwiperSlide key={index}>
+              <Image 
+                src={banner.image}
+                alt={banner.name}
+                className="w-full h-auto"
+              />
+            </SwiperSlide>
+          )) }
+        </Swiper>
+      ) }
+    </div>
+  )
+}
+
+export default HeroBanner
\ No newline at end of file
diff --git a/src/lib/home/components/PopularProduct.jsx b/src/lib/home/components/PopularProduct.jsx
new file mode 100644
index 00000000..87e47218
--- /dev/null
+++ b/src/lib/home/components/PopularProduct.jsx
@@ -0,0 +1,24 @@
+import { Swiper, SwiperSlide } from "swiper/react"
+import usePopularProduct from "../hooks/usePopularProduct"
+import ProductCard from "@/lib/product/components/ProductCard"
+import PopularProductSkeleton from "./Skeleton/PopularProductSkeleton"
+import ProductSlider from "@/lib/product/components/ProductSlider"
+
+const PopularProduct = () => {
+  const { popularProducts } = usePopularProduct()
+  
+  return (
+    <div className="px-4">
+      <div className="font-medium mb-4">Produk Populer</div>
+      { popularProducts.isLoading && <PopularProductSkeleton /> }
+      { !popularProducts.isLoading && (
+        <ProductSlider 
+          products={popularProducts.data}
+          simpleTitle
+        />
+      ) }
+    </div>
+  )
+}
+
+export default PopularProduct
\ No newline at end of file
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
diff --git a/src/lib/home/components/Skeleton/PopularProductSkeleton.jsx b/src/lib/home/components/Skeleton/PopularProductSkeleton.jsx
new file mode 100644
index 00000000..c5b0fcaa
--- /dev/null
+++ b/src/lib/home/components/Skeleton/PopularProductSkeleton.jsx
@@ -0,0 +1,10 @@
+import ProductCardSkeleton from "@/core/components/elements/Skeleton/ProductCardSkeleton"
+
+const PopularProductSkeleton = () => (
+  <div className="grid grid-cols-2 gap-x-3">
+    <ProductCardSkeleton />
+    <ProductCardSkeleton />
+  </div>
+)
+
+export default PopularProductSkeleton
\ No newline at end of file
diff --git a/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
new file mode 100644
index 00000000..6bdd3c82
--- /dev/null
+++ b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
@@ -0,0 +1,12 @@
+import BrandSkeleton from "@/core/components/elements/Skeleton/BrandSkeleton"
+
+const PreferredBrandSkeleton = () => (
+  <div className="grid grid-cols-4 gap-x-3">
+    <BrandSkeleton />
+    <BrandSkeleton />
+    <BrandSkeleton />
+    <BrandSkeleton />
+  </div>
+)
+
+export default PreferredBrandSkeleton
\ No newline at end of file
-- 
cgit v1.2.3


From f66b12fd1d0b83af0d7230d7b1565fbe00afbe3c Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Wed, 22 Feb 2023 11:03:34 +0700
Subject: prettier

---
 src/lib/home/components/CategoryHome.jsx           | 22 ++++++------
 src/lib/home/components/CategoryHomeId.jsx         | 14 ++++----
 src/lib/home/components/HeroBanner.jsx             | 42 ++++++++++------------
 src/lib/home/components/PopularProduct.jsx         | 27 ++++++--------
 src/lib/home/components/PreferredBrand.jsx         | 32 ++++++++---------
 .../components/Skeleton/PopularProductSkeleton.jsx |  6 ++--
 .../components/Skeleton/PreferredBrandSkeleton.jsx |  6 ++--
 7 files changed, 69 insertions(+), 80 deletions(-)

(limited to 'src/lib/home/components')

diff --git a/src/lib/home/components/CategoryHome.jsx b/src/lib/home/components/CategoryHome.jsx
index 0bca9846..ac43e2bc 100644
--- a/src/lib/home/components/CategoryHome.jsx
+++ b/src/lib/home/components/CategoryHome.jsx
@@ -1,14 +1,14 @@
-import ProductSlider from "@/lib/product/components/ProductSlider"
-import useCategoryHome from "../hooks/useCategoryHome"
-import PopularProductSkeleton from "./Skeleton/PopularProductSkeleton"
+import ProductSlider from '@/lib/product/components/ProductSlider'
+import useCategoryHome from '../hooks/useCategoryHome'
+import PopularProductSkeleton from './Skeleton/PopularProductSkeleton'
 
 const CategoryHome = ({ id }) => {
   const { categoryHome } = useCategoryHome({ id })
-  
+
   return (
-    <div className="p-4 relative bg-yellow_r-2">
-      { categoryHome.data ? (
-        <ProductSlider 
+    <div className='p-4 relative bg-yellow_r-2'>
+      {categoryHome.data ? (
+        <ProductSlider
           products={{
             products: categoryHome.data?.[0].products,
             banner: {
@@ -16,13 +16,15 @@ const CategoryHome = ({ id }) => {
               name: categoryHome.data?.[0].name,
               url: `/shop/search?category=${categoryHome.data?.[0].name}`
             }
-          }} 
+          }}
           simpleTitle
           bannerMode
         />
-      ) : <PopularProductSkeleton /> }
+      ) : (
+        <PopularProductSkeleton />
+      )}
     </div>
   )
 }
 
-export default CategoryHome
\ No newline at end of file
+export default CategoryHome
diff --git a/src/lib/home/components/CategoryHomeId.jsx b/src/lib/home/components/CategoryHomeId.jsx
index 4cbbd1fc..c37a6af7 100644
--- a/src/lib/home/components/CategoryHomeId.jsx
+++ b/src/lib/home/components/CategoryHomeId.jsx
@@ -1,19 +1,19 @@
-import { LazyLoadComponent } from "react-lazy-load-image-component"
-import useCategoryHomeId from "../hooks/useCategoryHomeId"
-import CategoryHome from "./CategoryHome"
+import { LazyLoadComponent } from 'react-lazy-load-image-component'
+import useCategoryHomeId from '../hooks/useCategoryHomeId'
+import CategoryHome from './CategoryHome'
 
 const CategoryHomeId = () => {
   const { categoryHomeIds } = useCategoryHomeId()
 
   return (
-    <div className="flex flex-col gap-y-6">
-      { categoryHomeIds.data?.map((id) => (
+    <div className='flex flex-col gap-y-6'>
+      {categoryHomeIds.data?.map((id) => (
         <LazyLoadComponent key={id}>
           <CategoryHome id={id} />
         </LazyLoadComponent>
-      )) }
+      ))}
     </div>
   )
 }
 
-export default CategoryHomeId
\ No newline at end of file
+export default CategoryHomeId
diff --git a/src/lib/home/components/HeroBanner.jsx b/src/lib/home/components/HeroBanner.jsx
index 604ca8ac..6f39ac50 100644
--- a/src/lib/home/components/HeroBanner.jsx
+++ b/src/lib/home/components/HeroBanner.jsx
@@ -1,13 +1,13 @@
-import ImageSkeleton from "@/core/components/elements/Skeleton/ImageSkeleton"
-import useHeroBanner from "../hooks/useHeroBanner"
-import Image from "@/core/components/elements/Image/Image"
+import ImageSkeleton from '@/core/components/elements/Skeleton/ImageSkeleton'
+import useHeroBanner from '../hooks/useHeroBanner'
+import Image from '@/core/components/elements/Image/Image'
 
 // Swiper
-import { Swiper, SwiperSlide } from "swiper/react"
-import { Pagination, Autoplay } from "swiper"
-import "swiper/css"
-import "swiper/css/pagination"
-import "swiper/css/autoplay"
+import { Swiper, SwiperSlide } from 'swiper/react'
+import { Pagination, Autoplay } from 'swiper'
+import 'swiper/css'
+import 'swiper/css/pagination'
+import 'swiper/css/autoplay'
 
 const swiperBanner = {
   pagination: { dynamicBullets: true },
@@ -20,31 +20,27 @@ const swiperBanner = {
 
 const HeroBanner = () => {
   const { heroBanners } = useHeroBanner()
-  
+
   return (
-    <div className="min-h-[200px]">
-      { heroBanners.isLoading && <ImageSkeleton /> }
-      { !heroBanners.isLoading && (
+    <div className='min-h-[200px]'>
+      {heroBanners.isLoading && <ImageSkeleton />}
+      {!heroBanners.isLoading && (
         <Swiper
           slidesPerView={1}
-          pagination={swiperBanner.pagination} 
+          pagination={swiperBanner.pagination}
           modules={swiperBanner.modules}
           autoplay={swiperBanner.autoplay}
-          className="border-b border-gray_r-6"
+          className='border-b border-gray_r-6'
         >
-          { heroBanners.data?.map((banner, index) => (
+          {heroBanners.data?.map((banner, index) => (
             <SwiperSlide key={index}>
-              <Image 
-                src={banner.image}
-                alt={banner.name}
-                className="w-full h-auto"
-              />
+              <Image src={banner.image} alt={banner.name} className='w-full h-auto' />
             </SwiperSlide>
-          )) }
+          ))}
         </Swiper>
-      ) }
+      )}
     </div>
   )
 }
 
-export default HeroBanner
\ No newline at end of file
+export default HeroBanner
diff --git a/src/lib/home/components/PopularProduct.jsx b/src/lib/home/components/PopularProduct.jsx
index 87e47218..7e222b0a 100644
--- a/src/lib/home/components/PopularProduct.jsx
+++ b/src/lib/home/components/PopularProduct.jsx
@@ -1,24 +1,19 @@
-import { Swiper, SwiperSlide } from "swiper/react"
-import usePopularProduct from "../hooks/usePopularProduct"
-import ProductCard from "@/lib/product/components/ProductCard"
-import PopularProductSkeleton from "./Skeleton/PopularProductSkeleton"
-import ProductSlider from "@/lib/product/components/ProductSlider"
+import { Swiper, SwiperSlide } from 'swiper/react'
+import usePopularProduct from '../hooks/usePopularProduct'
+import ProductCard from '@/lib/product/components/ProductCard'
+import PopularProductSkeleton from './Skeleton/PopularProductSkeleton'
+import ProductSlider from '@/lib/product/components/ProductSlider'
 
 const PopularProduct = () => {
   const { popularProducts } = usePopularProduct()
-  
+
   return (
-    <div className="px-4">
-      <div className="font-medium mb-4">Produk Populer</div>
-      { popularProducts.isLoading && <PopularProductSkeleton /> }
-      { !popularProducts.isLoading && (
-        <ProductSlider 
-          products={popularProducts.data}
-          simpleTitle
-        />
-      ) }
+    <div className='px-4'>
+      <div className='font-medium mb-4'>Produk Populer</div>
+      {popularProducts.isLoading && <PopularProductSkeleton />}
+      {!popularProducts.isLoading && <ProductSlider products={popularProducts.data} simpleTitle />}
     </div>
   )
 }
 
-export default PopularProduct
\ No newline at end of file
+export default PopularProduct
diff --git a/src/lib/home/components/PreferredBrand.jsx b/src/lib/home/components/PreferredBrand.jsx
index 3d3b1b69..de377031 100644
--- a/src/lib/home/components/PreferredBrand.jsx
+++ b/src/lib/home/components/PreferredBrand.jsx
@@ -1,30 +1,26 @@
-import { Swiper, SwiperSlide } from "swiper/react"
-import usePreferredBrand from "../hooks/usePreferredBrand"
-import PreferredBrandSkeleton from "./Skeleton/PreferredBrandSkeleton"
-import BrandCard from "@/lib/brand/components/BrandCard"
+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) => (
+    <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
+export default PreferredBrand
diff --git a/src/lib/home/components/Skeleton/PopularProductSkeleton.jsx b/src/lib/home/components/Skeleton/PopularProductSkeleton.jsx
index c5b0fcaa..18a1b3d3 100644
--- a/src/lib/home/components/Skeleton/PopularProductSkeleton.jsx
+++ b/src/lib/home/components/Skeleton/PopularProductSkeleton.jsx
@@ -1,10 +1,10 @@
-import ProductCardSkeleton from "@/core/components/elements/Skeleton/ProductCardSkeleton"
+import ProductCardSkeleton from '@/core/components/elements/Skeleton/ProductCardSkeleton'
 
 const PopularProductSkeleton = () => (
-  <div className="grid grid-cols-2 gap-x-3">
+  <div className='grid grid-cols-2 gap-x-3'>
     <ProductCardSkeleton />
     <ProductCardSkeleton />
   </div>
 )
 
-export default PopularProductSkeleton
\ No newline at end of file
+export default PopularProductSkeleton
diff --git a/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
index 6bdd3c82..00589342 100644
--- a/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
+++ b/src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx
@@ -1,7 +1,7 @@
-import BrandSkeleton from "@/core/components/elements/Skeleton/BrandSkeleton"
+import BrandSkeleton from '@/core/components/elements/Skeleton/BrandSkeleton'
 
 const PreferredBrandSkeleton = () => (
-  <div className="grid grid-cols-4 gap-x-3">
+  <div className='grid grid-cols-4 gap-x-3'>
     <BrandSkeleton />
     <BrandSkeleton />
     <BrandSkeleton />
@@ -9,4 +9,4 @@ const PreferredBrandSkeleton = () => (
   </div>
 )
 
-export default PreferredBrandSkeleton
\ No newline at end of file
+export default PreferredBrandSkeleton
-- 
cgit v1.2.3


From ac3fdf7be9982e65d8f83a20bc487f8dd62e3bfc Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Wed, 22 Feb 2023 23:36:47 +0700
Subject: fix

---
 src/lib/home/components/HeroBanner.jsx     | 6 +++++-
 src/lib/home/components/PopularProduct.jsx | 7 ++++++-
 src/lib/home/components/PreferredBrand.jsx | 6 +++++-
 3 files changed, 16 insertions(+), 3 deletions(-)

(limited to 'src/lib/home/components')

diff --git a/src/lib/home/components/HeroBanner.jsx b/src/lib/home/components/HeroBanner.jsx
index 6f39ac50..0ac14bad 100644
--- a/src/lib/home/components/HeroBanner.jsx
+++ b/src/lib/home/components/HeroBanner.jsx
@@ -34,7 +34,11 @@ const HeroBanner = () => {
         >
           {heroBanners.data?.map((banner, index) => (
             <SwiperSlide key={index}>
-              <Image src={banner.image} alt={banner.name} className='w-full h-auto' />
+              <Image
+                src={banner.image}
+                alt={banner.name}
+                className='w-full h-auto'
+              />
             </SwiperSlide>
           ))}
         </Swiper>
diff --git a/src/lib/home/components/PopularProduct.jsx b/src/lib/home/components/PopularProduct.jsx
index 7e222b0a..d23275f7 100644
--- a/src/lib/home/components/PopularProduct.jsx
+++ b/src/lib/home/components/PopularProduct.jsx
@@ -11,7 +11,12 @@ const PopularProduct = () => {
     <div className='px-4'>
       <div className='font-medium mb-4'>Produk Populer</div>
       {popularProducts.isLoading && <PopularProductSkeleton />}
-      {!popularProducts.isLoading && <ProductSlider products={popularProducts.data} simpleTitle />}
+      {!popularProducts.isLoading && (
+        <ProductSlider
+          products={popularProducts.data}
+          simpleTitle
+        />
+      )}
     </div>
   )
 }
diff --git a/src/lib/home/components/PreferredBrand.jsx b/src/lib/home/components/PreferredBrand.jsx
index de377031..fa0fdd0d 100644
--- a/src/lib/home/components/PreferredBrand.jsx
+++ b/src/lib/home/components/PreferredBrand.jsx
@@ -11,7 +11,11 @@ const PreferredBrand = () => {
       <div className='font-medium mb-4'>Brand Pilihan</div>
       {preferredBrands.isLoading && <PreferredBrandSkeleton />}
       {!preferredBrands.isLoading && (
-        <Swiper slidesPerView={3.5} spaceBetween={8} freeMode>
+        <Swiper
+          slidesPerView={3.5}
+          spaceBetween={8}
+          freeMode
+        >
           {preferredBrands.data?.manufactures.map((brand) => (
             <SwiperSlide key={brand.id}>
               <BrandCard brand={brand} />
-- 
cgit v1.2.3


From ffa261e6adef70a2845878cf93e6e492eb8cee62 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Mon, 27 Feb 2023 10:49:45 +0700
Subject: footer

---
 src/lib/home/components/PreferredBrand.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/lib/home/components')

diff --git a/src/lib/home/components/PreferredBrand.jsx b/src/lib/home/components/PreferredBrand.jsx
index fa0fdd0d..3df3cdb7 100644
--- a/src/lib/home/components/PreferredBrand.jsx
+++ b/src/lib/home/components/PreferredBrand.jsx
@@ -13,7 +13,7 @@ const PreferredBrand = () => {
       {!preferredBrands.isLoading && (
         <Swiper
           slidesPerView={3.5}
-          spaceBetween={8}
+          spaceBetween={12}
           freeMode
         >
           {preferredBrands.data?.manufactures.map((brand) => (
-- 
cgit v1.2.3