diff --git a/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultModeContainer.js b/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultModeContainer.js index fc60d7d04..8da0aaf2b 100644 --- a/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultModeContainer.js +++ b/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultModeContainer.js @@ -1,8 +1,5 @@ // @flow -import { - useNetInfo -} from "@react-native-community/netinfo"; -import { useFocusEffect, useNavigation, useRoute } from "@react-navigation/native"; +import { useFocusEffect, useNavigation } from "@react-navigation/native"; import { useQueryClient } from "@tanstack/react-query"; import { fetchSubscriptions } from "api/observations"; import IdentificationSheets from "components/ObsDetailsDefaultMode/IdentificationSheets"; @@ -11,27 +8,22 @@ import type { Node } from "react"; import React, { useCallback, useEffect, - useMemo, - useReducer, - useState + useReducer } from "react"; import { LogBox } from "react-native"; import Observation from "realmModels/Observation"; import safeRealmWrite from "sharedHelpers/safeRealmWrite"; import { useAuthenticatedQuery, - useCurrentUser, - useLocalObservation, useObservationsUpdates } from "sharedHooks"; -import useRemoteObservation, { +import { fetchRemoteObservationKey } from "sharedHooks/useRemoteObservation"; import useStore from "stores/useStore"; import useMarkViewedMutation from "./hooks/useMarkViewedMutation"; import ObsDetailsDefaultMode from "./ObsDetailsDefaultMode"; -import SavedMatch from "./SavedMatch"; const { useRealm } = RealmContext; @@ -361,89 +353,4 @@ const ObsDetailsDefaultModeContainer = ( props ): Node => { ); }; -const ObsDetailsDefaultModeScreenWrapper = () => { - const { params } = useRoute(); - const { - targetActivityItemID, - uuid - } = params; - const currentUser = useCurrentUser( ); - const { isConnected } = useNetInfo( ); - - const [remoteObsWasDeleted, setRemoteObsWasDeleted] = useState( false ); - - const { - localObservation, - markDeletedLocally, - markViewedLocally - } = useLocalObservation( uuid ); - - const fetchRemoteObservationEnabled = !!( - !remoteObsWasDeleted - && ( !localObservation || localObservation?.wasSynced( ) ) - && isConnected - ); - - const { - remoteObservation, - refetchRemoteObservation, - isRefetching, - fetchRemoteObservationError - } = useRemoteObservation( uuid, fetchRemoteObservationEnabled ); - - const observation = localObservation || Observation.mapApiToRealm( remoteObservation ); - - // In theory the only situation in which an observation would not have a - // user is when a user is not signed but has made a new observation in the - // app. Also in theory that user should not be able to get to ObsDetail for - // those observations, just ObsEdit. But.... let's be safe. - const belongsToCurrentUser = ( - observation?.user?.id === currentUser?.id - || ( !observation?.user && !observation?.id ) - ); - - const showSavedMatch = 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 - ( belongsToCurrentUser || !observation?.user ) - && localObservation - && !localObservation.wasSynced() - ), [belongsToCurrentUser, localObservation, observation?.user] ); - - if ( showSavedMatch ) { - return ( - // todo add edit pencil - {}} - isFetchingLocation={false} - handleAddLocationPressed={() => {}} - /> - ); - } - - return ( - - ); -}; - -// todo update stack navigator name for this import -export default ObsDetailsDefaultModeScreenWrapper; +export default ObsDetailsDefaultModeContainer; diff --git a/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultModeScreensWrapper.tsx b/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultModeScreensWrapper.tsx new file mode 100644 index 000000000..7682c384c --- /dev/null +++ b/src/components/ObsDetailsDefaultMode/ObsDetailsDefaultModeScreensWrapper.tsx @@ -0,0 +1,98 @@ +import { useNetInfo } from "@react-native-community/netinfo"; +import { useRoute } from "@react-navigation/native"; +import ObsDetailsDefaultModeContainer + from "components/ObsDetailsDefaultMode/ObsDetailsDefaultModeContainer"; +import SavedMatch from "components/ObsDetailsDefaultMode/SavedMatch/SavedMatch"; +import React, { useMemo, useState } from "react"; +import Observation from "realmModels/Observation"; +import { + useCurrentUser, + useLocalObservation, + useRemoteObservation +} from "sharedHooks"; + +const ObsDetailsDefaultModeScreensWrapper = () => { + const { params } = useRoute(); + const { + targetActivityItemID, + uuid + } = params; + const currentUser = useCurrentUser( ); + const { isConnected } = useNetInfo( ); + + const [remoteObsWasDeleted, setRemoteObsWasDeleted] = useState( false ); + + const { + localObservation, + markDeletedLocally, + markViewedLocally + } = useLocalObservation( uuid ); + + const fetchRemoteObservationEnabled = !!( + !remoteObsWasDeleted + && ( !localObservation || localObservation?.wasSynced( ) ) + && isConnected + ); + + const { + remoteObservation, + refetchRemoteObservation, + isRefetching, + fetchRemoteObservationError + } = useRemoteObservation( uuid, fetchRemoteObservationEnabled ); + + const observation = localObservation || Observation.mapApiToRealm( remoteObservation ); + + // In theory the only situation in which an observation would not have a + // user is when a user is not signed but has made a new observation in the + // app. Also in theory that user should not be able to get to ObsDetail for + // those observations, just ObsEdit. But.... let's be safe. + const belongsToCurrentUser = ( + observation?.user?.id === currentUser?.id + || ( !observation?.user && !observation?.id ) + ); + + const showSavedMatch = 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 + ( belongsToCurrentUser || !observation?.user ) + && localObservation + && !localObservation.wasSynced() + ), [belongsToCurrentUser, localObservation, observation?.user] ); + + if ( showSavedMatch ) { + return ( + // todo add edit pencil + {}} + isFetchingLocation={false} + handleAddLocationPressed={() => {}} + /> + ); + } + + return ( + + ); +}; + +export default ObsDetailsDefaultModeScreensWrapper; diff --git a/src/components/ObsDetailsDefaultMode/SavedMatch.tsx b/src/components/ObsDetailsDefaultMode/SavedMatch/SavedMatch.tsx similarity index 100% rename from src/components/ObsDetailsDefaultMode/SavedMatch.tsx rename to src/components/ObsDetailsDefaultMode/SavedMatch/SavedMatch.tsx diff --git a/src/components/ObsDetailsDefaultMode/SavedMatch/SavedMatchContainer.tsx b/src/components/ObsDetailsDefaultMode/SavedMatch/SavedMatchContainer.tsx new file mode 100644 index 000000000..e69de29bb diff --git a/src/navigation/StackNavigators/TabStackNavigator.js b/src/navigation/StackNavigators/TabStackNavigator.js index 8887dbbad..c8b466198 100644 --- a/src/navigation/StackNavigators/TabStackNavigator.js +++ b/src/navigation/StackNavigators/TabStackNavigator.js @@ -19,8 +19,8 @@ import MyObservationsContainer from "components/MyObservations/MyObservationsCon import Notifications from "components/Notifications/Notifications"; import DQAContainer from "components/ObsDetails/DQAContainer"; import ObsDetailsContainer from "components/ObsDetails/ObsDetailsContainer"; -import ObsDetailsDefaultModeContainer - from "components/ObsDetailsDefaultMode/ObsDetailsDefaultModeContainer"; +import ObsDetailsDefaultModeScreensWrapper + from "components/ObsDetailsDefaultMode/ObsDetailsDefaultModeScreensWrapper"; import ProjectDetailsContainer from "components/ProjectDetails/ProjectDetailsContainer"; import ProjectMembers from "components/ProjectDetails/ProjectMembers"; import ProjectRequirements from "components/ProjectDetails/ProjectRequirements"; @@ -129,8 +129,8 @@ const FadeInRootExplore = ( ) => fadeInComponent( ); const FadeInMyObservations = ( ) => fadeInComponent( ); const FadeInUserProfile = ( ) => fadeInComponent( ); const FadeInExploreContainer = ( ) => fadeInComponent( ); -const FadeInObsDetailsDefaultModeContainer = ( ) => fadeInComponent( - +const FadeInObsDetailsDefaultModeScreensWrapper = ( ) => fadeInComponent( + ); const FadeInObsDetailsContainer = ( ) => fadeInComponent( @@ -226,7 +226,7 @@ const TabStackNavigator = ( { route }: TabStackNavigatorProps ): Node => { ? ( )