Merge pull request #84 from kfnawaz/feat/WMS-67

Feat/wms 67 - delete-confirmations-toasts

src/components/NestedTable/index.js

@@ -1,10 +1,12 @@
 /* eslint-disable indent */
 import {
   Box,
+  Button,
   // Chip,
   Dialog,
   DialogActions,
   DialogContent,
+  DialogContentText,
   DialogTitle,
   Grid,
   MenuItem,
@@ -64,6 +66,14 @@ function NestedDataTable({ data, selected, setSelected, populateChildren }) {
     populateChildren(data.id, data.location);
   }, []);
 
+  const [deleteAlertOpen, setDeleteAlertOpen] = React.useState(null);
+  const handleDeleteAlertClose = () => {
+    setDeleteAlertOpen(false);
+  };
+  const handleDeleteAlertOpen = () => {
+    setDeleteAlertOpen(true);
+  };
+
   return (
     <>
       <Box
@@ -154,18 +164,44 @@ function NestedDataTable({ data, selected, setSelected, populateChildren }) {
                   padding: '0 6'
                 }}
                 onClick={() => {
-                  dispatch(
-                    WarehouseLocationsActions.deleteLocationRequest({
-                      loader: 'location-request',
-                      slug: API.LOCATION_DELETE,
-                      method: 'post',
-                      data: { type: data.location, id: data.id }
-                    })
-                  );
+                  handleDeleteAlertOpen();
                 }}
               >
                 DELETE
               </MDButton>
+              <Dialog
+                open={deleteAlertOpen}
+                aria-labelledby="alert-dialog-title"
+                aria-describedby="alert-dialog-description"
+                onClose={handleDeleteAlertClose}
+              >
+                <DialogTitle id="alert-dialog-title">Confirm Delete</DialogTitle>
+                <DialogContent>
+                  <DialogContentText id="alert-dialog-description">
+                    Are you sure you want to delete this?
+                  </DialogContentText>
+                </DialogContent>
+                <DialogActions>
+                  <Button autoFocus onClick={handleDeleteAlertClose}>
+                    No
+                  </Button>
+                  <Button
+                    onClick={() => {
+                      dispatch(
+                        WarehouseLocationsActions.deleteLocationRequest({
+                          loader: 'location-request',
+                          slug: API.LOCATION_DELETE,
+                          method: 'post',
+                          data: { type: data.location, id: data.id }
+                        })
+                      );
+                      handleDeleteAlertClose();
+                    }}
+                  >
+                    Yes
+                  </Button>
+                </DialogActions>
+              </Dialog>
             </Grid>
           </Grid>
         </Grid>

src/components/WidgetNestedDataTable/index.js

@@ -1,9 +1,11 @@
 /* eslint-disable indent */
 import {
   Box,
+  Button,
   Dialog,
   DialogActions,
   DialogContent,
+  DialogContentText,
   DialogTitle,
   Grid,
   TextField
@@ -116,6 +118,14 @@ function WidgetNestedDataTable({
   const dispatch = useDispatch();
   const widgetChildren = useSelector(WidgetSelectors.getWidgetsByParentId(data._id));
 
+  const [deleteAlertOpen, setDeleteAlertOpen] = React.useState(null);
+  const handleDeleteAlertClose = () => {
+    setDeleteAlertOpen(false);
+  };
+  const handleDeleteAlertOpen = () => {
+    setDeleteAlertOpen(true);
+  };
+
   return (
     <>
       <Box
@@ -193,19 +203,45 @@ function WidgetNestedDataTable({
               }}
               onClick={() => {
                 setSelected(null);
-                dispatch(
-                  WidgetActions.editWidgetRequest({
-                    loader: 'location-request',
-                    slug: `${API.EDIT_WIDGET_FAMILY}${data._id}`,
-                    deletedId: data._id,
-                    method: 'delete',
-                    type: 'delete'
-                  })
-                );
+                handleDeleteAlertOpen();
               }}
             >
               DELETE
             </MDButton>
+            <Dialog
+              open={deleteAlertOpen}
+              aria-labelledby="alert-dialog-title"
+              aria-describedby="alert-dialog-description"
+              onClose={handleDeleteAlertClose}
+            >
+              <DialogTitle id="alert-dialog-title">Confirm Delete</DialogTitle>
+              <DialogContent>
+                <DialogContentText id="alert-dialog-description">
+                  Are you sure you want to delete this?
+                </DialogContentText>
+              </DialogContent>
+              <DialogActions>
+                <Button autoFocus onClick={handleDeleteAlertClose}>
+                  No
+                </Button>
+                <Button
+                  onClick={() => {
+                    dispatch(
+                      WidgetActions.editWidgetRequest({
+                        loader: 'location-request',
+                        slug: `${API.EDIT_WIDGET_FAMILY}${data._id}`,
+                        deletedId: data._id,
+                        method: 'delete',
+                        type: 'delete'
+                      })
+                    );
+                    handleDeleteAlertClose();
+                  }}
+                >
+                  Yes
+                </Button>
+              </DialogActions>
+            </Dialog>
           </Grid>
         </Grid>
         {open && widgetChildren ? (

src/sagas/WarehouseLocations.js

@@ -1,4 +1,5 @@
 import { AuthorizedAPI } from 'config';
+import { toast } from 'react-toastify';
 import { call, put, takeEvery } from 'redux-saga/effects';
 import WarehouseLocationsActions from 'redux/WarehouseLocationsRedux';
 import { WarehouseLocationsTypes } from 'redux/WarehouseLocationsRedux';
@@ -42,6 +43,9 @@ export function* onAddRequestLocation({ payload }) {
   );
   LOGGER.log('add response', response.data);
   if (response?.status === 200) {
+    toast.success('Location created successfully', {
+      theme: 'colored'
+    });
     yield put(
       WarehouseLocationsActions.locationSuccess({
         loader: payload?.loader,
@@ -52,7 +56,9 @@ export function* onAddRequestLocation({ payload }) {
       })
     );
   } else {
-    payload.onFailedLocation(response.data.error);
+    toast.error('Failed to create warehouse location', {
+      theme: 'colored'
+    });
     yield put(
       WarehouseLocationsActions.locationFailure({
         loader: payload?.loader,
@@ -71,6 +77,9 @@ export function* onDeleteRequestLocation({ payload }) {
   );
   LOGGER.log('delete response', response.data);
   if (response?.status === 200) {
+    toast.success('Location deleted successfully', {
+      theme: 'colored'
+    });
     yield put(
       WarehouseLocationsActions.locationSuccess({
         loader: payload?.loader,
@@ -78,7 +87,9 @@ export function* onDeleteRequestLocation({ payload }) {
       })
     );
   } else {
-    payload.onFailedLocation(response.data.error);
+    toast.error('Failed to delete warehouse location', {
+      theme: 'colored'
+    });
     yield put(
       WarehouseLocationsActions.locationFailure({
         loader: payload?.loader,
@@ -97,6 +108,9 @@ export function* onEditRequestLocation({ payload }) {
   );
   LOGGER.log('edit response', response.data);
   if (response?.status === 200) {
+    toast.success('Location edited successfully', {
+      theme: 'colored'
+    });
     yield put(
       WarehouseLocationsActions.locationSuccess({
         loader: payload?.loader,
@@ -108,7 +122,9 @@ export function* onEditRequestLocation({ payload }) {
       })
     );
   } else {
-    payload.onFailedLocation(response.data.error);
+    toast.error('Failed to edit warehouse location', {
+      theme: 'colored'
+    });
     yield put(
       WarehouseLocationsActions.locationFailure({
         loader: payload?.loader,

src/sagas/Widget.js

@@ -1,4 +1,5 @@
 import { AuthorizedAPI } from 'config';
+import { toast } from 'react-toastify';
 import { call, put, takeEvery } from 'redux-saga/effects';
 import ApiServices from 'services/API/ApiServices';
 import WidgetActions, { WidgetTypes } from '../redux/WidgetRedux';
@@ -35,6 +36,12 @@ export function* onEditRequestWidget({ payload }) {
     payload?.data
   );
   if (response?.status === 200) {
+    toast.success(
+      `Successfully ${payload?.type !== 'delete' ? payload?.type : 'delet'}ed widget family`,
+      {
+        theme: 'colored'
+      }
+    );
     yield put(
       WidgetActions.editWidgetSuccess({
         loader: payload?.loader,
@@ -44,6 +51,12 @@ export function* onEditRequestWidget({ payload }) {
       })
     );
   } else {
+    toast.error(
+      payload?.type ? `Failed to ${payload?.type} widget family` : 'Failed to fulfill request',
+      {
+        theme: 'colored'
+      }
+    );
     yield put(
       WidgetActions.widgetFailure({
         loader: payload?.loader,