summaryrefslogtreecommitdiff
path: root/src-migrate/pages/shop/cart/index.tsx
diff options
context:
space:
mode:
authorRafi Zadanly <zadanlyr@gmail.com>2024-01-13 10:35:22 +0700
committerRafi Zadanly <zadanlyr@gmail.com>2024-01-13 10:35:22 +0700
commitf62b2345f463695ef0f8f79830cd76b6e0332821 (patch)
treec06ff12a8312e3a02b0203f588db0f4da044c911 /src-migrate/pages/shop/cart/index.tsx
parentee0b5893ac039ab05fe8247647364a923d707da3 (diff)
Refactor src migrate folder
Diffstat (limited to 'src-migrate/pages/shop/cart/index.tsx')
-rw-r--r--src-migrate/pages/shop/cart/index.tsx93
1 files changed, 93 insertions, 0 deletions
diff --git a/src-migrate/pages/shop/cart/index.tsx b/src-migrate/pages/shop/cart/index.tsx
new file mode 100644
index 00000000..397852f9
--- /dev/null
+++ b/src-migrate/pages/shop/cart/index.tsx
@@ -0,0 +1,93 @@
+import style from './cart.module.css'
+
+import React, { useEffect, useMemo } from 'react'
+import Link from 'next/link'
+import { Button, Tooltip } from '@chakra-ui/react'
+
+import { getAuth } from '~/libs/auth'
+import { useCartStore } from '~/modules/cart/stores/useCartStore'
+
+import CartItem from '~/modules/cart/components/Item'
+import CartSummary from '~/modules/cart/components/Summary'
+
+const CartPage = () => {
+ const auth = getAuth()
+
+ const { loadCart, cart, summary } = useCartStore()
+
+ useEffect(() => {
+ if (typeof auth === 'object' && !cart) loadCart(auth.id)
+ }, [auth, loadCart, cart])
+
+ const hasSelectedPromo = useMemo(() => {
+ if (!cart) return false
+ for (const item of cart.products) {
+ if (item.cart_type === 'promotion' && item.selected) return true
+ }
+ return false
+ }, [cart])
+
+ const hasSelected = useMemo(() => {
+ if (!cart) return false
+ for (const item of cart.products) {
+ if (item.selected) return true
+ }
+ return false
+ }, [cart])
+
+ return (
+ <>
+ <div className={style['title']}>
+ Keranjang Belanja
+ </div>
+
+ <div className='h-6' />
+
+ <div className={style['content']}>
+ <div className={style['item-wrapper']}>
+ <div className={style['item-skeleton']}>
+ {!cart && <CartItem.Skeleton count={5} height='120px' />}
+ </div>
+
+ <div className={style['items']}>
+ {cart?.products.map((item) => <CartItem key={item.id} item={item} />)}
+ </div>
+ </div>
+
+ <div className={style['summary-wrapper']}>
+ <div className={style['summary']}>
+ <CartSummary {...summary} isLoaded={!!cart} />
+
+ <div className={style['summary-buttons']}>
+ <Tooltip label={hasSelectedPromo && 'Barang promo tidak dapat dibuat quotation'}>
+ <Button
+ colorScheme='yellow'
+ w='full'
+ isDisabled={hasSelectedPromo || !hasSelected}
+ as={Link}
+ href='/shop/quotation'
+ >
+ Quotation
+ </Button>
+ </Tooltip>
+
+ <Tooltip label={!hasSelected && 'Tidak ada item yang dipilih'}>
+ <Button
+ colorScheme='red'
+ w='full'
+ isDisabled={!hasSelected}
+ as={Link}
+ href='/shop/checkout'
+ >
+ Checkout
+ </Button>
+ </Tooltip>
+ </div>
+ </div>
+ </div>
+ </div>
+ </>
+ )
+}
+
+export default CartPage \ No newline at end of file