[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: {
@@ -1331,6 +1334,7 @@ const CONST = {
  REIMBURSEMENT_MANUAL: 'reimburseManual',
  },
  ID_FAKE: '_FAKE_',
+ EMPTY: 'EMPTY',
  },
 
  CUSTOM_UNITS: {
@@ -1481,6 +1485,10 @@ const CONST = {
  OTHER_INVISIBLE_CHARACTERS: /[\u3164]/g,
 
  REPORT_FIELD_TITLE: /{report:([a-zA-Z]+)}/g,
+
+ PATH_WITHOUT_POLICY_ID: /\/w\/[a-zA-Z0-9]+(\/|$)/,
+
+ POLICY_ID_FROM_PATH: /\/w\/([a-zA-Z0-9]+)(\/|$)/,
  },
 
  PRONOUNS: {
@@ -1490,7 +1498,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',
@@ -3102,11 +3110,6 @@ const CONST = {
  CAROUSEL: 3,
  },
 
- BRICK_ROAD: {
- GBR: 'GBR',
- RBR: 'RBR',
- },
-
  /**
  * Constants for types of violations.
  * Defined here because they need to be referenced by the type system to generate the
@@ -3165,6 +3168,12 @@ 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',
+
  // Stores the recently used report fields
  RECENTLY_USED_REPORT_FIELDS: 'recentlyUsedReportFields',
 
@@ -447,6 +450,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.RECENTLY_USED_REPORT_FIELDS]: OnyxTypes.RecentlyUsedReportFields;
  [ONYXKEYS.UPDATE_REQUIRED]: boolean;
 
@@ -484,8 +488,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,13 @@ function getUrlWithBackToParam<TUrl extends string>(url: TUrl, backTo?: string):
 }
 
 const ROUTES = {
- HOME: '',
+ // If the user opens this route, we'll redirect them to the path saved in the last visited path or to the home page if the last visited path is empty.
+ ROOT: '',
+
+ // This route renders the list of reports.
+ 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 +65,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 +445,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]}