feat: bulk transcations delete

packages/webapp/src/containers/Accounts/AccountsActionsBar.tsx

@@ -182,6 +182,7 @@ function AccountsActionsBar({
             intent={Intent.DANGER}
             onClick={handleBulkDelete}
           />
+          <NavbarDivider />
         </If>
 
         <Button

packages/webapp/src/containers/Accounts/AccountsAlerts.tsx

@@ -10,9 +10,21 @@ const AccountInactivateAlert = React.lazy(
 const AccountActivateAlert = React.lazy(
   () => import('@/containers/Alerts/Accounts/AccountActivateAlert'),
 );
+const AccountBulkDeleteAlert = React.lazy(
+  () => import('@/containers/Alerts/Accounts/AccountBulkDeleteAlert'),
+);
+const AccountBulkActivateAlert = React.lazy(
+  () => import('@/containers/Alerts/Accounts/AccountBulkActivateAlert'),
+);
+const AccountBulkInactivateAlert = React.lazy(
+  () => import('@/containers/Alerts/Accounts/AccountBulkInactivateAlert'),
+);
 
 export default [
   { name: 'account-delete', component: AccountDeleteAlert },
   { name: 'account-inactivate', component: AccountInactivateAlert },
   { name: 'account-activate', component: AccountActivateAlert },
+  { name: 'accounts-bulk-delete', component: AccountBulkDeleteAlert },
+  { name: 'accounts-bulk-activate', component: AccountBulkActivateAlert },
+  { name: 'accounts-bulk-inactivate', component: AccountBulkInactivateAlert },
 ];

packages/webapp/src/containers/Accounts/AccountsDataTable.tsx

@@ -22,6 +22,7 @@ import withSettings from '@/containers/Settings/withSettings';
 import withAlertsActions from '@/containers/Alert/withAlertActions';
 import withDialogActions from '@/containers/Dialog/withDialogActions';
 import withDrawerActions from '@/containers/Drawer/withDrawerActions';
+import withAccountsTableActions from './withAccountsTableActions';
 import { compose } from '@/utils';
 import { DRAWERS } from '@/constants/drawers';
 
@@ -40,6 +41,9 @@ function AccountsDataTable({
 
   // #withSettings
   accountsTableSize,
+
+  // #withAccountsTableActions
+  setAccountsSelectedRows,
 }) {
   const { isAccountsLoading, isAccountsFetching, accounts } =
     useAccountsChartContext();
@@ -91,6 +95,12 @@ function AccountsDataTable({
   const [initialColumnsWidths, , handleColumnResizing] =
     useMemorizedColumnsWidths(TABLES.ACCOUNTS);
 
+  // Handle selected rows change.
+  const handleSelectedRowsChange = (selectedFlatRows) => {
+    const selectedIds = selectedFlatRows?.map((row) => row.original.id) || [];
+    setAccountsSelectedRows(selectedIds);
+  };
+
   return (
     <DataTable
       noInitialFetch={true}
@@ -118,6 +128,7 @@ function AccountsDataTable({
       vListrowHeight={accountsTableSize == 'small' ? 40 : 42}
       vListOverscanRowCount={0}
       onCellClick={handleCellClick}
+      onSelectedRowsChange={handleSelectedRowsChange}
       initialColumnsWidths={initialColumnsWidths}
       onColumnResizing={handleColumnResizing}
       size={accountsTableSize}
@@ -137,6 +148,7 @@ export default compose(
   withAlertsActions,
   withDrawerActions,
   withDialogActions,
+  withAccountsTableActions,
   withSettings(({ accountsSettings }) => ({
     accountsTableSize: accountsSettings.tableSize,
   })),

packages/webapp/src/containers/Accounts/withAccounts.tsx

@@ -13,6 +13,7 @@ export default (mapState) => {
     const mapped = {
       accountsTableState: getAccountsTableState(state, props),
       accountsTableStateChanged: accountsTableStateChanged(state, props),
+      accountsSelectedRows: state.accounts?.selectedRows || [],
     };
     return mapState ? mapState(mapped, state, props) : mapped;
   };

packages/webapp/src/containers/Accounts/withAccountsTableActions.tsx

@@ -3,11 +3,14 @@ import { connect } from 'react-redux';
 import {
   setAccountsTableState,
   resetAccountsTableState,
+  setAccountsSelectedRows,
 } from '@/store/accounts/accounts.actions';
 
 const mapActionsToProps = (dispatch) => ({
   setAccountsTableState: (queries) => dispatch(setAccountsTableState(queries)),
   resetAccountsTableState: () => dispatch(resetAccountsTableState()),
+  setAccountsSelectedRows: (selectedRows) =>
+    dispatch(setAccountsSelectedRows(selectedRows)),
 });
 
 export default connect(null, mapActionsToProps);