summaryrefslogtreecommitdiff
path: root/src/lib
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib')
-rw-r--r--src/lib/cart/components/Cart.jsx2
-rw-r--r--src/lib/product/components/Product/ProductDesktop.jsx58
-rw-r--r--src/lib/product/components/Product/ProductMobile.jsx57
-rw-r--r--src/lib/product/components/ProductSlider.jsx46
4 files changed, 79 insertions, 84 deletions
diff --git a/src/lib/cart/components/Cart.jsx b/src/lib/cart/components/Cart.jsx
index d18b1a28..d0685fe3 100644
--- a/src/lib/cart/components/Cart.jsx
+++ b/src/lib/cart/components/Cart.jsx
@@ -329,7 +329,7 @@ const Cart = () => {
<td colSpan={6}>Keranjang belanja anda masih kosong</td>
</tr>
)}
- {products?.map((product) => (
+ {products && products?.map((product) => (
<tr key={product.id}>
<td>
<input
diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx
index 0bff3ceb..bb2b2db9 100644
--- a/src/lib/product/components/Product/ProductDesktop.jsx
+++ b/src/lib/product/components/Product/ProductDesktop.jsx
@@ -321,38 +321,36 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
<ProductSimilar query={productSimilarQuery} />
</LazyLoad>
</div>
- <div>
- <BottomPopup
- className='!w-[50%]'
- title='Berhasil Ditambahkan'
- active={addCartAlert}
- close={() => setAddCartAlert(false)}
- >
- <div className='flex mt-10 mb-5'>
- <div className='w-[15%]'>
- <Image
- src={product.image}
- alt={product.name}
- className='h-20 object-contain object-center w-full border border-gray_r-4'
- />
- </div>
- <div className='ml-3 flex flex-1 items-center text-sm font-normal'>
- {product.name}
- </div>
- <div className='ml-3 flex items-center text-sm font-normal'>
- <Link href='/shop/cart' className='flex-1 py-2 text-gray_r-12 btn-yellow'>
- Lihat Keranjang
- </Link>
- </div>
+
+ <BottomPopup
+ className='!container'
+ title='Berhasil Ditambahkan'
+ active={addCartAlert}
+ close={() => setAddCartAlert(false)}
+ >
+ <div className='flex mt-4'>
+ <div className='w-[10%]'>
+ <Image
+ src={product.image}
+ alt={product.name}
+ className='h-32 object-contain object-center w-full border border-gray_r-4'
+ />
</div>
- <div className='my-12'>
- <div className='text-h-lg font-semibold mb-6'>Kamu Mungkin Juga Suka</div>
- <LazyLoad>
- <ProductSimilar query={productSimilarQuery} />
- </LazyLoad>
+ <div className='ml-3 flex flex-1 items-center font-normal'>{product.name}</div>
+ <div className='ml-3 flex items-center font-normal'>
+ <Link href='/shop/cart' className='flex-1 py-2 text-gray_r-12 btn-yellow'>
+ Lihat Keranjang
+ </Link>
</div>
- </BottomPopup>
- </div>
+ </div>
+
+ <div className='mt-8 mb-4'>
+ <div className='text-h-sm font-semibold mb-6'>Kamu Mungkin Juga Suka</div>
+ <LazyLoad>
+ <ProductSimilar query={productSimilarQuery} />
+ </LazyLoad>
+ </div>
+ </BottomPopup>
</div>
</DesktopView>
)
diff --git a/src/lib/product/components/Product/ProductMobile.jsx b/src/lib/product/components/Product/ProductMobile.jsx
index 43ef0e5e..b75a191b 100644
--- a/src/lib/product/components/Product/ProductMobile.jsx
+++ b/src/lib/product/components/Product/ProductMobile.jsx
@@ -89,7 +89,6 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
quantity,
selected: true
})
- // toast.success('Berhasil menambahkan ke keranjang')
setAddCartAlert(true)
}
@@ -270,37 +269,33 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
</LazyLoad>
</div>
- <div>
- <BottomPopup
- title='Berhasil Ditambahkan'
- active={addCartAlert}
- close={() => setAddCartAlert(false)}
- >
- <div className='flex mt-10 mb-5'>
- <div className='w-[15%]'>
- <Image
- src={product.image}
- alt={product.name}
- className='h-20 object-contain object-center w-full border border-gray_r-4'
- />
- </div>
- <div className='ml-3 flex flex-1 items-center text-sm font-normal'>
- {product.name}
- </div>
- <div className='ml-3 flex items-center text-sm font-normal'>
- <Link href='/shop/cart' className='flex-1 py-2 text-gray_r-12 btn-yellow'>
- Lihat Keranjang
- </Link>
- </div>
- </div>
- <div className='my-12'>
- <div className='text-h-lg font-semibold mb-6'>Kamu Mungkin Juga Suka</div>
- <LazyLoad>
- <ProductSimilar query={productSimilarQuery} />
- </LazyLoad>
- </div>
- </BottomPopup>
+ <BottomPopup
+ title='Berhasil Ditambahkan'
+ active={addCartAlert}
+ close={() => setAddCartAlert(false)}
+ >
+ <div className='flex mt-4'>
+ <div className='w-[15%]'>
+ <Image
+ src={product.image}
+ alt={product.name}
+ className='h-20 object-contain object-center w-full border border-gray_r-4'
+ />
+ </div>
+ <div className='ml-3 flex flex-1 items-center text-sm font-normal'>{product.name}</div>
+ <div className='ml-3 flex items-center text-sm font-normal'>
+ <Link href='/shop/cart' className='flex-1 py-2 text-gray_r-12 btn-yellow'>
+ Lihat Keranjang
+ </Link>
+ </div>
+ </div>
+ <div className='mt-8 mb-4'>
+ <div className='text-h-sm font-semibold mb-6'>Kamu Mungkin Juga Suka</div>
+ <LazyLoad>
+ <ProductSimilar query={productSimilarQuery} />
+ </LazyLoad>
</div>
+ </BottomPopup>
</MobileView>
)
}
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>
+ )}
</>
)
}
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-18 05:13:38 +0000