[Wave 8] Ideal nav

patches/@react-navigation+stack+6.3.16+002+dontDetachScreen.patch

@@ -43,7 +43,7 @@ index 7558eb3..b7bb75e 100644
          }) : STATE_TRANSITIONING_OR_BELOW_TOP;
        }
 +      
-+      const isHomeScreenAndNotOnTop = route.name === 'Home' && isScreenActive !== STATE_ON_TOP;
++      const isHomeScreenAndNotOnTop = (route.name === 'BottomTabNavigator' || route.name === 'Settings_Root')  && isScreenActive !== STATE_ON_TOP;
 +
        const {
          headerShown = true,

src/App.js

@@ -6,6 +6,7 @@ import Onyx from 'react-native-onyx';
 import {PickerStateProvider} from 'react-native-picker-select';
 import {SafeAreaProvider} from 'react-native-safe-area-context';
 import '../wdyr';
+import ActiveWorkspaceContextProvider from './components/ActiveWorkspace/ActiveWorkspaceProvider';
 import ColorSchemeWrapper from './components/ColorSchemeWrapper';
 import ComposeProviders from './components/ComposeProviders';
 import CustomStatusBarAndBackground from './components/CustomStatusBarAndBackground';
@@ -69,6 +70,7 @@ function App() {
                     PickerStateProvider,
                     EnvironmentProvider,
                     CustomStatusBarAndBackgroundContextProvider,
+                    ActiveWorkspaceContextProvider,
                 ]}
             >
                 <CustomStatusBarAndBackground />

src/CONST.ts

@@ -490,6 +490,8 @@ const CONST = {
     // Use Environment.getEnvironmentURL to get the complete URL with port number
     DEV_NEW_EXPENSIFY_URL: 'https://dev.new.expensify.com:',
     OLDDOT_URLS: {
+        ADMIN_POLICIES_URL: 'admin_policies',
+        ADMIN_DOMAINS_URL: 'admin_domains',
         INBOX: 'inbox',
     },
 
@@ -1013,6 +1015,7 @@ const CONST = {
             3: 100,
         },
     },
+    CENTRAL_PANE_ANIMATION_HEIGHT: 200,
     LHN_SKELETON_VIEW_ITEM_HEIGHT: 64,
     EXPENSIFY_PARTNER_NAME: 'expensify.com',
     EMAIL: {
@@ -1330,6 +1333,7 @@ const CONST = {
             REIMBURSEMENT_MANUAL: 'reimburseManual',
         },
         ID_FAKE: '_FAKE_',
+        EMPTY: 'EMPTY',
     },
 
     CUSTOM_UNITS: {
@@ -1489,7 +1493,7 @@ const CONST = {
     GUIDES_CALL_TASK_IDS: {
         CONCIERGE_DM: 'NewExpensifyConciergeDM',
         WORKSPACE_INITIAL: 'WorkspaceHome',
-        WORKSPACE_SETTINGS: 'WorkspaceGeneralSettings',
+        WORKSPACE_OVERVIEW: 'WorkspaceOverview',
         WORKSPACE_CARD: 'WorkspaceCorporateCards',
         WORKSPACE_REIMBURSE: 'WorkspaceReimburseReceipts',
         WORKSPACE_BILLS: 'WorkspacePayBills',
@@ -3100,10 +3104,9 @@ const CONST = {
         DEFAULT: 5,
         CAROUSEL: 3,
     },
-
     BRICK_ROAD: {
-        GBR: 'GBR',
-        RBR: 'RBR',
+        GBR: 'info',
+        RBR: 'error',
     },
 
     /**
@@ -3164,6 +3167,11 @@ const CONST = {
 
     MINI_CONTEXT_MENU_MAX_ITEMS: 4,
 
+    WORKSPACE_SWITCHER: {
+        NAME: 'Expensify',
+        SUBSCRIPT_ICON_SIZE: 8,
+        MINIMUM_WORKSPACES_TO_SHOW_SEARCH: 8,
+    },
     REPORT_FIELD_TITLE_FIELD_ID: 'text_title',
 } as const;
 

src/Expensify.js

@@ -62,7 +62,8 @@ const propTypes = {
     /** Whether a new update is available and ready to install. */
     updateAvailable: PropTypes.bool,
 
-    /** Tells us if the sidebar has rendered */
+    /** Tells us if the sidebar has rendered - TODO: We don't use it as temporary solution to fix not hidding splashscreen */
+    // eslint-disable-next-line react/no-unused-prop-types
     isSidebarLoaded: PropTypes.bool,
 
     /** Information about a screen share call requested by a GuidesPlus agent */
@@ -83,6 +84,9 @@ const propTypes = {
     /** Whether we should display the notification alerting the user that focus mode has been auto-enabled */
     focusModeNotification: PropTypes.bool,
 
+    /** Last visited path in the app */
+    lastVisitedPath: PropTypes.string,
+
     ...withLocalizePropTypes,
 };
 
@@ -97,6 +101,7 @@ const defaultProps = {
     isCheckingPublicRoom: true,
     updateRequired: false,
     focusModeNotification: false,
+    lastVisitedPath: undefined,
 };
 
 const SplashScreenHiddenContext = React.createContext({});
@@ -107,6 +112,7 @@ function Expensify(props) {
     const [isOnyxMigrated, setIsOnyxMigrated] = useState(false);
     const [isSplashHidden, setIsSplashHidden] = useState(false);
     const [hasAttemptedToOpenPublicRoom, setAttemptedToOpenPublicRoom] = useState(false);
+    const [initialUrl, setInitialUrl] = useState(null);
 
     useEffect(() => {
         if (props.isCheckingPublicRoom) {
@@ -125,7 +131,7 @@ function Expensify(props) {
         [isSplashHidden],
     );
 
-    const shouldInit = isNavigationReady && (!isAuthenticated || props.isSidebarLoaded) && hasAttemptedToOpenPublicRoom;
+    const shouldInit = isNavigationReady && hasAttemptedToOpenPublicRoom;
     const shouldHideSplash = shouldInit && !isSplashHidden;
 
     const initializeClient = () => {
@@ -187,6 +193,7 @@ function Expensify(props) {
 
         // If the app is opened from a deep link, get the reportID (if exists) from the deep link and navigate to the chat report
         Linking.getInitialURL().then((url) => {
+            setInitialUrl(url);
             Report.openReportFromDeepLink(url, isAuthenticated);
         });
 
@@ -247,6 +254,8 @@ function Expensify(props) {
                     <NavigationRoot
                         onReady={setNavigationReady}
                         authenticated={isAuthenticated}
+                        lastVisitedPath={props.lastVisitedPath}
+                        initialUrl={initialUrl}
                     />
                 </SplashScreenHiddenContext.Provider>
             )}
@@ -286,6 +295,9 @@ export default compose(
             key: ONYXKEYS.FOCUS_MODE_NOTIFICATION,
             initWithStoredValues: false,
         },
+        lastVisitedPath: {
+            key: ONYXKEYS.LAST_VISITED_PATH,
+        },
     }),
 )(Expensify);
 

src/NAVIGATORS.ts

@@ -4,6 +4,7 @@
  * */
 export default {
     CENTRAL_PANE_NAVIGATOR: 'CentralPaneNavigator',
+    BOTTOM_TAB_NAVIGATOR: 'BottomTabNavigator',
     LEFT_MODAL_NAVIGATOR: 'LeftModalNavigator',
     RIGHT_MODAL_NAVIGATOR: 'RightModalNavigator',
     FULL_SCREEN_NAVIGATOR: 'FullScreenNavigator',

src/ONYXKEYS.ts

@@ -243,6 +243,9 @@ const ONYXKEYS = {
     // Max width supported for HTML <canvas> element
     MAX_CANVAS_WIDTH: 'maxCanvasWidth',
 
+    // Stores last visited path
+    LAST_VISITED_PATH: 'lastVisitedPath',
+
     /** Indicates whether an forced upgrade is required */
     UPDATE_REQUIRED: 'updateRequired',
 
@@ -445,6 +448,7 @@ type OnyxValues = {
     [ONYXKEYS.MAX_CANVAS_AREA]: number;
     [ONYXKEYS.MAX_CANVAS_HEIGHT]: number;
     [ONYXKEYS.MAX_CANVAS_WIDTH]: number;
+    [ONYXKEYS.LAST_VISITED_PATH]: string | undefined;
     [ONYXKEYS.UPDATE_REQUIRED]: boolean;
 
     // Collections
@@ -482,8 +486,8 @@ type OnyxValues = {
     // Forms
     [ONYXKEYS.FORMS.ADD_DEBIT_CARD_FORM]: OnyxTypes.AddDebitCardForm;
     [ONYXKEYS.FORMS.ADD_DEBIT_CARD_FORM_DRAFT]: OnyxTypes.AddDebitCardForm;
-    [ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM]: OnyxTypes.Form;
-    [ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM_DRAFT]: OnyxTypes.Form;
+    [ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM]: OnyxTypes.WorkspaceSettingsForm;
+    [ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM_DRAFT]: OnyxTypes.WorkspaceSettingsForm;
     [ONYXKEYS.FORMS.WORKSPACE_RATE_AND_UNIT_FORM]: OnyxTypes.Form;
     [ONYXKEYS.FORMS.WORKSPACE_RATE_AND_UNIT_FORM_DRAFT]: OnyxTypes.Form;
     [ONYXKEYS.FORMS.CLOSE_ACCOUNT_FORM]: OnyxTypes.Form;

src/ROUTES.ts

@@ -12,7 +12,11 @@ function getUrlWithBackToParam<TUrl extends string>(url: TUrl, backTo?: string):
 }
 
 const ROUTES = {
-    HOME: '',
+    ROOT: '',
+
+    HOME: 'home',
+
+    ALL_SETTINGS: 'all-settings',
 
     // This is a utility route used to go to the user's concierge chat, or the sign-in page if the user's not authenticated
     CONCIERGE: 'concierge',
@@ -59,7 +63,7 @@ const ROUTES = {
         route: 'bank-account/:stepToOpen?',
         getRoute: (stepToOpen = '', policyID = '', backTo?: string) => getUrlWithBackToParam(`bank-account/${stepToOpen}?policyID=${policyID}`, backTo),
     },
-
+    WORKSPACE_SWITCHER: 'workspace-switcher',
     SETTINGS: 'settings',
     SETTINGS_PROFILE: 'settings/profile',
     SETTINGS_SHARE_CODE: 'settings/shareCode',
@@ -439,9 +443,17 @@ const ROUTES = {
         route: 'workspace/:policyID/invite-message',
         getRoute: (policyID: string) => `workspace/${policyID}/invite-message` as const,
     },
-    WORKSPACE_SETTINGS: {
-        route: 'workspace/:policyID/settings',
-        getRoute: (policyID: string) => `workspace/${policyID}/settings` as const,
+    WORKSPACE_OVERVIEW: {
+        route: 'workspace/:policyID/overview',
+        getRoute: (policyID: string) => `workspace/${policyID}/overview` as const,
+    },
+    WORKSPACE_OVERVIEW_CURRENCY: {
+        route: 'workspace/:policyID/overview/currency',
+        getRoute: (policyID: string) => `workspace/${policyID}/overview/currency` as const,
+    },
+    WORKSPACE_OVERVIEW_NAME: {
+        route: 'workspace/:policyID/overview/name',
+        getRoute: (policyID: string) => `workspace/${policyID}/overview/name` as const,
     },
     WORKSPACE_AVATAR: {
         route: 'workspace/:policyID/avatar',

src/SCREENS.ts

@@ -12,6 +12,7 @@ const PROTECTED_SCREENS = {
 
 const SCREENS = {
     ...PROTECTED_SCREENS,
+    ALL_SETTINGS: 'AllSettings',
     REPORT: 'Report',
     PROFILE_AVATAR: 'ProfileAvatar',
     WORKSPACE_AVATAR: 'WorkspaceAvatar',
@@ -20,6 +21,7 @@ const SCREENS = {
     TRANSITION_BETWEEN_APPS: 'TransitionBetweenApps',
     VALIDATE_LOGIN: 'ValidateLogin',
     UNLINK_LOGIN: 'UnlinkLogin',
+    SETTINGS_CENTRAL_PANE: 'SettingsCentralPane',
     SETTINGS: {
         ROOT: 'Settings_Root',
         SHARE_CODE: 'Settings_Share_Code',
@@ -86,6 +88,10 @@ const SCREENS = {
     },
     LEFT_MODAL: {
         SEARCH: 'Search',
+        WORKSPACE_SWITCHER: 'WorkspaceSwitcher',
+    },
+    WORKSPACE_SWITCHER: {
+        ROOT: 'WorkspaceSwitcher_Root',
     },
     RIGHT_MODAL: {
         SETTINGS: 'Settings',
@@ -194,7 +200,7 @@ const SCREENS = {
 
     WORKSPACE: {
         INITIAL: 'Workspace_Initial',
-        SETTINGS: 'Workspace_Settings',
+        OVERVIEW: 'Workspace_Overview',
         CARD: 'Workspace_Card',
         REIMBURSE: 'Workspace_Reimburse',
         RATE_AND_UNIT: 'Workspace_RateAndUnit',
@@ -204,7 +210,8 @@ const SCREENS = {
         MEMBERS: 'Workspace_Members',
         INVITE: 'Workspace_Invite',
         INVITE_MESSAGE: 'Workspace_Invite_Message',
-        CURRENCY: 'Workspace_Settings_Currency',
+        CURRENCY: 'Workspace_Overview_Currency',
+        NAME: 'Workspace_Overview_Name',
     },
 
     EDIT_REQUEST: {

src/components/ActiveWorkspace/ActiveWorkspaceContext.tsx

@@ -0,0 +1,11 @@
+import {createContext} from 'react';
+
+type ActiveWorkspaceContextType = {
+    activeWorkspaceID?: string;
+    setActiveWorkspaceID: (activeWorkspaceID?: string) => void;
+};
+
+const ActiveWorkspaceContext = createContext<ActiveWorkspaceContextType>({activeWorkspaceID: undefined, setActiveWorkspaceID: () => undefined});
+
+export default ActiveWorkspaceContext;
+export {type ActiveWorkspaceContextType};

src/components/ActiveWorkspace/ActiveWorkspaceProvider.tsx

@@ -0,0 +1,19 @@
+import React, {useMemo, useState} from 'react';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
+import ActiveWorkspaceContext from './ActiveWorkspaceContext';
+
+function ActiveWorkspaceContextProvider({children}: ChildrenProps) {
+    const [activeWorkspaceID, setActiveWorkspaceID] = useState<string | undefined>(undefined);
+
+    const value = useMemo(
+        () => ({
+            activeWorkspaceID,
+            setActiveWorkspaceID,
+        }),
+        [activeWorkspaceID],
+    );
+
+    return <ActiveWorkspaceContext.Provider value={value}>{children}</ActiveWorkspaceContext.Provider>;
+}
+
+export default ActiveWorkspaceContextProvider;

src/components/AvatarCropModal/AvatarCropModal.tsx

@@ -341,6 +341,7 @@ function AvatarCropModal({imageUri = '', imageName = '', imageType = '', onClose
             isVisible={isVisible}
             type={CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED}
             onModalHide={resetState}
+            shouldUseCustomBackdrop
         >
             <ScreenWrapper
                 style={[styles.pb0]}