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

(limited to 'src/lib/brand/components/Brand.jsx')

diff --git a/src/lib/brand/components/Brand.jsx b/src/lib/brand/components/Brand.jsx
new file mode 100644
index 00000000..a42f4c81
--- /dev/null
+++ b/src/lib/brand/components/Brand.jsx
@@ -0,0 +1,70 @@
+import useBrand from "../hooks/useBrand"
+import Image from "@/core/components/elements/Image/Image"
+
+import { Swiper, SwiperSlide } from "swiper/react"
+import { Pagination, Autoplay } from "swiper"
+import "swiper/css"
+import "swiper/css/pagination"
+import "swiper/css/autoplay"
+import Divider from "@/core/components/elements/Divider/Divider"
+import ImageSkeleton from "@/core/components/elements/Skeleton/ImageSkeleton"
+
+const swiperBanner = {
+  pagination: { dynamicBullets: true },
+  autoplay: {
+    delay: 6000,
+    disableOnInteraction: false
+  },
+  modules: [Pagination, Autoplay]
+}
+
+const Brand = ({ id }) => {
+  const { brand } = useBrand({ id })
+  
+  return (
+    <>
+      <div className="min-h-[200px]">
+        { brand.isLoading && <ImageSkeleton /> }
+        { brand.data && (
+          <>
+            <Swiper
+              slidesPerView={1}
+              pagination={swiperBanner.pagination} 
+              modules={swiperBanner.modules}
+              autoplay={swiperBanner.autoplay}
+              className="border-b border-gray_r-6"
+            >
+              { brand.data?.banners?.map((banner, index) => (
+                <SwiperSlide key={index}>
+                  <Image 
+                    src={banner}
+                    alt={`Brand ${brand.data?.name} - Indoteknik`}
+                    className="w-full h-auto"
+                  />
+                </SwiperSlide>
+              )) }
+            </Swiper>
+            <div className="p-4 pt-2">
+              <div className="text-caption-1 text-gray_r-11 mb-2">Produk dari brand:</div>
+              { brand?.data?.logo && (
+                <Image 
+                  src={brand?.data?.logo} 
+                  alt={brand?.data?.name} 
+                  className="w-32 p-2 border borde-gray_r-6 rounded"
+                />
+              ) }
+              { !brand?.data?.logo && (
+                <div className="bg-red_r-10 text-white text-center text-caption-1 py-2 px-4 rounded w-fit">
+                  { brand?.data?.name }
+                </div>
+              ) }
+            </div>
+          </>
+        ) }
+      </div>
+      <Divider />
+    </>
+  )
+}
+
+export default Brand
\ No newline at end of file
-- 
cgit v1.2.3


From 347e28848fb063ffcb7f9268384409e57b7ef3ad Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Sat, 18 Feb 2023 22:08:07 +0700
Subject: change animation

---
 src/lib/brand/components/Brand.jsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/lib/brand/components/Brand.jsx')

diff --git a/src/lib/brand/components/Brand.jsx b/src/lib/brand/components/Brand.jsx
index a42f4c81..c1215976 100644
--- a/src/lib/brand/components/Brand.jsx
+++ b/src/lib/brand/components/Brand.jsx
@@ -23,7 +23,7 @@ const Brand = ({ id }) => {
   
   return (
     <>
-      <div className="min-h-[200px]">
+      <div className="min-h-[150px]">
         { brand.isLoading && <ImageSkeleton /> }
         { brand.data && (
           <>
@@ -44,7 +44,7 @@ const Brand = ({ id }) => {
                 </SwiperSlide>
               )) }
             </Swiper>
-            <div className="p-4 pt-2">
+            <div className="p-4">
               <div className="text-caption-1 text-gray_r-11 mb-2">Produk dari brand:</div>
               { brand?.data?.logo && (
                 <Image 
-- 
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/brand/components/Brand.jsx | 66 +++++++++++++++++++-------------------
 1 file changed, 33 insertions(+), 33 deletions(-)

(limited to 'src/lib/brand/components/Brand.jsx')

diff --git a/src/lib/brand/components/Brand.jsx b/src/lib/brand/components/Brand.jsx
index c1215976..c338c4c4 100644
--- a/src/lib/brand/components/Brand.jsx
+++ b/src/lib/brand/components/Brand.jsx
@@ -1,13 +1,13 @@
-import useBrand from "../hooks/useBrand"
-import Image from "@/core/components/elements/Image/Image"
+import useBrand from '../hooks/useBrand'
+import Image from '@/core/components/elements/Image/Image'
 
-import { Swiper, SwiperSlide } from "swiper/react"
-import { Pagination, Autoplay } from "swiper"
-import "swiper/css"
-import "swiper/css/pagination"
-import "swiper/css/autoplay"
-import Divider from "@/core/components/elements/Divider/Divider"
-import ImageSkeleton from "@/core/components/elements/Skeleton/ImageSkeleton"
+import { Swiper, SwiperSlide } from 'swiper/react'
+import { Pagination, Autoplay } from 'swiper'
+import 'swiper/css'
+import 'swiper/css/pagination'
+import 'swiper/css/autoplay'
+import Divider from '@/core/components/elements/Divider/Divider'
+import ImageSkeleton from '@/core/components/elements/Skeleton/ImageSkeleton'
 
 const swiperBanner = {
   pagination: { dynamicBullets: true },
@@ -20,51 +20,51 @@ const swiperBanner = {
 
 const Brand = ({ id }) => {
   const { brand } = useBrand({ id })
-  
+
   return (
     <>
-      <div className="min-h-[150px]">
-        { brand.isLoading && <ImageSkeleton /> }
-        { brand.data && (
+      <div className='min-h-[150px]'>
+        {brand.isLoading && <ImageSkeleton />}
+        {brand.data && (
           <>
             <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'
             >
-              { brand.data?.banners?.map((banner, index) => (
+              {brand.data?.banners?.map((banner, index) => (
                 <SwiperSlide key={index}>
-                  <Image 
+                  <Image
                     src={banner}
                     alt={`Brand ${brand.data?.name} - Indoteknik`}
-                    className="w-full h-auto"
+                    className='w-full h-auto'
                   />
                 </SwiperSlide>
-              )) }
+              ))}
             </Swiper>
-            <div className="p-4">
-              <div className="text-caption-1 text-gray_r-11 mb-2">Produk dari brand:</div>
-              { brand?.data?.logo && (
-                <Image 
-                  src={brand?.data?.logo} 
-                  alt={brand?.data?.name} 
-                  className="w-32 p-2 border borde-gray_r-6 rounded"
+            <div className='p-4'>
+              <div className='text-caption-1 text-gray_r-11 mb-2'>Produk dari brand:</div>
+              {brand?.data?.logo && (
+                <Image
+                  src={brand?.data?.logo}
+                  alt={brand?.data?.name}
+                  className='w-32 p-2 border borde-gray_r-6 rounded'
                 />
-              ) }
-              { !brand?.data?.logo && (
-                <div className="bg-red_r-10 text-white text-center text-caption-1 py-2 px-4 rounded w-fit">
-                  { brand?.data?.name }
+              )}
+              {!brand?.data?.logo && (
+                <div className='bg-red_r-10 text-white text-center text-caption-1 py-2 px-4 rounded w-fit'>
+                  {brand?.data?.name}
                 </div>
-              ) }
+              )}
             </div>
           </>
-        ) }
+        )}
       </div>
       <Divider />
     </>
   )
 }
 
-export default Brand
\ No newline at end of file
+export default Brand
-- 
cgit v1.2.3