fix: inventory adjustment alert.

client/src/containers/Alerts/Item/InventoryAdjustmentDeleteAlert.js

@@ -0,0 +1,81 @@
+import React from 'react';
+import {
+  FormattedMessage as T,
+  FormattedHTMLMessage,
+  useIntl,
+} from 'react-intl';
+import { Intent, Alert } from '@blueprintjs/core';
+import { queryCache } from 'react-query';
+import { AppToaster } from 'components';
+
+import withAlertStoreConnect from 'containers/Alert/withAlertStoreConnect';
+import withAlertActions from 'containers/Alert/withAlertActions';
+import withInventoryAdjustmentActions from 'containers/Items/withInventoryAdjustmentActions';
+
+import { compose } from 'utils';
+
+/**
+ * Inventory Adjustment delete alerts.
+ */
+function InventoryAdjustmentDeleteAlert({
+  name,
+
+  // #withAlertStoreConnect
+  isOpen,
+  payload: { inventoryId },
+  // #withInventoryAdjustmentActions
+  requestDeleteInventoryAdjustment,
+
+  // #withAlertActions
+  closeAlert,
+}) {
+  const { formatMessage } = useIntl();
+
+  // handle cancel delete  alert.
+  const handleCancelInventoryAdjustmentDelete = () => {
+    closeAlert(name);
+  };
+
+  const handleConfirmInventoryAdjustmentDelete = () => {
+    requestDeleteInventoryAdjustment(inventoryId)
+      .then(() => {
+        closeAlert(name);
+        AppToaster.show({
+          message: formatMessage({
+            id: 'the_adjustment_has_been_deleted_successfully',
+          }),
+          intent: Intent.SUCCESS,
+        });
+        queryCache.invalidateQueries('inventory-adjustment-list');
+      })
+      .catch((errors) => {
+        closeAlert(name);
+      });
+  };
+
+  return (
+    <Alert
+      cancelButtonText={<T id={'cancel'} />}
+      confirmButtonText={<T id={'delete'} />}
+      icon="trash"
+      intent={Intent.DANGER}
+      isOpen={isOpen}
+      onCancel={handleCancelInventoryAdjustmentDelete}
+      onConfirm={handleConfirmInventoryAdjustmentDelete}
+    >
+      <p>
+        <FormattedHTMLMessage
+          id={
+            'once_delete_this_inventory_a_adjustment_you_will_able_to_restore_it'
+          }
+        />
+      </p>
+    </Alert>
+  );
+}
+
+export default compose(
+  withAlertStoreConnect(),
+  withAlertActions,
+  withInventoryAdjustmentActions,
+)(InventoryAdjustmentDeleteAlert);

client/src/containers/Items/InventoryAdjustmentDataTable.js

@@ -175,22 +175,15 @@ function InventoryAdjustmentDataTable({
     },
     [addInventoryAdjustmentTableQueries],
   );
-  
-
+ 
   const handleSelectedRowsChange = useCallback(
     (selectedRows) => {
-      saveInvoke(
-        onSelectedRowsChange,
-        selectedRows.map((s) => s.original),
-      );
+      onSelectedRowsChange &&
+        onSelectedRowsChange(selectedRows.map((s) => s.original));
     },
     [onSelectedRowsChange],
   );
 
-  // const showEmptyStatus = [
-
-  // ].every((condition) => condition === true);
-
   return (
     <div className={classNames(CLASSES.DASHBOARD_DATATABLE)}>
       <LoadingIndicator loading={inventoryAdjustmentLoading && !isLoadedBefore}>

client/src/containers/Items/InventoryAdjustmentList.js

@@ -1,19 +1,20 @@
-import React, { useEffect, useState, useCallback, useMemo } from 'react';
+import React, { useEffect, useState, useCallback } from 'react';
 import { useQuery } from 'react-query';
-import { Alert, Intent } from '@blueprintjs/core';
+import { Route, Switch } from 'react-router-dom';
 import { FormattedMessage as T, useIntl } from 'react-intl';
 
-import AppToaster from 'components/AppToaster';
 import DashboardPageContent from 'components/Dashboard/DashboardPageContent';
 import DashboardInsider from 'components/Dashboard/DashboardInsider';
 
+import ItemsAlerts from './ItemsAlerts';
 import InventoryAdjustmentDataTable from './InventoryAdjustmentDataTable';
+
 import withInventoryAdjustmentActions from './withInventoryAdjustmentActions';
 import withInventoryAdjustments from './withInventoryAdjustments';
 import withDashboardActions from 'containers/Dashboard/withDashboardActions';
+import withAlertsActions from 'containers/Alert/withAlertActions';
 
 import { compose } from 'utils';
-import { Route, Switch } from 'react-router-dom';
 
 /**
  * Inventory Adjustment List.
@@ -25,69 +26,33 @@ function InventoryAdjustmentList({
   // #withInventoryAdjustments
   inventoryAdjustmentTableQuery,
 
+  // #withAlertsActions.
+  openAlert,
+
   // #withInventoryAdjustmentsActions
   requestFetchInventoryAdjustmentTable,
-  requestDeleteInventoryAdjustment,
+  setSelectedRowsInventoryAdjustments,
 }) {
   const { formatMessage } = useIntl();
-  const [selectedRows, setSelectedRows] = useState([]);
-  const [deleteInventoryAdjustment, setDeleteInventoryAdjustment] = useState(
-    false,
-  );
 
   useEffect(() => {
     changePageTitle(formatMessage({ id: 'inventory_adjustment_list' }));
   }, [changePageTitle, formatMessage]);
 
   const fetchInventoryAdjustments = useQuery(
-    ['inventory-adjustment-list' ,inventoryAdjustmentTableQuery],
+    ['inventory-adjustment-list', inventoryAdjustmentTableQuery],
     (key, query) => requestFetchInventoryAdjustmentTable({ ...query }),
   );
 
   // Handle selected rows change.
-  const handleSelectedRowsChange = useCallback(
-    (inventory) => {
-      setSelectedRows(inventory);
-    },
-    [setSelectedRows],
-  );
-
-  const handleDeleteInventoryAdjustment = useCallback(
-    (adjustment) => {
-      setDeleteInventoryAdjustment(adjustment);
-    },
-    [setDeleteInventoryAdjustment],
-  );
-
-  const handleCancelInventoryAdjustmentDelete = useCallback(() => {
-    setDeleteInventoryAdjustment(false);
-  }, [setDeleteInventoryAdjustment]);
-
-  const handleConfirmInventoryAdjustmentDelete = useCallback(() => {
-    requestDeleteInventoryAdjustment(deleteInventoryAdjustment.id)
-      .then(() => {
-        setDeleteInventoryAdjustment(false);
-        AppToaster.show({
-          message: formatMessage({
-            id: 'the_adjustment_has_been_deleted_successfully',
-          }),
-          intent: Intent.SUCCESS,
-        });
-      })
-      .catch((errors) => {
-        setDeleteInventoryAdjustment(false);
-      });
-  }, [
-    deleteInventoryAdjustment,
-    requestDeleteInventoryAdjustment,
-    formatMessage,
-  ]);
-
-  // Calculates the data table selected rows count.
-  const selectedRowsCount = useMemo(() => Object.values(selectedRows).length, [
-    selectedRows,
-  ]);
+  const handleSelectedRowsChange = (selectedRows) => {
+    const selectedRowsIds = selectedRows.map((r) => r.id);
+    setSelectedRowsInventoryAdjustments(selectedRowsIds);
+  };
 
+  const handleDeleteInventoryAdjustment = ({ id }) => {
+    openAlert('inventory-adjustment-delete', { inventoryId: id });
+  };
   return (
     <DashboardInsider name={'inventory_adjustments'}>
       <DashboardPageContent>
@@ -95,27 +60,10 @@ function InventoryAdjustmentList({
           <Route exact={true}>
             <InventoryAdjustmentDataTable
               onDeleteInventoryAdjustment={handleDeleteInventoryAdjustment}
-              onSelectedRowsChange={handleSelectedRowsChange}
             />
           </Route>
         </Switch>
-        <Alert
-          cancelButtonText={<T id={'cancel'} />}
-          confirmButtonText={<T id={'delete'} />}
-          icon={'trash'}
-          intent={Intent.DANGER}
-          isOpen={deleteInventoryAdjustment}
-          onCancel={handleCancelInventoryAdjustmentDelete}
-          onConfirm={handleConfirmInventoryAdjustmentDelete}
-        >
-          <p>
-            <T
-              id={
-                'once_delete_this_inventory_a_adjustment_you_will_able_to_restore_it'
-              }
-            />
-          </p>
-        </Alert>
+        <ItemsAlerts />
       </DashboardPageContent>
     </DashboardInsider>
   );
@@ -127,4 +75,5 @@ export default compose(
   withInventoryAdjustments(({ inventoryAdjustmentTableQuery }) => ({
     inventoryAdjustmentTableQuery,
   })),
+  withAlertsActions,
 )(InventoryAdjustmentList);

client/src/containers/Items/ItemsAlerts.js

@@ -5,6 +5,7 @@ import ItemActivateAlert from 'containers/Alerts/Item/ItemActivateAlert';
 import ItemBulkDeleteAlert from 'containers/Alerts/Item/ItemBulkDeleteAlert';
 import ItemCategoryDeleteAlert from 'containers/Alerts/Item/ItemCategoryDeleteAlert';
 import ItemCategoryBulkDeleteAlert from 'containers/Alerts/Item/ItemCategoryBulkDeleteAlert';
+import InventoryAdjustmentDeleteAlert from 'containers/Alerts/Item/InventoryAdjustmentDeleteAlert';
 
 /**
  * Items alert.
@@ -18,6 +19,7 @@ export default function ItemsAlerts() {
       <ItemBulkDeleteAlert name={'items-bulk-delete'} />
       <ItemCategoryDeleteAlert name={'item-category-delete'} />
       <ItemCategoryBulkDeleteAlert name={'item-categories-bulk-delete'} />
+      <InventoryAdjustmentDeleteAlert name={'inventory-adjustment-delete'} />
     </div>
   );
 }

client/src/containers/Items/withInventoryAdjustments.js

@@ -27,6 +27,7 @@ export default (mapState) => {
         query,
       ),
       inventoryAdjustmentLoading: state.inventoryAdjustments.loading,
+      inventoryAdjustmentsSelectedRows: state.inventoryAdjustments.selectedRows,
     };
     return mapState ? mapState(mapped, state, props) : mapped;
   };

client/src/store/inventoryAdjustments/inventoryAdjustment.reducer.js

@@ -14,6 +14,7 @@ const initialState = {
     page_size: 12,
     page: 1,
   },
+  selectedRows: [],
 };
 
 export default createReducer(initialState, {
@@ -62,6 +63,10 @@ export default createReducer(initialState, {
   [t.INVENTORY_ADJUSTMENTS_SET_CURRENT_VIEW]: (state, action) => {
     state.currentViewId = action.currentViewId;
   },
+  [t.INVENTORY_ADJUSTMENTS_SELECTED_ROW_SET]: (state, action) => {
+    const { selectedRows } = action.payload;
+    state.selectedRows = selectedRows;
+  },
 
   ...viewPaginationSetReducer(t.INVENTORY_ADJUSTMENTS_PAGINATION_SET),
   ...createTableQueryReducers('INVENTORY_ADJUSTMENTS'),

client/src/store/inventoryAdjustments/inventoryAdjustment.type.js

@@ -6,9 +6,10 @@ export default {
 
   INVENTORY_ADJUSTMENTS_PAGINATION_SET: 'INVENTORY_ADJUSTMENTS_PAGINATION_SET',
 
-
   INVENTORY_ADJUSTMENTS_TABLE_QUERIES_ADD:
     'INVENTORY_ADJUSTMENTS/TABLE_QUERIES_ADD',
   INVENTORY_ADJUSTMENTS_SET_CURRENT_VIEW:
     'INVENTORY_ADJUSTMENTS_SET_CURRENT_VIEW',
+  INVENTORY_ADJUSTMENTS_SELECTED_ROW_SET:
+    'INVENTORY_ADJUSTMENTS_SELECTED_ROW_SET',
 };