<iman> update delete button

1 files changed, 19 insertions, 5 deletions

diff --git a/src-migrate/pages/shop/cart/index.tsx b/src-migrate/pages/shop/cart/index.tsx
index cb0156f1..4586c65c 100644
--- a/src-migrate/pages/shop/cart/index.tsx
+++ b/src-migrate/pages/shop/cart/index.tsx
@@ -15,7 +15,8 @@ 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 { upsertUserCart } from '~/services/cart'
+import { deleteUserCart ,upsertUserCart } from '~/services/cart'
+import { Trash2Icon } from 'lucide-react';
 
 const CartPage = () => {
   const router = useRouter();
@@ -25,7 +26,7 @@ const CartPage = () => {
   const [isButtonChek, setIsButtonChek] = useState(false);
   const [buttonSelectNow, setButtonSelectNow] = useState(true);
   const [isLoad, setIsLoad] = useState<boolean>(false)
-
+  const [isLoadDelete, setIsLoadDelete] = useState<boolean>(false)
   const { loadCart, cart, summary } = useCartStore();
   const useDivvice = useDevice();
 
@@ -87,8 +88,17 @@ const CartPage = () => {
     setIsLoad(false)
   }
 
-  const handleDelete = () => {
-    console.log("delete data");
+  const handleDelete = async () => {
+    if (typeof auth !== 'object' || !cart) return;
+
+    setIsLoadDelete(true)
+    for (const item of cart.products) {
+      if(item.selected === true){
+        await deleteUserCart(auth.id, [item.cart_id])
+        await loadCart(auth.id)
+      }
+    }
+    setIsLoadDelete(false)
   }
 
   return (
@@ -128,7 +138,11 @@ const CartPage = () => {
                     isDisabled={!hasSelected || hasSelectNoPrice}
                     onClick={handleDelete}
                   >
-                    Hapus Barang
+                    {isLoadDelete && <Spinner size='xs' />}
+                    {!isLoadDelete && <Trash2Icon size={16} />}
+                    <p className='text-sm ml-2'>
+                     Hapus Barang
+                      </p> 
                   </Button>
                 </Tooltip>
           </div>