From 36601aba6017aeef16f89351eb487238402ab52e Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Tue, 24 Sep 2024 16:12:50 +0700
Subject: <iman> update Perapihan Tag

---
 src-migrate/pages/shop/cart/index.tsx | 146 ++++++++++++++++++----------------
 1 file changed, 76 insertions(+), 70 deletions(-)

(limited to 'src-migrate/pages')

diff --git a/src-migrate/pages/shop/cart/index.tsx b/src-migrate/pages/shop/cart/index.tsx
index 4768f62d..c5386c91 100644
--- a/src-migrate/pages/shop/cart/index.tsx
+++ b/src-migrate/pages/shop/cart/index.tsx
@@ -14,10 +14,10 @@ import clsxm from '~/libs/clsxm';
 import useDevice from '@/core/hooks/useDevice';
 import CartSummaryMobile from '~/modules/cart/components/CartSummaryMobile';
 import Image from '~/components/ui/image';
-import { CartItem } from '~/types/cart'
-import { deleteUserCart ,upsertUserCart } from '~/services/cart'
+import { CartItem } from '~/types/cart';
+import { deleteUserCart, upsertUserCart } from '~/services/cart';
 import { Trash2Icon } from 'lucide-react';
-import { useProductCartContext } from '@/contexts/ProductCartContext'
+import { useProductCartContext } from '@/contexts/ProductCartContext';
 
 const CartPage = () => {
   const router = useRouter();
@@ -26,11 +26,11 @@ const CartPage = () => {
   const [isSelectedAll, setIsSelectedAll] = useState(false);
   const [isButtonChek, setIsButtonChek] = useState(false);
   const [buttonSelectNow, setButtonSelectNow] = useState(true);
-  const [isLoad, setIsLoad] = useState<boolean>(false)
-  const [isLoadDelete, setIsLoadDelete] = useState<boolean>(false)
+  const [isLoad, setIsLoad] = useState<boolean>(false);
+  const [isLoadDelete, setIsLoadDelete] = useState<boolean>(false);
   const { loadCart, cart, summary, updateCartItem } = useCartStore();
   const useDivvice = useDevice();
-  const { setRefreshCart } = useProductCartContext()
+  const { setRefreshCart } = useProductCartContext();
   const [isTop, setIsTop] = useState(true);
   const [hasChanged, setHasChanged] = useState(false);
   const prevCartRef = useRef<CartItem[] | null>(null);
@@ -64,18 +64,19 @@ const CartPage = () => {
     const hasSelectedChanged = () => {
       if (prevCartRef.current && cart) {
         const prevCart = prevCartRef.current;
-        return cart.products.some((item, index) => 
-          prevCart[index] && prevCart[index].selected !== item.selected
+        return cart.products.some(
+          (item, index) =>
+            prevCart[index] && prevCart[index].selected !== item.selected
         );
       }
       return false;
     };
 
     if (hasSelectedChanged()) {
-      setHasChanged(true)
+      setHasChanged(true);
       // Perform necessary actions here if selection has changed
-    }else{
-      setHasChanged(false)
+    } else {
+      setHasChanged(false);
     }
 
     prevCartRef.current = cart ? [...cart.products] : null;
@@ -83,35 +84,38 @@ const CartPage = () => {
 
   const hasSelectedPromo = useMemo(() => {
     if (!cart) return false;
-    return cart.products.some(item => item.cart_type === 'promotion' && item.selected);
+    return cart.products.some(
+      (item) => item.cart_type === 'promotion' && item.selected
+    );
   }, [cart]);
 
   const hasSelected = useMemo(() => {
     if (!cart) return false;
-    return cart.products.some(item => item.selected);
+    return cart.products.some((item) => item.selected);
   }, [cart]);
 
   const hasSelectNoPrice = useMemo(() => {
     if (!cart) return false;
-    return cart.products.some(item => item.selected && item.price.price_discount === 0);
+    return cart.products.some(
+      (item) => item.selected && item.price.price_discount === 0
+    );
   }, [cart]);
 
   const hasSelectedAll = useMemo(() => {
     if (!cart || !Array.isArray(cart.products)) return false;
-    return cart.products.every(item => item.selected);
+    return cart.products.every((item) => item.selected);
   }, [cart]);
 
-
   useEffect(() => {
     const updateCartItems = async () => {
       if (typeof auth === 'object' && cart) {
-        const upsertPromises = cart.products.map(item => 
+        const upsertPromises = cart.products.map((item) =>
           upsertUserCart({
             userId: auth.id,
             type: item.cart_type,
             id: item.id,
             qty: item.quantity,
-            selected: item.selected
+            selected: item.selected,
           })
         );
         try {
@@ -128,7 +132,7 @@ const CartPage = () => {
 
   const handleCheckout = () => {
     router.push('/shop/checkout');
-  }
+  };
 
   const handleQuotation = () => {
     if (hasSelectedPromo || !hasSelected) {
@@ -136,54 +140,53 @@ const CartPage = () => {
     } else {
       router.push('/shop/quotation');
     }
-  }
+  };
 
   const handleChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
-    
-    
     if (cart) {
       const updatedCart = {
         ...cart,
-        products: cart.products.map(item => ({
+        products: cart.products.map((item) => ({
           ...item,
-          selected: !hasSelectedAll
-        }))
+          selected: !hasSelectedAll,
+        })),
       };
-      
-      updateCartItem(updatedCart); 
-      if(hasSelectedAll){
+
+      updateCartItem(updatedCart);
+      if (hasSelectedAll) {
         setIsSelectedAll(false);
-      }else{
+      } else {
         setIsSelectedAll(true);
       }
     }
   };
 
-
   const handleDelete = async () => {
     if (typeof auth !== 'object' || !cart) return;
 
-    setIsLoadDelete(true)
+    setIsLoadDelete(true);
     for (const item of cart.products) {
-      if(item.selected === true){
-        await deleteUserCart(auth.id, [item.cart_id])
-        await loadCart(auth.id)
+      if (item.selected === true) {
+        await deleteUserCart(auth.id, [item.cart_id]);
+        await loadCart(auth.id);
       }
     }
-    setIsLoadDelete(false)
-    setRefreshCart(true)
-  }
+    setIsLoadDelete(false);
+    setRefreshCart(true);
+  };
 
   return (
     <>
-      <div className={`${isTop ? 'border-b-[0px]' : 'border-b-[1px]'} sticky  md:top-[157px] flex-col  bg-white py-4 border-gray-300 z-50 sm:w-full md:w-3/4`}>
-        <div className={`${style['title']}`}>Keranjang Belanja</div>
+      <div
+        className={`${
+          isTop ? 'border-b-[0px]' : 'border-b-[1px]'
+        } sticky  md:top-[157px] flex-col  bg-white py-4 border-gray-300 z-50 sm:w-full md:w-3/4`}
+      >
+        <h1 className={`${style['title']}`}>Keranjang Belanja</h1>
         <div className='h-2' />
         <div className={`flex items-center object-center justify-between `}>
           <div className='flex items-center object-center'>
-            {isLoad && (
-              <Spinner className='my-auto' size='sm' />
-            )}
+            {isLoad && <Spinner className='my-auto' size='sm' />}
             {!isLoad && (
               <Checkbox
                 borderColor='gray.600'
@@ -193,34 +196,31 @@ const CartPage = () => {
                 onChange={handleChange}
               />
             )}
-              <p className='p-2 text-caption-2'>
-                {hasSelectedAll ? "Uncheck all" : "Select all"}
-              </p>
+            <p className='p-2 text-caption-2'>
+              {hasSelectedAll ? 'Uncheck all' : 'Select all'}
+            </p>
+          </div>
+          <div className='delate all flex items-center object-center'>
+            <Tooltip
+              label={clsxm({
+                'Tidak ada item yang dipilih': !hasSelected,
+              })}
+            >
+              <Button
+                bg='#fadede'
+                variant='outline'
+                colorScheme='red'
+                w='full'
+                isDisabled={!hasSelected}
+                onClick={handleDelete}
+              >
+                {isLoadDelete && <Spinner size='xs' />}
+                {!isLoadDelete && <Trash2Icon size={16} />}
+                <p className='text-sm ml-2'>Hapus Barang</p>
+              </Button>
+            </Tooltip>
           </div>
-            <div className='delate all flex items-center object-center'>
-                  <Tooltip
-                    label={clsxm({
-                      'Tidak ada item yang dipilih': !hasSelected,
-                    })}
-                  >
-                    <Button
-                      bg='#fadede' 
-                      variant='outline' 
-                      colorScheme='red'
-                      w='full'
-                      isDisabled={!hasSelected}
-                      onClick={handleDelete}
-                    >
-                      {isLoadDelete && <Spinner size='xs' />}
-                      {!isLoadDelete && <Trash2Icon size={16} />}
-                      <p className='text-sm ml-2'>
-                      Hapus Barang
-                        </p> 
-                    </Button>
-                  </Tooltip>
-            </div>
         </div>
-
       </div>
 
       <div className={style['content']}>
@@ -274,7 +274,13 @@ const CartPage = () => {
               <CartSummary {...summary} isLoaded={!!cart} />
             )}
 
-            <div className={isStepApproval ? style['summary-buttons-step-approval'] : style['summary-buttons']}>
+            <div
+              className={
+                isStepApproval
+                  ? style['summary-buttons-step-approval']
+                  : style['summary-buttons']
+              }
+            >
               <Tooltip
                 label={
                   hasSelectedPromo &&
@@ -315,4 +321,4 @@ const CartPage = () => {
   );
 };
 
-export default CartPage;
\ No newline at end of file
+export default CartPage;
-- 
cgit v1.2.3