diff --git a/src/components/ObsDetailsDefaultMode/CommunityTaxon.js b/src/components/ObsDetailsDefaultMode/CommunityTaxon.js
index 73a2977e0..125b77ffe 100644
--- a/src/components/ObsDetailsDefaultMode/CommunityTaxon.js
+++ b/src/components/ObsDetailsDefaultMode/CommunityTaxon.js
@@ -2,9 +2,11 @@
import { useNavigation, useRoute } from "@react-navigation/native";
import {
Body4,
+ DisplayTaxon,
DisplayTaxonName,
Heading1,
- Subheading1
+ Subheading1,
+ Subheading2
} from "components/SharedComponents";
import { Pressable, View } from "components/styledComponents";
import type { Node } from "react";
@@ -15,11 +17,13 @@ import {
type Props = {
belongsToCurrentUser: boolean,
+ isSimpleMode: boolean,
observation: Object,
}
const CommunityTaxon = ( {
belongsToCurrentUser,
+ isSimpleMode = false,
observation
}: Props ): Node => {
const navigation = useNavigation( );
@@ -29,16 +33,6 @@ const CommunityTaxon = ( {
const communityTaxon = observation?.taxon;
const taxonId = communityTaxon?.id || "unknown";
- const showCommunityTaxon = ( ) => (
-
- );
-
const handlePress = ( ) => navigation.navigate( {
// Ensure button mashing doesn't open multiple TaxonDetails instances
key: `${route.key}-CommunityTaxon-TaxonDetails-${taxonId}`,
@@ -46,17 +40,53 @@ const CommunityTaxon = ( {
params: { id: taxonId }
} );
- return (
-
-
+ const showCommunityTaxon = ( ) => {
+ if ( !communityTaxon ) {
+ return (
+
+ {t( "Unknown--taxon" )}
+
+ );
+ }
+
+ return isSimpleMode
+ ? (
+
+ )
+ : (
- {observation && showCommunityTaxon( )}
+
+ );
+ };
+
+ return (
+
+
+ {observation && showCommunityTaxon( )}
{
(
diff --git a/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultMode.js b/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultMode.js
index b324c88e9..dcccf5412 100644
--- a/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultMode.js
+++ b/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultMode.js
@@ -34,6 +34,7 @@ type Props = {
belongsToCurrentUser: boolean,
currentUser: Object,
isConnected: boolean,
+ isSimpleMode: boolean,
navToSuggestions: Function,
observation: Object,
openAddCommentSheet: Function,
@@ -52,6 +53,7 @@ const ObsDetailsDefaultMode = ( {
belongsToCurrentUser,
currentUser,
isConnected,
+ isSimpleMode,
navToSuggestions,
observation,
openAddCommentSheet,
@@ -90,19 +92,25 @@ const ObsDetailsDefaultMode = ( {
setHeightOfContentAboveCommunitySection( layout );
}}
>
-
+ {!isSimpleMode && (
+
+ )}
-
+
-
- {addingActivityItem && (
-
-
-
+ {!isSimpleMode && (
+ <>
+
+ {addingActivityItem && (
+
+
+
+ )}
+
+
+
+ >
)}
-
-
-
{currentUser && (
{
|| ( !observation?.user && !observation?.id )
);
+ const isSimpleMode = useMemo( () => (
+ // Simple mode applies only when:
+ // 1. It's the current user's observation (or an observation being created)
+ // 2. AND the observation hasn't been synced yet
+ // 3. AND the user isn't logged in
+ ( belongsToCurrentUser || !observation?.user )
+ && localObservation
+ && !localObservation.wasSynced()
+ && !currentUser
+ ), [belongsToCurrentUser, localObservation, currentUser, observation?.user] );
+
const { data: subscriptions, refetch: refetchSubscriptions } = useAuthenticatedQuery(
[
"fetchSubscriptions"
@@ -342,6 +354,7 @@ const ObsDetailsDefaultModeContainer = ( ): Node => {
belongsToCurrentUser={belongsToCurrentUser}
currentUser={currentUser}
isConnected={isConnected}
+ isSimpleMode={isSimpleMode}
navToSuggestions={navToSuggestions}
observation={observationShown}
openAddCommentSheet={openAddCommentSheet}
diff --git a/src/components/SharedComponents/DisplayTaxon.js b/src/components/SharedComponents/DisplayTaxon.js
index 7103a369d..ab35a582c 100644
--- a/src/components/SharedComponents/DisplayTaxon.js
+++ b/src/components/SharedComponents/DisplayTaxon.js
@@ -1,7 +1,12 @@
// @flow
import classnames from "classnames";
-import { DisplayTaxonName, IconicTaxonIcon } from "components/SharedComponents";
+import {
+ Body1,
+ DisplayTaxonName,
+ IconicTaxonIcon,
+ Subheading2
+} from "components/SharedComponents";
import { Image, Pressable, View } from "components/styledComponents";
import type { Node } from "react";
import React from "react";
@@ -12,6 +17,7 @@ type Props = {
accessibilityHint?: string,
accessibilityLabel?: string,
handlePress: Function,
+ largerText?: boolean,
taxon: Object,
testID?: string,
withdrawn?: boolean
@@ -21,6 +27,7 @@ const DisplayTaxon = ( {
accessibilityHint,
accessibilityLabel,
handlePress,
+ largerText = false,
taxon,
testID,
withdrawn
@@ -74,6 +81,12 @@ const DisplayTaxon = ( {
withdrawn={withdrawn}
scientificNameFirst={currentUser?.prefers_scientific_name_first}
prefersCommonNames={currentUser?.prefers_common_names}
+ topTextComponent={largerText
+ ? Subheading2
+ : undefined}
+ bottomTextComponent={largerText
+ ? Body1
+ : undefined}
/>