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/HeroBanner.jsx | 50 ++++++++++++++++++++++++++++++++++
 1 file changed, 50 insertions(+)
 create mode 100644 src/lib/home/components/HeroBanner.jsx

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

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
-- 
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/HeroBanner.jsx | 42 +++++++++++++++-------------------
 1 file changed, 19 insertions(+), 23 deletions(-)

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

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
-- 
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 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

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

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>
-- 
cgit v1.2.3