diff options
| author | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-22 11:03:34 +0700 |
|---|---|---|
| committer | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-22 11:03:34 +0700 |
| commit | f66b12fd1d0b83af0d7230d7b1565fbe00afbe3c (patch) | |
| tree | 253dcf854a3c92e09ca846e86a09e5b4c5d16be1 /src/lib/brand/components | |
| parent | 3c559031623649a67825ff47f34512f0eb946861 (diff) | |
prettier
Diffstat (limited to 'src/lib/brand/components')
| -rw-r--r-- | src/lib/brand/components/Brand.jsx | 66 | ||||
| -rw-r--r-- | src/lib/brand/components/BrandCard.jsx | 20 |
2 files changed, 41 insertions, 45 deletions
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 diff --git a/src/lib/brand/components/BrandCard.jsx b/src/lib/brand/components/BrandCard.jsx index 8783010e..0dbdc075 100644 --- a/src/lib/brand/components/BrandCard.jsx +++ b/src/lib/brand/components/BrandCard.jsx @@ -1,20 +1,16 @@ -import Image from "@/core/components/elements/Image/Image" -import Link from "@/core/components/elements/Link/Link" -import { createSlug } from "@/core/utils/slug" +import Image from '@/core/components/elements/Image/Image' +import Link from '@/core/components/elements/Link/Link' +import { createSlug } from '@/core/utils/slug' const BrandCard = ({ brand }) => { return ( - <Link - href={createSlug('/shop/brands/', brand.name, brand.id)} - className="py-1 px-2 rounded border border-gray_r-6" + <Link + href={createSlug('/shop/brands/', brand.name, brand.id)} + className='py-1 px-2 rounded border border-gray_r-6' > - <Image - src={brand.logo} - alt={brand.name} - className="h-10 object-contain object-center" - /> + <Image src={brand.logo} alt={brand.name} className='h-10 object-contain object-center' /> </Link> ) } -export default BrandCard
\ No newline at end of file +export default BrandCard |
