Merge pull request #62344 from software-mansion-labs/borys3kk-navigation-accounts-tab-not-saved

Save the last visited path for the Accounts pages

Author: mountiny

src/CONST.ts

@@ -6422,7 +6422,10 @@ const CONST = {
         ACTIVE_WORKSPACE_ID: 'ACTIVE_WORKSPACE_ID',
         RETRY_LAZY_REFRESHED: 'RETRY_LAZY_REFRESHED',
         LAST_REFRESH_TIMESTAMP: 'LAST_REFRESH_TIMESTAMP',
-        LAST_VISITED_WORKSPACES_TAB_PATH: 'LAST_VISITED_WORKSPACES_TAB_PATH',
+        LAST_VISITED_TAB_PATH: {
+            WORKSPACES: 'LAST_VISITED_WORKSPACES_TAB_PATH',
+            SETTINGS: 'LAST_VISITED_SETTINGS_TAB_PATH',
+        },
     },
 
     RESERVATION_TYPE: {

src/components/Navigation/NavigationTabBar/index.tsx

@@ -23,7 +23,12 @@ import clearSelectedText from '@libs/clearSelectedText/clearSelectedText';
 import getPlatform from '@libs/getPlatform';
 import interceptAnonymousUser from '@libs/interceptAnonymousUser';
 import {getPreservedNavigatorState} from '@libs/Navigation/AppNavigator/createSplitNavigator/usePreserveNavigatorState';
-import {getLastVisitedWorkspacesTabPath, getLastVisitedWorkspaceTabScreen, getWorkspacesTabStateFromSessionStorage} from '@libs/Navigation/helpers/getLastVisitedWorkspaceTabScreen';
+import {
+    getLastVisitedTabPath,
+    getLastVisitedWorkspaceTabScreen,
+    getSettingsTabStateFromSessionStorage,
+    getWorkspacesTabStateFromSessionStorage,
+} from '@libs/Navigation/helpers/lastVisitedTabPathUtils';
 import {buildCannedSearchQuery, buildSearchQueryJSON, buildSearchQueryString} from '@libs/SearchQueryUtils';
 import type {BrickRoad} from '@libs/WorkspacesSettingsUtils';
 import {getChatTabBrickRoad} from '@libs/WorkspacesSettingsUtils';
@@ -121,9 +126,17 @@ function NavigationTabBar({selectedTab, isTooltipAllowed = false, isTopLevelBar
             return;
         }
         interceptAnonymousUser(() => {
+            const settingsTabState = getSettingsTabStateFromSessionStorage();
+            if (settingsTabState && !shouldUseNarrowLayout) {
+                const lastVisitedSettingsRoute = getLastVisitedTabPath(settingsTabState);
+                if (lastVisitedSettingsRoute) {
+                    Navigation.navigate(lastVisitedSettingsRoute);
+                    return;
+                }
+            }
             Navigation.navigate(ROUTES.SETTINGS);
         });
-    }, [selectedTab]);
+    }, [selectedTab, shouldUseNarrowLayout]);
 
     /**
      * The settings tab is related to SettingsSplitNavigator and WorkspaceSplitNavigator.
@@ -185,7 +198,7 @@ function NavigationTabBar({selectedTab, isTooltipAllowed = false, isTopLevelBar
             // If the path stored in the session storage leads to a settings screen, we just navigate to it on a wide layout.
             // On a small screen, we want to go to the page containing the bottom tab bar (ROUTES.SETTINGS or ROUTES.SETTINGS_WORKSPACES) when changing tabs
             if (workspacesTabState && !shouldUseNarrowLayout) {
-                const lastVisitedSettingsRoute = getLastVisitedWorkspacesTabPath(workspacesTabState);
+                const lastVisitedSettingsRoute = getLastVisitedTabPath(workspacesTabState);
                 if (lastVisitedSettingsRoute) {
                     Navigation.navigate(lastVisitedSettingsRoute);
                     return;

src/libs/Navigation/NavigationRoot.tsx

@@ -27,8 +27,8 @@ import AppNavigator from './AppNavigator';
 import {cleanPreservedNavigatorStates} from './AppNavigator/createSplitNavigator/usePreserveNavigatorState';
 import customGetPathFromState from './helpers/customGetPathFromState';
 import getAdaptedStateFromPath from './helpers/getAdaptedStateFromPath';
-import {saveWorkspacesTabPathToSessionStorage} from './helpers/getLastVisitedWorkspaceTabScreen';
 import {isWorkspacesTabScreenName} from './helpers/isNavigatorName';
+import {saveSettingsTabPathToSessionStorage, saveWorkspacesTabPathToSessionStorage} from './helpers/lastVisitedTabPathUtils';
 import {linkingConfig} from './linkingConfig';
 import Navigation, {navigationRef} from './Navigation';
 
@@ -75,6 +75,8 @@ function parseAndLogRoute(state: NavigationState) {
     Navigation.setIsNavigationReady();
     if (isWorkspacesTabScreenName(state.routes.at(-1)?.name)) {
         saveWorkspacesTabPathToSessionStorage(currentPath);
+    } else if (state.routes.at(-1)?.name === NAVIGATORS.SETTINGS_SPLIT_NAVIGATOR) {
+        saveSettingsTabPathToSessionStorage(currentPath);
     }
 
     // Fullstory Page navigation tracking

src/libs/Navigation/helpers/getLastVisitedWorkspaceTabScreen/index.native.ts

@@ -1,5 +1,5 @@
 import {SIDEBAR_TO_SPLIT, SPLIT_TO_SIDEBAR} from '@libs/Navigation/linkingConfig/RELATIONS';
-import type {FullScreenName, OnboardingFlowName, SplitNavigatorName, SplitNavigatorSidebarScreen, WorkspacesTabScreenName} from '@libs/Navigation/types';
+import type {FullScreenName, OnboardingFlowName, SplitNavigatorName, SplitNavigatorSidebarScreen, WorkspacesTabNavigatorName} from '@libs/Navigation/types';
 import NAVIGATORS from '@src/NAVIGATORS';
 import SCREENS from '@src/SCREENS';
 
@@ -50,7 +50,7 @@ function isSidebarScreenName(screen: string | undefined) {
 }
 
 function isWorkspacesTabScreenName(screen: string | undefined) {
-    return checkIfScreenHasMatchingNameToSetValues<WorkspacesTabScreenName>(screen, WORKSPACES_TAB_SET);
+    return checkIfScreenHasMatchingNameToSetValues<WorkspacesTabNavigatorName>(screen, WORKSPACES_TAB_SET);
 }
 
 export {isFullScreenName, isOnboardingFlowName, isSidebarScreenName, isSplitNavigatorName, isWorkspacesTabScreenName};

src/libs/Navigation/helpers/getLastVisitedWorkspaceTabScreen/index.ts

@@ -0,0 +1,36 @@
+import type {NavigationState, PartialState} from '@react-navigation/native';
+import type {Route} from '@src/ROUTES';
+
+function clearSessionStorage() {}
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function saveWorkspacesTabPathToSessionStorage(url: string) {}
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function saveSettingsTabPathToSessionStorage(url: string) {}
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function getLastVisitedTabPath(state: NavigationState | PartialState<NavigationState>): Route | undefined {
+    return undefined;
+}
+
+function getWorkspacesTabStateFromSessionStorage() {
+    return undefined;
+}
+function getSettingsTabStateFromSessionStorage() {
+    return undefined;
+}
+
+function getLastVisitedWorkspaceTabScreen() {
+    return undefined;
+}
+
+export {
+    clearSessionStorage,
+    getLastVisitedWorkspaceTabScreen,
+    getLastVisitedTabPath,
+    saveSettingsTabPathToSessionStorage,
+    getSettingsTabStateFromSessionStorage,
+    saveWorkspacesTabPathToSessionStorage,
+    getWorkspacesTabStateFromSessionStorage,
+};

src/libs/Navigation/helpers/isNavigatorName.ts

@@ -0,0 +1,75 @@
+import type {NavigationState, PartialState} from '@react-navigation/native';
+import {findFocusedRoute} from '@react-navigation/native';
+import type {ValueOf} from 'type-fest';
+import getStateFromPath from '@libs/Navigation/helpers/getStateFromPath';
+import CONST from '@src/CONST';
+import type {Route} from '@src/ROUTES';
+
+type LastVisitedTabPathKey = ValueOf<typeof CONST.SESSION_STORAGE_KEYS.LAST_VISITED_TAB_PATH>;
+
+/**
+ * Clears all session storage data.
+ */
+function clearSessionStorage() {
+    sessionStorage.clear();
+}
+
+/**
+ * Generic function to save a path to session storage by key
+ */
+function saveTabPathToSessionStorage(key: LastVisitedTabPathKey, url: string) {
+    sessionStorage.setItem(key, url);
+}
+
+/**
+ * Converts stored path to navigation state
+ */
+function getTabStateFromSessionStorage(key: LastVisitedTabPathKey) {
+    const path = sessionStorage.getItem(key) as Route | undefined;
+    if (!path) {
+        return undefined;
+    }
+    return getStateFromPath(path);
+}
+
+/**
+ * Generic function to extract the path from currently focused route
+ */
+function getLastVisitedTabPath(state: NavigationState | PartialState<NavigationState>) {
+    const focusedRoute = findFocusedRoute(state);
+    if (!focusedRoute) {
+        return undefined;
+    }
+    return focusedRoute.path as Route;
+}
+
+function saveWorkspacesTabPathToSessionStorage(url: string) {
+    saveTabPathToSessionStorage(CONST.SESSION_STORAGE_KEYS.LAST_VISITED_TAB_PATH.WORKSPACES, url);
+}
+
+function getWorkspacesTabStateFromSessionStorage() {
+    return getTabStateFromSessionStorage(CONST.SESSION_STORAGE_KEYS.LAST_VISITED_TAB_PATH.WORKSPACES);
+}
+
+function saveSettingsTabPathToSessionStorage(url: string) {
+    saveTabPathToSessionStorage(CONST.SESSION_STORAGE_KEYS.LAST_VISITED_TAB_PATH.SETTINGS, url);
+}
+
+function getSettingsTabStateFromSessionStorage() {
+    return getTabStateFromSessionStorage(CONST.SESSION_STORAGE_KEYS.LAST_VISITED_TAB_PATH.SETTINGS);
+}
+
+function getLastVisitedWorkspaceTabScreen() {
+    const workspacesTabState = getWorkspacesTabStateFromSessionStorage();
+    return workspacesTabState?.routes?.at(-1)?.state?.routes?.at(-1)?.name;
+}
+
+export {
+    clearSessionStorage,
+    getLastVisitedWorkspaceTabScreen,
+    getLastVisitedTabPath,
+    saveSettingsTabPathToSessionStorage,
+    getSettingsTabStateFromSessionStorage,
+    saveWorkspacesTabPathToSessionStorage,
+    getWorkspacesTabStateFromSessionStorage,
+};

src/libs/Navigation/helpers/lastVisitedTabPathUtils/index.native.ts

@@ -2051,7 +2051,8 @@ type SearchFullscreenNavigatorName = typeof NAVIGATORS.SEARCH_FULLSCREEN_NAVIGAT
 
 type FullScreenName = SplitNavigatorName | SearchFullscreenNavigatorName;
 
-type WorkspacesTabScreenName = typeof NAVIGATORS.WORKSPACE_HUB_SPLIT_NAVIGATOR | typeof NAVIGATORS.WORKSPACE_SPLIT_NAVIGATOR;
+// There are two split navigators which can be displayed when the Workspaces tab is selected
+type WorkspacesTabNavigatorName = typeof NAVIGATORS.WORKSPACE_HUB_SPLIT_NAVIGATOR | typeof NAVIGATORS.WORKSPACE_SPLIT_NAVIGATOR;
 
 type WorkspaceScreenName = keyof WorkspaceSplitNavigatorParamList;
 
@@ -2136,5 +2137,5 @@ export type {
     TestDriveModalNavigatorParamList,
     WorkspaceScreenName,
     TestDriveDemoNavigatorParamList,
-    WorkspacesTabScreenName,
+    WorkspacesTabNavigatorName,
 };

src/libs/Navigation/helpers/lastVisitedTabPathUtils/index.ts

@@ -1,6 +1,6 @@
 import Onyx from 'react-native-onyx';
 import {getMicroSecondOnyxErrorWithMessage} from '@libs/ErrorUtils';
-import {clearSessionStorage} from '@libs/Navigation/helpers/getLastVisitedWorkspaceTabScreen';
+import {clearSessionStorage} from '@libs/Navigation/helpers/lastVisitedTabPathUtils';
 import type {OnyxKey} from '@src/ONYXKEYS';
 import ONYXKEYS from '@src/ONYXKEYS';
 import {clearAllPolicies} from './Policy/Policy';