MOB-514 - locally update total observation count when deleting/adding observations; update obs count from remote only once when app loads

src/components/MyObservations/MyObservationsContainer.js

@@ -6,7 +6,7 @@ import { useFocusEffect, useRoute } from "@react-navigation/native";
 import { RealmContext } from "providers/contexts.ts";
 import type { Node } from "react";
 import React, {
-  useCallback,
+  useCallback, useEffect,
   useRef,
   useState
 } from "react";
@@ -28,7 +28,7 @@ import { isDebugMode } from "sharedHooks/useDebugMode";
 import {
   UPLOAD_PENDING
 } from "stores/createUploadObservationsSlice.ts";
-import useStore from "stores/useStore";
+import useStore, { zustandStorage } from "stores/useStore";
 
 import FullScreenActivityIndicator from "./FullScreenActivityIndicator";
 import useSyncObservations from "./hooks/useSyncObservations";
@@ -101,6 +101,16 @@ const MyObservationsContainer = ( ): Node => {
       user_id: currentUserId
     }
   } );
+  const myObsLoaded = useStore( state => state.myObsLoaded );
+  const setMyObsLoaded = useStore( state => state.setMyObsLoaded );
+
+  useEffect( () => {
+    if ( !myObsLoaded && totalResultsRemote ) {
+      // Only set observation count once when the app loads
+      zustandStorage.setItem( "numOfUserObservations", totalResultsRemote );
+      setMyObsLoaded( );
+    }
+  }, [myObsLoaded, totalResultsRemote, setMyObsLoaded] );
 
   const [showLoginSheet, setShowLoginSheet] = useState( false );
 

src/components/MyObservations/MyObservationsSimpleContainer.tsx

@@ -24,7 +24,6 @@ const MyObservationsSimpleContainer = ( {
   isFetchingNextPage,
   layout,
   listRef,
-  numTotalObservations,
   numUnuploadedObservations,
   observations,
   onEndReached,
@@ -93,14 +92,6 @@ const MyObservationsSimpleContainer = ( {
     ? numTotalTaxaRemote
     : numTotalTaxaLocal;
 
-  useEffect( ( ) => {
-    // persist this number in zustand so a user can see their latest observations count
-    // even if they're offline
-    if ( numTotalObservations > numOfUserObservations ) {
-      zustandStorage.setItem( "numOfUserObservations", numTotalObservations );
-    }
-  }, [numTotalObservations, numOfUserObservations] );
-
   useEffect( ( ) => {
     // persist this number in zustand so a user can see their latest species count
     // even if they're offline

src/components/ObsEdit/Sheets/DeleteObservationSheet.js

@@ -8,7 +8,7 @@ import type { Node } from "react";
 import React, { useCallback } from "react";
 import safeRealmWrite from "sharedHelpers/safeRealmWrite";
 import { useTranslation } from "sharedHooks";
-import useStore from "stores/useStore";
+import useStore, { zustandStorage } from "stores/useStore";
 
 const { useRealm } = RealmContext;
 
@@ -47,6 +47,10 @@ const DeleteObservationSheet = ( {
       onPressClose( );
       return;
     }
+    const numTotalObservations = zustandStorage.getItem( "numOfUserObservations" );
+    if ( numTotalObservations ) {
+      zustandStorage.setItem( "numOfUserObservations", numTotalObservations - 1 );
+    }
     if ( typeof ( onDelete ) === "function" ) {
       onDelete( );
     }

src/realmModels/Observation.js

@@ -4,6 +4,7 @@ import { getNowISO } from "sharedHelpers/dateAndTime.ts";
 import { log } from "sharedHelpers/logger";
 import { readExifFromMultiplePhotos } from "sharedHelpers/parseExif";
 import safeRealmWrite from "sharedHelpers/safeRealmWrite";
+import { zustandStorage } from "stores/useStore";
 import * as uuid from "uuid";
 
 import Application from "./Application";
@@ -293,6 +294,12 @@ class Observation extends Realm.Object {
       // also using modified for updating observations which were already saved locally
       realm.create( "Observation", obsToSave, "modified" );
     }, "saving local observation for upload in Observation" );
+
+    const numTotalObservations = zustandStorage.getItem( "numOfUserObservations" );
+    if ( numTotalObservations ) {
+      zustandStorage.setItem( "numOfUserObservations", numTotalObservations + 1 );
+    }
+
     return realm.objectForPrimaryKey( "Observation", obs.uuid );
   }
 

src/stores/createMyObsSlice.ts

@@ -4,8 +4,10 @@ const createMyObsSlice = ( set, get ) => ( {
   // when navigating to ObsEdit, so we lose scroll position)
   myObsOffset: 0,
   myObsOffsetToRestore: 0,
+  myObsLoaded: false,
   resetMyObsOffsetToRestore: ( ) => set( { myObsOffsetToRestore: 0 } ),
   setMyObsOffset: newOffset => set( { myObsOffset: newOffset } ),
+  setMyObsLoaded: ( ) => set( { myObsLoaded: true } ),
   setMyObsOffsetToRestore: ( ) => set( { myObsOffsetToRestore: get( ).myObsOffset } ),
   numOfUserObservations: 0,
   setNumOfUserObservations: newNum => set( { numOfUserObservations: newNum } ),