1 files changed, 60 insertions, 61 deletions

diff --git a/src-migrate/pages/shop/cart/index.tsx b/src-migrate/pages/shop/cart/index.tsx
index 03854d79..795dfa72 100644
--- a/src-migrate/pages/shop/cart/index.tsx
+++ b/src-migrate/pages/shop/cart/index.tsx
@@ -29,24 +29,26 @@ import {
 
 const SELECT_ALL_ID = 'select_all_checkbox';
 
-const CartPage = () => {
+const CartPage: React.FC = () => {
   const router = useRouter();
   const auth = getAuth();
-  const [isStepApproval, setIsStepApproval] = useState(false);
+  const [isStepApproval, setIsStepApproval] = useState<boolean>(false);
   const [isLoadDelete, setIsLoadDelete] = useState<boolean>(false);
   const { loadCart, cart, summary, updateCartItem } = useCartStore();
   const device = useDevice();
   const { setRefreshCart } = useProductCartContext();
-  const [isTop, setIsTop] = useState(true);
-  const [isUpdating, setIsUpdating] = useState(false);
-  const [isAnyCheckboxUpdating, setIsAnyCheckboxUpdating] = useState(false);
-  const [isAnyQuantityUpdating, setIsAnyQuantityUpdating] = useState(false);
+  const [isTop, setIsTop] = useState<boolean>(true);
+  const [isUpdating, setIsUpdating] = useState<boolean>(false);
+  const [isAnyCheckboxUpdating, setIsAnyCheckboxUpdating] =
+    useState<boolean>(false);
+  const [isAnyQuantityUpdating, setIsAnyQuantityUpdating] =
+    useState<boolean>(false);
 
   // Subscribe to update state changes
   useEffect(() => {
-    const handleCheckboxUpdate = (isUpdating) =>
+    const handleCheckboxUpdate = (isUpdating: boolean): void =>
       setIsAnyCheckboxUpdating(isUpdating);
-    const handleQuantityUpdate = (isUpdating) =>
+    const handleQuantityUpdate = (isUpdating: boolean): void =>
       setIsAnyQuantityUpdating(isUpdating);
 
     checkboxUpdateState.addListener(handleCheckboxUpdate);
@@ -60,7 +62,7 @@ const CartPage = () => {
 
   // Handle scroll for sticky header styling
   useEffect(() => {
-    const handleScroll = () => setIsTop(window.scrollY < 200);
+    const handleScroll = (): void => setIsTop(window.scrollY < 200);
 
     window.addEventListener('scroll', handleScroll);
     return () => window.removeEventListener('scroll', handleScroll);
@@ -68,36 +70,40 @@ const CartPage = () => {
 
   // Initialize cart and sync with cookies
   useEffect(() => {
-    const initializeCart = async () => {
+    const initializeCart = async (): Promise<void> => {
       if (typeof auth === 'object' && !cart) {
         await loadCart(auth.id);
         setIsStepApproval(auth?.feature?.soApproval);
-
-        if (cart?.products) {
-          const { items, needsUpdate } = syncSelectedItemsWithCookie(
-            cart.products
-          );
-
-          if (needsUpdate) {
-            const updatedCart = {
-              ...cart,
-              products: cart.products.map((item) => ({
-                ...item,
-                selected:
-                  items[item.id] !== undefined ? items[item.id] : item.selected,
-              })),
-            };
-            updateCartItem(updatedCart);
-          }
-        }
       }
     };
 
     initializeCart();
-  }, [auth, cart, loadCart, updateCartItem]);
+  }, [auth, cart, loadCart]);
+
+  // Separate effect to sync with cookies after cart is loaded
+  useEffect(() => {
+    if (cart?.products) {
+      const { items, needsUpdate } = syncSelectedItemsWithCookie(cart.products);
+      const typedItems = items as Record<number, boolean>;
+
+      if (needsUpdate) {
+        const updatedCart = {
+          ...cart,
+          products: cart.products.map((item) => ({
+            ...item,
+            selected:
+              typedItems[item.id] !== undefined
+                ? typedItems[item.id]
+                : item.selected,
+          })),
+        };
+        updateCartItem(updatedCart);
+      }
+    }
+  }, [cart, updateCartItem]);
 
   // Computed values
-  const hasSelectedPromo = useMemo(() => {
+  const hasSelectedPromo = useMemo((): boolean => {
     return (
       cart?.products?.some(
         (item) => item.cart_type === 'promotion' && item.selected
@@ -105,11 +111,11 @@ const CartPage = () => {
     );
   }, [cart]);
 
-  const hasSelected = useMemo(() => {
+  const hasSelected = useMemo((): boolean => {
     return cart?.products?.some((item) => item.selected) || false;
   }, [cart]);
 
-  const hasSelectNoPrice = useMemo(() => {
+  const hasSelectNoPrice = useMemo((): boolean => {
     return (
       cart?.products?.some(
         (item) => item.selected && item.price.price_discount === 0
@@ -117,22 +123,22 @@ const CartPage = () => {
     );
   }, [cart]);
 
-  const hasSelectedAll = useMemo(() => {
+  const hasSelectedAll = useMemo((): boolean => {
     if (!cart?.products?.length) return false;
     return cart.products.every((item) => item.selected);
   }, [cart]);
 
   // Button states
-  const areButtonsDisabled =
+  const areButtonsDisabled: boolean =
     isUpdating ||
     isLoadDelete ||
     isAnyCheckboxUpdating ||
     isAnyQuantityUpdating;
-  const isSelectAllDisabled =
-    isUpdating || checkboxUpdateState.isCheckboxUpdating(SELECT_ALL_ID);
+  const isSelectAllDisabled: boolean =
+    isUpdating || checkboxUpdateState.isCheckboxUpdating();
 
   // Handlers
-  const handleCheckout = () => {
+  const handleCheckout = (): void => {
     if (areButtonsDisabled) {
       toast.error('Harap tunggu pembaruan selesai');
       return;
@@ -140,7 +146,7 @@ const CartPage = () => {
     router.push('/shop/checkout');
   };
 
-  const handleQuotation = () => {
+  const handleQuotation = (): void => {
     if (areButtonsDisabled) {
       toast.error('Harap tunggu pembaruan selesai');
       return;
@@ -152,12 +158,14 @@ const CartPage = () => {
     }
   };
 
-  const handleSelectAll = async (e: React.ChangeEvent<HTMLInputElement>) => {
+  const handleSelectAll = async (
+    e: React.ChangeEvent<HTMLInputElement>
+  ): Promise<void> => {
     if (!cart || isUpdating || typeof auth !== 'object') return;
 
     const newSelectedState = !hasSelectedAll;
     setIsUpdating(true);
-    checkboxUpdateState.startUpdate(SELECT_ALL_ID);
+    checkboxUpdateState.startUpdate();
 
     try {
       // Update UI immediately
@@ -182,7 +190,6 @@ const CartPage = () => {
           id: item.id,
           qty: item.quantity,
           selected: newSelectedState,
-          purchase_tax_id: item.purchase_tax_id || null,
         })
       );
 
@@ -208,15 +215,15 @@ const CartPage = () => {
       );
     } finally {
       setIsUpdating(false);
-      checkboxUpdateState.endUpdate(SELECT_ALL_ID);
+      checkboxUpdateState.endUpdate();
     }
   };
 
-  const handleDelete = async () => {
+  const handleDelete = async (): Promise<void> => {
     if (typeof auth !== 'object' || !cart) return;
 
     setIsLoadDelete(true);
-    checkboxUpdateState.startUpdate('delete_operation');
+    checkboxUpdateState.startUpdate();
 
     try {
       const itemsToDelete = cart.products.filter((item) => item.selected);
@@ -239,7 +246,7 @@ const CartPage = () => {
 
       // Clean up cookies
       removeSelectedItemsFromCookie(itemIdsToDelete);
-      removeCartItemsFromCookie(cartIdsToDelete);
+      removeCartItemsFromCookie(cartIdsToDelete.map(String));
 
       // Reload from server
       loadCart(auth.id).catch((error) =>
@@ -254,12 +261,12 @@ const CartPage = () => {
       loadCart(auth.id);
     } finally {
       setIsLoadDelete(false);
-      checkboxUpdateState.endUpdate('delete_operation');
+      checkboxUpdateState.endUpdate();
     }
   };
 
   // Tooltip messages
-  const getTooltipMessage = () => {
+  const getTooltipMessage = (): string => {
     if (isAnyQuantityUpdating) return 'Harap tunggu update quantity selesai';
     if (isAnyCheckboxUpdating) return 'Harap tunggu pembaruan checkbox selesai';
     if (isLoadDelete) return 'Harap tunggu penghapusan selesai';
@@ -267,7 +274,7 @@ const CartPage = () => {
     return '';
   };
 
-  const getQuotationTooltip = () => {
+  const getQuotationTooltip = (): string => {
     const baseMessage = getTooltipMessage();
     if (baseMessage) return baseMessage;
     if (hasSelectedPromo) return 'Barang promo tidak dapat dibuat quotation';
@@ -275,7 +282,7 @@ const CartPage = () => {
     return '';
   };
 
-  const getCheckoutTooltip = () => {
+  const getCheckoutTooltip = (): string => {
     const baseMessage = getTooltipMessage();
     if (baseMessage) return baseMessage;
     if (!hasSelected) return 'Tidak ada item yang dipilih';
@@ -283,7 +290,7 @@ const CartPage = () => {
     return '';
   };
 
-  const getDeleteTooltip = () => {
+  const getDeleteTooltip = (): string => {
     const baseMessage = getTooltipMessage();
     if (baseMessage) return baseMessage;
     if (!hasSelected) return 'Tidak ada item yang dipilih';
@@ -395,17 +402,9 @@ const CartPage = () => {
         >
           <div className={style.summary}>
             {device.isMobile ? (
-              <CartSummaryMobile
-                {...summary}
-                isLoaded={!!cart}
-                products={cart?.products}
-              />
+              <CartSummaryMobile {...summary} isLoaded={!!cart} />
             ) : (
-              <CartSummary
-                {...summary}
-                isLoaded={!!cart}
-                products={cart?.products}
-              />
+              <CartSummary {...summary} isLoaded={!!cart} />
             )}
 
             <div
@@ -452,4 +451,4 @@ const CartPage = () => {
   );
 };
 
-export default CartPage;
\ No newline at end of file
+export default CartPage;