using context

Author: dmkt9

src/components/InitialURLContextProvider.tsx

@@ -1,6 +1,7 @@
 import React, {createContext, useEffect, useMemo, useState} from 'react';
 import type {ReactNode} from 'react';
 import {Linking} from 'react-native';
+import {hasAuthToken} from '@libs/actions/Session';
 import type {AppProps} from '@src/App';
 import type {Route} from '@src/ROUTES';
 
@@ -22,6 +23,9 @@ type InitialURLContextProviderProps = AppProps & {
 
 function InitialURLContextProvider({children, url}: InitialURLContextProviderProps) {
     const [initialURL, setInitialURL] = useState<Route | undefined>();
+    const [isAuthenticatedAtStartup, setIsAuthenticatedAtStartup] = useState<boolean>();
+
+    console.log('debug', {initialURL, isAuthenticatedAtStartup});
 
     useEffect(() => {
         if (url) {
@@ -33,12 +37,18 @@ function InitialURLContextProvider({children, url}: InitialURLContextProviderPro
         });
     }, [url]);
 
+    useEffect(() => {
+        const isAuthenticated = hasAuthToken();
+        setIsAuthenticatedAtStartup(isAuthenticated);
+    }, []);
+
     const initialUrlContext = useMemo(
         () => ({
             initialURL,
             setInitialURL,
+            isAuthenticatedAtStartup,
         }),
-        [initialURL],
+        [initialURL, isAuthenticatedAtStartup],
     );
 
     return <InitialURLContext.Provider value={initialUrlContext}>{children}</InitialURLContext.Provider>;

src/libs/Navigation/AppNavigator/AuthScreens.tsx

@@ -1,11 +1,12 @@
 import type {RouteProp} from '@react-navigation/native';
 import {useNavigation} from '@react-navigation/native';
-import React, {memo, useEffect, useMemo, useRef, useState} from 'react';
+import React, {memo, useContext, useEffect, useMemo, useRef, useState} from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import Onyx, {withOnyx} from 'react-native-onyx';
 import ComposeProviders from '@components/ComposeProviders';
 import DelegateNoAccessModalProvider from '@components/DelegateNoAccessModalProvider';
 import FullScreenLoadingIndicator from '@components/FullscreenLoadingIndicator';
+import {InitialURLContext} from '@components/InitialURLContextProvider';
 import LockedAccountModalProvider from '@components/LockedAccountModalProvider';
 import OptionsListContextProvider from '@components/OptionListContextProvider';
 import PriorityModeController from '@components/PriorityModeController';
@@ -89,9 +90,6 @@ type AuthScreensProps = {
 
     /** The last Onyx update ID was applied to the client */
     initialLastUpdateIDAppliedToClient: OnyxEntry<number>;
-
-    /** Initial url */
-    initialUrl: string | null;
 };
 
 const loadAttachmentModalScreen = () => require<ReactComponentModule>('../../../pages/media/AttachmentModalScreen').default;
@@ -226,7 +224,7 @@ const modalScreenListenersWithCancelSearch = {
     },
 };
 
-function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDAppliedToClient, initialUrl}: AuthScreensProps) {
+function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDAppliedToClient}: AuthScreensProps) {
     const theme = useTheme();
     const StyleUtils = useStyleUtils();
     const {shouldUseNarrowLayout} = useResponsiveLayout();
@@ -246,6 +244,7 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie
     const prevIsOnboardingLoading = usePrevious(isOnboardingLoading);
     const [shouldShowRequire2FAPage, setShouldShowRequire2FAPage] = useState(!!account?.needsTwoFactorAuthSetup && !account.requiresTwoFactorAuth);
     const navigation = useNavigation();
+    const {initialURL} = useContext(InitialURLContext);
 
     // State to track whether the delegator's authentication is completed before displaying data
     const [isDelegatorFromOldDotIsReady, setIsDelegatorFromOldDotIsReady] = useState(false);
@@ -326,7 +325,7 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie
                             setIsDelegatorFromOldDotIsReady(true);
                         });
                 } else {
-                    const reportID = getReportIDFromLink(initialUrl);
+                    const reportID = getReportIDFromLink(initialURL ?? null);
                     if (reportID) {
                         Report.openReport(reportID);
                     }
@@ -789,7 +788,7 @@ const AuthScreensMemoized = memo(AuthScreens, () => true);
 // Further analysis required and more details can be seen here:
 // https://github.com/Expensify/App/issues/50560
 // eslint-disable-next-line
-export default withOnyx<AuthScreensProps, Omit<AuthScreensProps, 'initialUrl'>>({
+export default withOnyx<AuthScreensProps, AuthScreensProps>({
     session: {
         key: ONYXKEYS.SESSION,
     },

src/libs/Navigation/AppNavigator/index.native.tsx

@@ -4,17 +4,14 @@ import type ReactComponentModule from '@src/types/utils/ReactComponentModule';
 type AppNavigatorProps = {
     /** If we have an authToken this is true */
     authenticated: boolean;
-
-    /** Initial url */
-    initialUrl: string | null;
 };
 
-function AppNavigator({authenticated, initialUrl}: AppNavigatorProps) {
+function AppNavigator({authenticated}: AppNavigatorProps) {
     if (authenticated) {
-        const AuthScreens = require<ReactComponentModule<{initialUrl: string | null}>>('./AuthScreens').default;
+        const AuthScreens = require<ReactComponentModule>('./AuthScreens').default;
 
         // These are the protected screens and only accessible when an authToken is present
-        return <AuthScreens initialUrl={initialUrl} />;
+        return <AuthScreens />;
     }
 
     const PublicScreens = require<ReactComponentModule>('./PublicScreens').default;

src/libs/Navigation/AppNavigator/index.tsx

@@ -7,17 +7,14 @@ const PublicScreens = lazy(() => lazyRetry(() => import('./PublicScreens')));
 type AppNavigatorProps = {
     /** If we have an authToken this is true */
     authenticated: boolean;
-
-    /** Initial url */
-    initialUrl: string | null;
 };
 
-function AppNavigator({authenticated, initialUrl}: AppNavigatorProps) {
+function AppNavigator({authenticated}: AppNavigatorProps) {
     if (authenticated) {
         // These are the protected screens and only accessible when an authToken is present
         return (
             <Suspense fallback={null}>
-                <AuthScreens initialUrl={initialUrl}/>
+                <AuthScreens />
             </Suspense>
         );
     }

src/libs/Navigation/NavigationRoot.tsx

@@ -251,10 +251,7 @@ function NavigationRoot({authenticated, lastVisitedPath, initialUrl, onReady}: N
                 enabled: false,
             }}
         >
-            <AppNavigator
-                authenticated={authenticated}
-                initialUrl={initialUrl}
-            />
+            <AppNavigator authenticated={authenticated} />
         </NavigationContainer>
     );
 }

src/types/utils/ReactComponentModule.ts

@@ -1,3 +1,3 @@
-type ReactComponentModule<T = unknown> = {default: React.ComponentType<T>};
+type ReactComponentModule = {default: React.ComponentType};
 
 export default ReactComponentModule;