adding error handling and 200k limit text

tnc-ca-geo · Dec 11, 2024 · 839bdd8 · 839bdd8
1 parent 811b97d
commit 839bdd8
Show file tree

Hide file tree

Showing 6 changed files with 61 additions and 25 deletions.
diff --git a/src/components/ErrorToast.jsx b/src/components/ErrorToast.jsx
@@ -23,7 +23,7 @@ import {
   selectManageLabelsErrors,
   dismissManageLabelsError,
   selectProjectTagErrors,
-  dismissProjectTagErrors
+  dismissProjectTagErrors,
 } from '../features/projects/projectsSlice';
 import {
   selectWirelessCamerasErrors,
@@ -46,6 +46,8 @@ import {
   dismissDeploymentsError,
   selectCameraSerialNumberErrors,
   dismissCameraSerialNumberError,
+  selectDeleteCameraErrors,
+  dismissDeleteCameraError,
   selectDeleteImagesErrors,
   dismissDeleteImagesError,
 } from '../features/tasks/tasksSlice';
@@ -81,6 +83,7 @@ const ErrorToast = () => {
   const manageLabelsErrors = useSelector(selectManageLabelsErrors);
   const uploadErrors = useSelector(selectUploadErrors);
   const cameraSerialNumberErrors = useSelector(selectCameraSerialNumberErrors);
+  const deleteCameraErrors = useSelector(selectDeleteCameraErrors);
   const projectTagErrors = useSelector(selectProjectTagErrors);
   const deleteImagesErrors = useSelector(selectDeleteImagesErrors);
 
@@ -109,6 +112,7 @@ const ErrorToast = () => {
       'Error Updating Camera Serial Number',
       'cameraSerialNumber',
     ),
+    enrichErrors(deleteCameraErrors, 'Error Deleting Camera', 'deleteCamera'),
     enrichErrors(deleteImagesErrors, 'Error Deleting Images', 'deleteImages'),
   ];
 
@@ -175,6 +179,7 @@ const dismissErrorActions = {
   manageLabels: (i) => dismissManageLabelsError(i),
   upload: (i) => dismissUploadError(i),
   cameraSerialNumber: (i) => dismissCameraSerialNumberError(i),
+  deleteCamera: (i) => dismissDeleteCameraError(i),
   deleteImagesError: (i) => dismissDeleteImagesError(i),
 };
 

diff --git a/src/components/HydratedModal.jsx b/src/components/HydratedModal.jsx
@@ -24,6 +24,7 @@ import {
   selectCameraSerialNumberLoading,
   clearCameraSerialNumberTask,
   selectDeleteImagesLoading,
+  clearDeleteCameraTask,
 } from '../features/tasks/tasksSlice.js';
 import {
   selectModalOpen,
@@ -130,6 +131,7 @@ const HydratedModal = () => {
       content: <DeleteCameraForm />,
       callBackOnClose: () => {
         dispatch(setSelectedCamera(null));
+        dispatch(clearDeleteCameraTask());
       },
     },
     'manage-tags-and-labels-form': {

diff --git a/src/config.js b/src/config.js
@@ -17,7 +17,7 @@ export const API_URL = API_URLS[stage];
 export const IMAGES_URL = IMAGES_URLS[stage];
 export const IMAGE_QUERY_LIMITS = [10, 50, 100];
 export const SYNC_IMAGE_DELETE_LIMIT = 300; // when deleting w/o using task handler
-export const ASYNC_IMAGE_DELETE_BY_ID_LIMIT = 4000; // when deleting using task handler (by _id). Constrained by POST request size limits
+export const ASYNC_IMAGE_DELETE_BY_ID_LIMIT = 3000; // when deleting using task handler (by _id). Constrained by POST request size limits
 export const ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT = 200000; // when deleting using task handler (by filter). Constrained by task Lambda timeout
 
 export const SUPPORTED_WIRELESS_CAMS = ['BuckEyeCam', 'RidgeTec', 'CUDDEBACK', 'RECONYX'];

diff --git a/src/features/cameras/DeleteCameraForm.jsx b/src/features/cameras/DeleteCameraForm.jsx
@@ -13,6 +13,7 @@ import {
   selectCameraImageCount,
   selectCameraImageCountLoading,
 } from '../cameras/wirelessCamerasSlice.js';
+import { ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT } from '../../config.js';
 
 const BoldText = styled('span', {
   fontWeight: '$5',
@@ -70,26 +71,44 @@ const DeleteCameraForm = ({ handleClose }) => {
             handleDeleteCameraSubmit(values);
           }}
         >
-          {() => (
-            <Form>
-              <HelperText>
-                Are you sure you&apos;d like to delete Camera <BoldText>{selectedCamera}</BoldText>?
-                This will remove the camera from the project, remove all deployments associated with
-                it, and <BoldText>{imagesText}</BoldText> will be deleted.{' '}
-                <BoldText>This action cannot be undone.</BoldText>
-              </HelperText>
-              <Field name="cameraId" type="hidden" />
-              <Field name="deploymentId" type="hidden" />
-              <ButtonRow>
-                <Button type="button" size="large" onClick={handleClose}>
-                  Cancel
-                </Button>
-                <Button type="submit" size="large">
-                  Delete Camera
-                </Button>
-              </ButtonRow>
-            </Form>
-          )}
+          {() =>
+            imageCount > ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT ? (
+              <Form>
+                <HelperText>
+                  Due to the large number of images associated with this camera, we are unable to
+                  delete Camera <BoldText>{selectedCamera}</BoldText> at this time. Please ensure
+                  that the number of images associated with this camera do not exceed{' '}
+                  {ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT} before trying again. We apologize for the
+                  inconvenience.
+                </HelperText>
+                <ButtonRow>
+                  <Button type="button" size="large" onClick={handleClose}>
+                    Cancel
+                  </Button>
+                </ButtonRow>
+              </Form>
+            ) : (
+              <Form>
+                <HelperText>
+                  Are you sure you&apos;d like to delete Camera{' '}
+                  <BoldText>{selectedCamera}</BoldText>? This will remove the camera from the
+                  project, remove all deployments associated with it, and{' '}
+                  <BoldText>{imagesText}</BoldText> will be deleted.{' '}
+                  <BoldText>This action cannot be undone.</BoldText>
+                </HelperText>
+                <Field name="cameraId" type="hidden" />
+                <Field name="deploymentId" type="hidden" />
+                <ButtonRow>
+                  <Button type="button" size="large" onClick={handleClose}>
+                    Cancel
+                  </Button>
+                  <Button type="submit" size="large">
+                    Delete Camera
+                  </Button>
+                </ButtonRow>
+              </Form>
+            )
+          }
         </Formik>
       </FormWrapper>
     </div>

diff --git a/src/features/images/DeleteImagesAlert.jsx b/src/features/images/DeleteImagesAlert.jsx
@@ -20,7 +20,12 @@ import {
 } from '../../components/AlertDialog.jsx';
 import Button from '../../components/Button.jsx';
 import { red, green } from '@radix-ui/colors';
-import { deleteImagesTask, fetchTask, selectDeleteImagesLoading } from '../tasks/tasksSlice.js';
+import {
+  clearDeleteImagesTask,
+  deleteImagesTask,
+  fetchTask,
+  selectDeleteImagesLoading,
+} from '../tasks/tasksSlice.js';
 import {
   SYNC_IMAGE_DELETE_LIMIT,
   ASYNC_IMAGE_DELETE_BY_ID_LIMIT,
@@ -91,7 +96,10 @@ const DeleteImagesAlert = () => {
         dispatch(deleteImages(selectedImageIds));
       }
     }
-    if (selectedImages.length > 3000 || imageCount > 3000) {
+    if (
+      selectedImages.length > ASYNC_IMAGE_DELETE_BY_ID_LIMIT ||
+      imageCount > ASYNC_IMAGE_DELETE_BY_ID_LIMIT
+    ) {
       // show progress bar if deleting more than 3000 images (approx wait time will be > 10 seconds)
       const count = !alertState.deleteImagesAlertByFilter ? selectedImages.length : imageCount;
       setEstimatedTotalTime(count * 0.0055); // estimated deletion time per image in seconds
@@ -118,6 +126,7 @@ const DeleteImagesAlert = () => {
 
   const handleCancelDelete = () => {
     dispatch(setDeleteImagesAlertStatus({ openStatus: false }));
+    dispatch(clearDeleteImagesTask());
   };
 
   const deleteByIdLimitExceeded =

diff --git a/src/features/tasks/tasksSlice.js b/src/features/tasks/tasksSlice.js
@@ -659,7 +659,7 @@ export const deleteCamera = (payload) => {
         dispatch(updateDeleteCameraUpdate({ taskId: res.deleteCameraConfig._id }));
       }
     } catch (err) {
-      console.log('error attempting to delete camera: ', err);
+      dispatch(updateDeleteCameraFailure(err));
     }
   };
 };
@@ -719,6 +719,7 @@ export const selectCameraSerialNumberLoading = (state) =>
 export const selectCameraSerialNumberErrors = (state) =>
   state.tasks.loadingStates.cameraSerialNumber.errors;
 export const selectDeleteCameraLoading = (state) => state.tasks.loadingStates.deleteCamera;
+export const selectDeleteCameraErrors = (state) => state.tasks.loadingStates.deleteCamera.errors;
 export const selectDeleteImagesLoading = (state) => state.tasks.loadingStates.deleteImages;
 export const selectDeleteImagesErrors = (state) => state.tasks.loadingStates.deleteImages.errors;