diff options
| -rw-r--r-- | src-migrate/modules/product-detail/components/AddToCart.tsx | 56 |
1 files changed, 37 insertions, 19 deletions
diff --git a/src-migrate/modules/product-detail/components/AddToCart.tsx b/src-migrate/modules/product-detail/components/AddToCart.tsx index 1cb58a75..ee7cb385 100644 --- a/src-migrate/modules/product-detail/components/AddToCart.tsx +++ b/src-migrate/modules/product-detail/components/AddToCart.tsx @@ -20,6 +20,7 @@ import axios from 'axios'; import useDevice from '@/core/hooks/useDevice'; import MobileView from '@/core/components/views/MobileView'; import DesktopView from '@/core/components/views/DesktopView'; +import ProductPromoSection from '~/modules/product-promo/components/Section'; type Props = { variantId: number | null; quantity?: number; @@ -177,33 +178,34 @@ const AddToCart = ({ return ( <div className='w-full'> <MobileView> - <Button - onClick={handleButton} - colorScheme={btnConfig[source].colorScheme} - variant= {btnConfig[source].variant} - className='w-full' - > - {btnConfig[source].text} - </Button> + <Button + onClick={handleButton} + colorScheme={btnConfig[source].colorScheme} + variant={btnConfig[source].variant} + className='w-full' + > + {btnConfig[source].text} + </Button> </MobileView> + <DesktopView> - <Button - onClick={handleButton} - colorScheme={btnConfig[source].colorScheme} - variant= {btnConfig[source].variant} - className='w-full' - > - {btnConfig[source].text} - </Button> + <Button + onClick={handleButton} + colorScheme={btnConfig[source].colorScheme} + variant={btnConfig[source].variant} + className='w-full' + > + {btnConfig[source].text} + </Button> </DesktopView> + <BottomPopup className='!container' title='Berhasil Ditambahkan' active={addCartAlert} - close={() => { - setAddCartAlert(false); - }} + close={() => setAddCartAlert(false)} > + {/* HEADER ITEM YANG DITAMBAHKAN */} <div className='flex mt-4'> <div className='w-[10%]'> <ImageNext @@ -214,6 +216,7 @@ const AddToCart = ({ height={80} /> </div> + <div className='ml-3 flex flex-1 items-start font-medium justify-center flex-col gap-y-1'> {!!product.manufacture.name ? ( <Link @@ -232,6 +235,7 @@ const AddToCart = ({ )} <p className='text-ellipsis overflow-hidden'>{product.name}</p> <p>{product.code}</p> + {!!product.lowest_price && product.lowest_price.price > 0 && ( <> <div className='flex items-end gap-x-2'> @@ -267,6 +271,7 @@ const AddToCart = ({ </span> )} </div> + <div className='ml-3 flex items-center font-normal'> <Link href='/shop/cart' @@ -276,6 +281,19 @@ const AddToCart = ({ </Link> </div> </div> + + {/* === PROMO KHUSUS MOBILE (DI ATAS PRODUCT SIMILAR) === */} + <MobileView> + <div className='mt-6'> + <ProductPromoSection + product={product} + // gunakan id varian aktif; fallback ke variantId dari props + productId={Number(activeVariant?.id) || Number(variantId) || 0} + /> + </div> + </MobileView> + + {/* PRODUCT SIMILAR: tetap seperti semula, muncul di mobile & desktop */} <div className='mt-8 mb-4'> <div className='text-h-sm font-semibold mb-6'> Kamu Mungkin Juga Suka |