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,
+  };
+};
+

packages/webapp/src/containers/Purchases/CreditNotes/CreditNotesLanding/VendorsCreditNoteActionsBar.tsx

@@ -1,6 +1,7 @@
 // @ts-nocheck
 import React from 'react';
 import { useHistory } from 'react-router-dom';
+import { isEmpty } from 'lodash';
 import {
   Button,
   Classes,
@@ -32,7 +33,6 @@ import { VendorCreditAction, AbilitySubject } from '@/constants/abilityOption';
 import withVendorsCreditNotesActions from './withVendorsCreditNotesActions';
 import withSettings from '@/containers/Settings/withSettings';
 import withSettingsActions from '@/containers/Settings/withSettingsActions';
-import withVendorsCreditNotes from './withVendorsCreditNotes';
 import withDialogActions from '@/containers/Dialog/withDialogActions';
 import withVendorActions from './withVendorActions';
 import withDrawerActions from '@/containers/Drawer/withDrawerActions';
@@ -40,6 +40,8 @@ import withDrawerActions from '@/containers/Drawer/withDrawerActions';
 import { compose } from '@/utils';
 import { DialogsName } from '@/constants/dialogs';
 import { DRAWERS } from '@/constants/drawers';
+import withVendorsCreditNotes from './withVendorsCreditNotes';
+import { useBulkDeleteVendorCreditsDialog } from './hooks/use-bulk-delete-vendor-credits-dialog';
 
 /**
  * Vendors Credit note  table actions bar.
@@ -49,6 +51,7 @@ function VendorsCreditNoteActionsBar({
 
   // #withVendorsCreditNotes
   vendorCreditFilterRoles,
+  vendorsCreditNoteSelectedRows,
 
   // #withVendorsCreditNotesActions
   setVendorsCreditNoteTableState,
@@ -107,6 +110,32 @@ function VendorsCreditNoteActionsBar({
     openDrawer(DRAWERS.CREDIT_NOTE_DETAILS);
   };
 
+  const {
+    openBulkDeleteDialog,
+    isValidatingBulkDeleteVendorCredits,
+  } = useBulkDeleteVendorCreditsDialog();
+
+  if (!isEmpty(vendorsCreditNoteSelectedRows)) {
+    const handleBulkDelete = () => {
+      openBulkDeleteDialog(vendorsCreditNoteSelectedRows);
+    };
+
+    return (
+      <DashboardActionsBar>
+        <NavbarGroup>
+          <Button
+            className={Classes.MINIMAL}
+            icon={<Icon icon="trash-16" iconSize={16} />}
+            text={<T id={'delete'} />}
+            intent={Intent.DANGER}
+            onClick={handleBulkDelete}
+            disabled={isValidatingBulkDeleteVendorCredits}
+          />
+        </NavbarGroup>
+      </DashboardActionsBar>
+    );
+  }
+
   return (
     <DashboardActionsBar>
       <NavbarGroup>
@@ -199,9 +228,12 @@ export default compose(
   withVendorsCreditNotesActions,
   withVendorActions,
   withSettingsActions,
-  withVendorsCreditNotes(({ vendorsCreditNoteTableState }) => ({
-    vendorCreditFilterRoles: vendorsCreditNoteTableState.filterRoles,
-  })),
+  withVendorsCreditNotes(
+    ({ vendorsCreditNoteTableState, vendorsCreditNoteSelectedRows }) => ({
+      vendorCreditFilterRoles: vendorsCreditNoteTableState.filterRoles,
+      vendorsCreditNoteSelectedRows,
+    }),
+  ),
   withSettings(({ vendorsCreditNoteSetting }) => ({
     creditNoteTableSize: vendorsCreditNoteSetting?.tableSize,
   })),

packages/webapp/src/containers/Purchases/CreditNotes/CreditNotesLanding/VendorsCreditNoteDataTable.tsx

@@ -32,6 +32,7 @@ import { DRAWERS } from '@/constants/drawers';
 function VendorsCreditNoteDataTable({
   // #withVendorsCreditNotesActions
   setVendorsCreditNoteTableState,
+  setVendorsCreditNoteSelectedRows,
 
   // #withVendorCredits
   vendorsCreditNoteTableState,
@@ -119,6 +120,11 @@ function VendorsCreditNoteDataTable({
     openDialog('reconcile-vendor-credit', { vendorCreditId: id });
   };
 
+  const handleSelectedRowsChange = (selectedFlatRows) => {
+    const selectedIds = selectedFlatRows?.map((row) => row.original.id) || [];
+    setVendorsCreditNoteSelectedRows(selectedIds);
+  };
+
   return (
     <DashboardContentTable>
       <DataTable
@@ -141,6 +147,7 @@ function VendorsCreditNoteDataTable({
         onCellClick={handleCellClick}
         initialColumnsWidths={initialColumnsWidths}
         onColumnResizing={handleColumnResizing}
+        onSelectedRowsChange={handleSelectedRowsChange}
         size={creditNoteTableSize}
         payload={{
           onViewDetails: handleViewDetailVendorCredit,

packages/webapp/src/containers/Purchases/CreditNotes/CreditNotesLanding/hooks/use-bulk-delete-vendor-credits-dialog.ts

@@ -0,0 +1,20 @@
+// @ts-nocheck
+import { DialogsName } from '@/constants/dialogs';
+import { useValidateBulkDeleteVendorCredits } from '@/hooks/query/vendorCredit';
+import { useBulkDeleteDialog } from '@/hooks/dialogs/useBulkDeleteDialog';
+
+export const useBulkDeleteVendorCreditsDialog = () => {
+  const validateBulkDeleteMutation = useValidateBulkDeleteVendorCredits();
+  const {
+    openBulkDeleteDialog,
+    closeBulkDeleteDialog,
+    isValidatingBulkDelete,
+  } = useBulkDeleteDialog(DialogsName.VendorCreditBulkDelete, validateBulkDeleteMutation);
+
+  return {
+    openBulkDeleteDialog,
+    closeBulkDeleteDialog,
+    isValidatingBulkDeleteVendorCredits: isValidatingBulkDelete,
+  };
+};
+

packages/webapp/src/containers/Purchases/CreditNotes/VendorCreditNotesAlerts.tsx

@@ -23,11 +23,6 @@ const ReconcileVendorCreditDeleteAlert = React.lazy(
     ),
 );
 
-const VendorCreditBulkDeleteAlert = React.lazy(
-  () =>
-    import('@/containers/Alerts/VendorCeditNotes/VendorCreditBulkDeleteAlert'),
-);
-
 /**
  * Vendor Credit notes alerts.
  */
@@ -48,8 +43,4 @@ export default [
     name: 'reconcile-vendor-delete',
     component: ReconcileVendorCreditDeleteAlert,
   },
-  {
-    name: 'vendor-credits-bulk-delete',
-    component: VendorCreditBulkDeleteAlert,
-  },
 ];