fix: add loading state to approve modal

src/components/pages/marketing/MarketingTable.tsx

@@ -297,6 +297,8 @@ const MarketingTable = () => {
 
   const [isLoadingExportingToExcel, setIsLoadingExportingToExcel] =
     useState(false);
+  const [isApproveLoading, setIsApproveLoading] = useState(false);
+  const [isDeliveryLoading, setIsDeliveryLoading] = useState(false);
 
   const filterResetHandler = () => {
     updateFilter('product_ids', '', true);
@@ -452,6 +454,9 @@ const MarketingTable = () => {
       return;
     }
 
+    setIsApproveLoading(true);
+
+    try {
       const approveMarketingRes: BaseApiResponse<unknown> | undefined =
         approveAction === 'APPROVED'
           ? await MarketingApi.bulkApprovals(
@@ -460,7 +465,11 @@ const MarketingTable = () => {
               '',
               notes || `APPROVED marketing ${idsToProcess.join(', ')}`
             )
-        : await SalesOrderApi.bulkApprovals(idsToProcess, approveAction, notes);
+          : await SalesOrderApi.bulkApprovals(
+              idsToProcess,
+              approveAction,
+              notes
+            );
 
       if (isResponseSuccess(approveMarketingRes)) {
         confirmationModal.closeModal();
@@ -469,6 +478,9 @@ const MarketingTable = () => {
       }
 
       refreshMarketing();
+    } finally {
+      setIsApproveLoading(false);
+    }
   };
 
   const bulkDeliveryDateChangeHandler: ChangeEventHandler<HTMLInputElement> = (
@@ -530,13 +542,21 @@ const MarketingTable = () => {
   };
 
   const confirmationModalDeliveryClickHandler = async (notes: string) => {
-    const res = await SalesOrderApi.delivery(selectedItem?.id as number, notes);
+    setIsDeliveryLoading(true);
+    try {
+      const res = await SalesOrderApi.delivery(
+        selectedItem?.id as number,
+        notes
+      );
       deliveryModal.closeModal();
       toast.success(res?.message as string);
       refreshMarketing?.();
       router.push(
         `/marketing/detail/delivery-orders/edit?id=${selectedItem?.id}`
       );
+    } finally {
+      setIsDeliveryLoading(false);
+    }
   };
 
   const getRowCanSelect = useCallback(
@@ -1020,11 +1040,13 @@ const MarketingTable = () => {
         text={`Apakah anda yakin ingin ${approveAction == 'APPROVED' ? 'approve' : 'reject'} data penjualan tahap ${selectedApprovalStep ?? '-'} (${idsToProcess.length} data)?`}
         secondaryButton={{
           text: 'Tidak',
+          isLoading: isApproveLoading,
           onClick: confirmationModal.closeModal,
         }}
         primaryButton={{
           text: 'Ya',
           color: approveAction === 'APPROVED' ? 'success' : 'error',
+          isLoading: isApproveLoading,
           onClick: approveMarketingHandler,
         }}
       />
@@ -1048,10 +1070,12 @@ const MarketingTable = () => {
         text={`Apakah anda yakin ingin deliver penjualan ${selectedItem?.so_number}?`}
         secondaryButton={{
           text: 'Tidak',
+          isLoading: isDeliveryLoading,
         }}
         primaryButton={{
           text: 'Ya',
           color: 'success',
+          isLoading: isDeliveryLoading,
           onClick: confirmationModalDeliveryClickHandler,
         }}
       />
@@ -1111,6 +1135,7 @@ const MarketingTable = () => {
             <Button
               variant='outline'
               color='none'
+              disabled={isSubmittingBulkDelivery}
               onClick={() => {
                 bulkDeliveryModal.closeModal();
                 setBulkDeliveryDate('');
@@ -1123,6 +1148,7 @@ const MarketingTable = () => {
             <Button
               color='success'
               isLoading={isSubmittingBulkDelivery}
+              disabled={isSubmittingBulkDelivery}
               onClick={() =>
                 submitBulkDeliveryApprovalHandler(
                   idsToProcess,