summaryrefslogtreecommitdiff
path: root/src/lib/home/components
diff options
context:
space:
mode:
authorRafi Zadanly <zadanlyr@gmail.com>2023-02-22 11:03:34 +0700
committerRafi Zadanly <zadanlyr@gmail.com>2023-02-22 11:03:34 +0700
commitf66b12fd1d0b83af0d7230d7b1565fbe00afbe3c (patch)
tree253dcf854a3c92e09ca846e86a09e5b4c5d16be1 /src/lib/home/components
parent3c559031623649a67825ff47f34512f0eb946861 (diff)
prettier
Diffstat (limited to 'src/lib/home/components')
-rw-r--r--src/lib/home/components/CategoryHome.jsx22
-rw-r--r--src/lib/home/components/CategoryHomeId.jsx14
-rw-r--r--src/lib/home/components/HeroBanner.jsx42
-rw-r--r--src/lib/home/components/PopularProduct.jsx27
-rw-r--r--src/lib/home/components/PreferredBrand.jsx32
-rw-r--r--src/lib/home/components/Skeleton/PopularProductSkeleton.jsx6
-rw-r--r--src/lib/home/components/Skeleton/PreferredBrandSkeleton.jsx6
7 files changed, 69 insertions, 80 deletions
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