Merge pull request #269 from tnc-ca-geo/image-deletion-docs

feat: add links to documentation in delete images/camera alerts
tnc-ca-geo · Jan 8, 2025 · 12d31d7 · 12d31d7
2 parents c0b312e + 51d5372
commit 12d31d7
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 12 deletions.
diff --git a/src/features/cameras/DeleteCameraAlert.jsx b/src/features/cameras/DeleteCameraAlert.jsx
@@ -77,17 +77,29 @@ const DeleteCameraAlert = () => {
             </SpinnerOverlay>
           )}
           <AlertTitle>Delete Camera</AlertTitle>
-          {/*TODO: Add a link to the documentation for more information on how to delete images.*/}
           <div>
             <Callout type="warning">
               {imageCount > ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT ? (
-                <p>
-                  Due to the large number of images associated with this camera, we are unable to
-                  delete Camera <strong>{selectedCamera}</strong> 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.
-                </p>
+                <>
+                  <p>
+                    Due to the large number of images associated with this camera, we are unable to
+                    delete Camera <strong>{selectedCamera}</strong> at this time. Please ensure that
+                    the number of images associated with this camera does not exceed{' '}
+                    {ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT.toLocaleString()} before trying again.
+                  </p>
+                  <p>
+                    You can reduce the number images associated with this camera by using the{' '}
+                    <a
+                      href="https://docs.animl.camera/fundamentals/deleting-images#deleting-all-currently-filtered-images"
+                      target="_blank"
+                      rel="noopener noreferrer"
+                    >
+                      delete-images-by-filter
+                    </a>{' '}
+                    option to delete batches of images before fully deleting this Camera. We
+                    apologize for the inconvenience.
+                  </p>
+                </>
               ) : (
                 <div>
                   <p>
@@ -98,7 +110,7 @@ const DeleteCameraAlert = () => {
                         This will remove the Camera, its Deployments, and{' '}
                         {imageCount > 1 ? 'all' : 'the'}{' '}
                         <strong>
-                          {imageCount} image{imageCount > 1 && 's'}
+                          {imageCount.toLocaleString()} image{imageCount > 1 && 's'}
                         </strong>{' '}
                       </>
                     )}

diff --git a/src/features/images/DeleteImagesAlert.jsx b/src/features/images/DeleteImagesAlert.jsx
@@ -121,10 +121,17 @@ const DeleteImagesAlert = () => {
         {ASYNC_IMAGE_DELETE_BY_ID_LIMIT.toLocaleString()} image limit Animl supports when deleting
         individually-selected images.
       </p>
-      {/*TODO: Add a link to the documentation for more information on how to delete images.*/}
       <p>
-        Please select fewer images, or use the delete-by-filter option, which can accommodate
-        deleting up to {ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT.toLocaleString()} images at a time.
+        Please select fewer images, or use the{' '}
+        <a
+          href="https://docs.animl.camera/fundamentals/deleting-images#deleting-all-currently-filtered-images"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          delete-images-by-filter
+        </a>{' '}
+        option, which can accommodate deleting up to{' '}
+        {ASYNC_IMAGE_DELETE_BY_FILTER_LIMIT.toLocaleString()} images at a time.
       </p>
     </div>
   );