summaryrefslogtreecommitdiff
path: root/src/lib/product/components/ProductSlider.jsx
diff options
context:
space:
mode:
authorHATEC\SPVDEV001 <tri.susilo@altama.co.id>2023-04-12 14:06:38 +0700
committerHATEC\SPVDEV001 <tri.susilo@altama.co.id>2023-04-12 14:06:38 +0700
commit15b6d6dc4d87ffa782d39a1fb7c6f75798217736 (patch)
tree3dd59cdae45f409f6ff10cb43519dba351a8ff95 /src/lib/product/components/ProductSlider.jsx
parent5de7459174ca226be99900958aa82523cac5fef2 (diff)
parentb42f03ff7b8f8da403b83aa676328533564b928e (diff)
Merge branch 'master' into development_tri/feedback_UAT
Diffstat (limited to 'src/lib/product/components/ProductSlider.jsx')
-rw-r--r--src/lib/product/components/ProductSlider.jsx46
1 files changed, 24 insertions, 22 deletions
diff --git a/src/lib/product/components/ProductSlider.jsx b/src/lib/product/components/ProductSlider.jsx
index c8bd3a82..931a8db7 100644
--- a/src/lib/product/components/ProductSlider.jsx
+++ b/src/lib/product/components/ProductSlider.jsx
@@ -12,7 +12,7 @@ const bannerClassName =
const ProductSlider = ({ products, simpleTitle = false, bannerMode = false }) => {
const bannerRef = useRef('')
- const { isMobile } = useDevice()
+ const { isMobile, isDesktop } = useDevice()
const changeBannerOpacity = (swiper) => {
if (!bannerMode) return
@@ -32,27 +32,29 @@ const ProductSlider = ({ products, simpleTitle = false, bannerMode = false }) =>
/>
</div>
)}
- <Swiper
- freeMode={{ enabled: true, sticky: false }}
- slidesPerView={isMobile ? 2.2 : 5.6}
- spaceBetween={isMobile ? 8 : 16}
- onSliderMove={changeBannerOpacity}
- onSlideChangeTransitionEnd={changeBannerOpacity}
- onSlideChangeTransitionStart={changeBannerOpacity}
- prefix='product'
- modules={[FreeMode]}
- >
- {bannerMode && (
- <SwiperSlide>
- <Link href={products.banner.url} className='w-full h-full block'></Link>
- </SwiperSlide>
- )}
- {products?.products?.map((product, index) => (
- <SwiperSlide key={index}>
- <ProductCard product={product} simpleTitle={simpleTitle} />
- </SwiperSlide>
- ))}
- </Swiper>
+ {(isMobile || isDesktop) && (
+ <Swiper
+ freeMode={{ enabled: true, sticky: false }}
+ slidesPerView={isMobile ? 2.2 : 5.6}
+ spaceBetween={isMobile ? 8 : 16}
+ onSliderMove={changeBannerOpacity}
+ onSlideChangeTransitionEnd={changeBannerOpacity}
+ onSlideChangeTransitionStart={changeBannerOpacity}
+ prefix='product'
+ modules={[FreeMode]}
+ >
+ {bannerMode && (
+ <SwiperSlide>
+ <Link href={products.banner.url} className='w-full h-full block'></Link>
+ </SwiperSlide>
+ )}
+ {products?.products?.map((product, index) => (
+ <SwiperSlide key={index}>
+ <ProductCard product={product} simpleTitle={simpleTitle} />
+ </SwiperSlide>
+ ))}
+ </Swiper>
+ )}
</>
)
}