Reset toolbar success state after five seconds (#1290)

* Add timeout that resets upload state after 5s * Add timeout that resets deletions state after 5s * Only reset state on no error state
inaturalist · Mar 19, 2024 · 836c01d · 836c01d
1 parent 63a6369
commit 836c01d
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 9 deletions.
diff --git a/src/components/MyObservations/MyObservationsContainer.js b/src/components/MyObservations/MyObservationsContainer.js
@@ -163,13 +163,26 @@ const MyObservationsContainer = ( ): Node => {
   } );
 
   const {
+    error,
     uploads,
     uploadsComplete,
     uploadProgress,
     uploadInProgress,
     totalProgressIncrements
   } = state;
 
+  useEffect( () => {
+    let timer;
+    if ( uploadsComplete && !error ) {
+      timer = setTimeout( () => {
+        dispatch( { type: "RESET_STATE" } );
+      }, 5000 );
+    }
+    return () => {
+      clearTimeout( timer );
+    };
+  }, [uploadsComplete, error] );
+
   const currentUploadProgress = Object.values( uploadProgress ).reduce(
     ( count, current ) => count + Number( current ),
     0
@@ -285,11 +298,11 @@ const MyObservationsContainer = ( ): Node => {
       let { message } = uploadError;
       if ( uploadError?.json?.errors ) {
         // TODO localize comma join
-        message = uploadError.json.errors.map( error => {
-          if ( error.message?.errors ) {
-            return error.message.errors.flat( ).join( ", " );
+        message = uploadError.json.errors.map( e => {
+          if ( e.message?.errors ) {
+            return e.message.errors.flat( ).join( ", " );
           }
-          return error.message;
+          return e.message;
         } ).join( ", " );
       } else if ( uploadError.message.match( /Network request failed/ ) ) {
         message = "Connection problem. Please try again later.";

diff --git a/src/components/MyObservations/hooks/useDeleteObservations.js b/src/components/MyObservations/hooks/useDeleteObservations.js
@@ -67,7 +67,8 @@ const useDeleteObservations = ( ): Object => {
     currentDeleteCount,
     deletions,
     deletionsInProgress,
-    deletionsComplete
+    deletionsComplete,
+    error
   } = state;
 
   const observationToDelete = deletions[currentDeleteCount - 1];
@@ -121,11 +122,11 @@ const useDeleteObservations = ( ): Object => {
       let { message } = deleteError;
       if ( deleteError?.json?.errors ) {
         // TODO localize comma join
-        message = deleteError.json.errors.map( error => {
-          if ( error.message?.errors ) {
-            return error.message.errors.flat( ).join( ", " );
+        message = deleteError.json.errors.map( e => {
+          if ( e.message?.errors ) {
+            return e.message.errors.flat( ).join( ", " );
           }
-          return error.message;
+          return e.message;
         } ).join( ", " );
       } else {
         throw deleteError;
@@ -171,6 +172,18 @@ const useDeleteObservations = ( ): Object => {
     [navigation]
   );
 
+  useEffect( () => {
+    let timer;
+    if ( deletionsComplete && !error ) {
+      timer = setTimeout( () => {
+        dispatch( { type: "RESET_STATE" } );
+      }, 5000 );
+    }
+    return () => {
+      clearTimeout( timer );
+    };
+  }, [deletionsComplete, error] );
+
   return state;
 };