Bugfixes: signed out ObsDetails crash; unique key warning on TaxonDetails

src/components/ErrorBoundary.js

@@ -43,7 +43,7 @@ class ErrorBoundary extends React.Component {
       // boundaries can customize their error states
       return (
         <SafeAreaView className="flex-1">
-          <ScrollView className="p-5">
+          <ScrollView className="p-5 bg-white">
             <Heading1 className="my-3">{ t( "Something-went-wrong" ) }</Heading1>
             <Body1>
               { t( "If-youre-seeing-this-error" ) }

src/components/ObsDetails/ObsDetails.js

@@ -225,7 +225,7 @@ const ObsDetails = ( {
           )}
         </View>
       </ScrollView>
-      {showActivityTab && (
+      {showActivityTab && currentUser && (
         <FloatingButtons
           navToSuggestions={navToSuggestions}
           openCommentBox={openCommentBox}

src/components/ObsDetails/ObsDetailsContainer.js

@@ -175,16 +175,20 @@ const ObsDetailsContainer = ( ): Node => {
     || ( !observation?.user && !observation?.id )
   );
 
-  const invalidateRemoteObservation = useCallback( ( ) => {
-    queryClient.invalidateQueries( { queryKey: [fetchRemoteObservationKey, observation.uuid] } );
-  }, [queryClient, observation.uuid] );
+  const invalidateRemoteObservationFetch = useCallback( ( ) => {
+    if ( observation?.uuid ) {
+      queryClient.invalidateQueries( {
+        queryKey: [fetchRemoteObservationKey, observation.uuid]
+      } );
+    }
+  }, [queryClient, observation?.uuid] );
 
   useFocusEffect(
     // this ensures activity items load after a user taps suggest id
     // and adds a remote id on the Suggestions screen
     useCallback( ( ) => {
-      invalidateRemoteObservation( );
-    }, [invalidateRemoteObservation] )
+      invalidateRemoteObservationFetch( );
+    }, [invalidateRemoteObservationFetch] )
   );
 
   useEffect( ( ) => {
@@ -346,7 +350,7 @@ const ObsDetailsContainer = ( ): Node => {
   const showActivityTab = currentTabId === ACTIVITY_TAB_ID;
 
   const invalidateQueryAndRefetch = ( ) => {
-    invalidateRemoteObservation( );
+    invalidateRemoteObservationFetch( );
     refetchRemoteObservation( );
     refetchObservationUpdates( );
   };

src/components/TaxonDetails/Taxonomy.js

@@ -168,8 +168,20 @@ const Taxonomy = ( { taxon: currentTaxon, hideNavButtons }: Props ): Node => {
           <Text>
             {
               scientificNameFirst
-                ? [sciNameComponent, " ", comNameComponent]
-                : [comNameComponent, " ", sciNameComponent]
+                ? (
+                  <>
+                    { sciNameComponent }
+                    { " " }
+                    { comNameComponent }
+                  </>
+                )
+                : (
+                  <>
+                    { comNameComponent }
+                    { " " }
+                    { sciNameComponent }
+                  </>
+                )
             }
           </Text>
         </View>