wip

packages/webapp/src/containers/Purchases/Bills/BillsLanding/BillsActionsBar.tsx

@@ -29,11 +29,13 @@ import withBillsActions from './withBillsActions';
 import withSettings from '@/containers/Settings/withSettings';
 import withSettingsActions from '@/containers/Settings/withSettingsActions';
 import withDialogActions from '@/containers/Dialog/withDialogActions';
-import withAlertActions from '@/containers/Alert/withAlertActions';
 
 import { useBillsListContext } from './BillsListProvider';
-import { useRefreshBills } from '@/hooks/query/bills';
+import {
+  useRefreshBills,
+} from '@/hooks/query/bills';
 import { useDownloadExportPdf } from '@/hooks/query/FinancialReports/use-export-pdf';
+import { useBulkDeleteBillsDialog } from './hooks/use-bulk-delete-bills-dialog';
 
 import { compose } from '@/utils';
 import { DialogsName } from '@/constants/dialogs';
@@ -58,9 +60,6 @@ function BillActionsBar({
 
   // #withDialogActions
   openDialog,
-
-  // #withAlertActions
-  openAlert,
 }) {
   const history = useHistory();
 
@@ -103,9 +102,14 @@ function BillActionsBar({
   const handlePrintBtnClick = () => {
     downloadExportPdf({ resource: 'Bill' });
   };
+  const {
+    openBulkDeleteDialog,
+    isValidatingBulkDeleteBills,
+  } = useBulkDeleteBillsDialog();
+
   // Handle bulk delete.
   const handleBulkDelete = () => {
-    openAlert('bills-bulk-delete', { billsIds: billsSelectedRows });
+    openBulkDeleteDialog(billsSelectedRows);
   };
 
   if (!isEmpty(billsSelectedRows)) {
@@ -118,6 +122,7 @@ function BillActionsBar({
             text={<T id={'delete'} />}
             intent={Intent.DANGER}
             onClick={handleBulkDelete}
+            disabled={isValidatingBulkDeleteBills}
           />
         </NavbarGroup>
       </DashboardActionsBar>
@@ -214,5 +219,4 @@ export default compose(
     billsTableSize: billsettings?.tableSize,
   })),
   withDialogActions,
-  withAlertActions,
 )(BillActionsBar);

packages/webapp/src/containers/Purchases/Bills/BillsLanding/BillsAlerts.tsx

@@ -12,10 +12,6 @@ const BillLocatedLandedCostDeleteAlert = React.lazy(
   () => import('@/containers/Alerts/Bills/BillLocatedLandedCostDeleteAlert'),
 );
 
-const BillBulkDeleteAlert = React.lazy(
-  () => import('@/containers/Alerts/Bills/BillBulkDeleteAlert'),
-);
-
 export default [
   { name: 'bill-delete', component: BillDeleteAlert },
   { name: 'bill-open', component: BillOpenAlert },
@@ -23,5 +19,4 @@ export default [
     name: 'bill-located-cost-delete',
     component: BillLocatedLandedCostDeleteAlert,
   },
-  { name: 'bills-bulk-delete', component: BillBulkDeleteAlert },
 ];

packages/webapp/src/containers/Purchases/Bills/BillsLanding/hooks/use-bulk-delete-bills-dialog.ts

@@ -0,0 +1,20 @@
+// @ts-nocheck
+import { DialogsName } from '@/constants/dialogs';
+import { useValidateBulkDeleteBills } from '@/hooks/query/bills';
+import { useBulkDeleteDialog } from '@/hooks/dialogs/useBulkDeleteDialog';
+
+export const useBulkDeleteBillsDialog = () => {
+  const validateBulkDeleteMutation = useValidateBulkDeleteBills();
+  const {
+    openBulkDeleteDialog,
+    closeBulkDeleteDialog,
+    isValidatingBulkDelete,
+  } = useBulkDeleteDialog(DialogsName.BillBulkDelete, validateBulkDeleteMutation);
+
+  return {
+    openBulkDeleteDialog,
+    closeBulkDeleteDialog,
+    isValidatingBulkDeleteBills: isValidatingBulkDelete,
+  };
+};
+