Ideal nav updateLastVisitedPath action

src/Expensify.js

@@ -80,6 +80,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,
 };
 
@@ -93,6 +96,7 @@ const defaultProps = {
     screenShareRequest: null,
     isCheckingPublicRoom: true,
     focusModeNotification: false,
+    lastVisitedPath: undefined,
 };
 
 const SplashScreenHiddenContext = React.createContext({});
@@ -103,6 +107,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) {
@@ -183,6 +188,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);
             DemoActions.runDemoByURL(url);
             Report.openReportFromDeepLink(url, isAuthenticated);
         });
@@ -239,7 +245,9 @@ function Expensify(props) {
                 <SplashScreenHiddenContext.Provider value={contextValue}>
                     <NavigationRoot
                         onReady={setNavigationReady}
+                        lastVisitedPath={props.lastVisitedPath}
                         authenticated={isAuthenticated}
+                        initialUrl={initialUrl}
                     />
                 </SplashScreenHiddenContext.Provider>
             )}
@@ -275,6 +283,9 @@ export default compose(
             key: ONYXKEYS.FOCUS_MODE_NOTIFICATION,
             initWithStoredValues: false,
         },
+        lastVisitedPath: {
+            key: ONYXKEYS.LAST_VISITED_PATH,
+        },
     }),
 )(Expensify);
 

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',
+
     /** Collection Keys */
     COLLECTION: {
         DOWNLOAD: 'download_',
@@ -433,6 +436,7 @@ type OnyxValues = {
     [ONYXKEYS.MAX_CANVAS_AREA]: number;
     [ONYXKEYS.MAX_CANVAS_HEIGHT]: number;
     [ONYXKEYS.MAX_CANVAS_WIDTH]: number;
+    [ONYXKEYS.LAST_VISITED_PATH]: string;
 
     // Collections
     [ONYXKEYS.COLLECTION.DOWNLOAD]: OnyxTypes.Download;

src/ROUTES.ts

@@ -12,7 +12,9 @@ function getUrlWithBackToParam<TUrl extends string>(url: TUrl, backTo?: string):
 }
 
 const ROUTES = {
-    HOME: '',
+    HOME_ROOT: '',
+    // This is a utility route to allow navigating to the home screen explicitly
+    HOME: 'home',
 
     ALL_SETTINGS: 'all-settings',
 

src/SCREENS.ts

@@ -6,6 +6,7 @@ import DeepValueOf from './types/utils/DeepValueOf';
 
 const PROTECTED_SCREENS = {
     HOME: 'Home',
+    HOME_ROOT: 'HomeRoot',
     CONCIERGE: 'Concierge',
     REPORT_ATTACHMENTS: 'ReportAttachments',
 } as const;

src/components/Icon/Expensicons.ts

@@ -52,7 +52,6 @@ import EReceiptIcon from '@assets/images/eReceiptIcon.svg';
 import Exclamation from '@assets/images/exclamation.svg';
 import Exit from '@assets/images/exit.svg';
 import Expand from '@assets/images/expand.svg';
-import ExpensifyAppIcon from '@assets/images/expensify-app-icon.svg';
 import ExpensifyFooterLogoVertical from '@assets/images/expensify-footer-logo-vertical.svg';
 import ExpensifyFooterLogo from '@assets/images/expensify-footer-logo.svg';
 import ExpensifyWordmark from '@assets/images/expensify-wordmark.svg';
@@ -186,7 +185,6 @@ export {
     EmptyStateAttachReceipt,
     Exclamation,
     Exit,
-    ExpensifyAppIcon,
     ExpensifyCard,
     ExpensifyWordmark,
     ExpensifyFooterLogo,

src/components/Icon/index.tsx

@@ -100,5 +100,4 @@ function Icon({
 
 Icon.displayName = 'Icon';
 
-export type {IconProps};
 export default Icon;

src/components/IllustratedHeaderPageLayout.js

@@ -1,8 +1,8 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import useTheme from '@hooks/useTheme';
-import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
+import useTheme from '../hooks/useTheme';
+import useThemeStyles from '../hooks/useThemeStyles';
 import HeaderPageLayout from './HeaderPageLayout';
 import headerWithBackButtonPropTypes from './HeaderWithBackButton/headerWithBackButtonPropTypes';
 import Lottie from './Lottie';

src/components/MenuItem.js

@@ -84,7 +84,6 @@ const defaultProps = {
     shouldShowRightComponent: false,
     titleWithTooltips: [],
     shouldCheckActionAllowedOnPress: true,
-    isPaneMenu: false,
 };
 
 const MenuItem = React.forwardRef((props, ref) => {
@@ -235,7 +234,6 @@ const MenuItem = React.forwardRef((props, ref) => {
                                                         StyleUtils.getIconFillColor(
                                                             getButtonState(props.focused || isHovered, pressed, props.success, props.disabled, props.interactive),
                                                             true,
-                                                            props.isPaneMenu,
                                                         )
                                                     }
                                                 />
@@ -268,11 +266,7 @@ const MenuItem = React.forwardRef((props, ref) => {
                                                 height={props.iconHeight}
                                                 fill={
                                                     props.secondaryIconFill ||
-                                                    StyleUtils.getIconFillColor(
-                                                        getButtonState(props.focused || isHovered, pressed, props.success, props.disabled, props.interactive),
-                                                        true,
-                                                        props.isPaneMenu,
-                                                    )
+                                                    StyleUtils.getIconFillColor(getButtonState(props.focused || isHovered, pressed, props.success, props.disabled, props.interactive), true)
                                                 }
                                             />
                                         </View>

src/components/Search.tsx

@@ -22,42 +22,37 @@ type SearchProps = {
 
     // Styles to apply on the outer element
     style?: StyleProp<ViewStyle>;
-
-    /** Styles to apply to the outermost element */
-    containerStyle?: StyleProp<ViewStyle>;
 };
 
-function Search({onPress, placeholder, tooltip, style, containerStyle}: SearchProps) {
+function Search({onPress, placeholder, tooltip, style}: SearchProps) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
 
     return (
-        <View style={containerStyle}>
-            <Tooltip text={tooltip ?? translate('common.search')}>
-                <PressableWithFeedback
-                    accessibilityLabel={tooltip ?? translate('common.search')}
-                    role={CONST.ROLE.BUTTON}
-                    onPress={onPress}
-                    style={styles.searchPressable}
-                >
-                    {({hovered}) => (
-                        <View style={[styles.searchContainer, hovered && styles.searchContainerHovered, style]}>
-                            <Icon
-                                src={Expensicons.MagnifyingGlass}
-                                width={variables.iconSizeSmall}
-                                height={variables.iconSizeSmall}
-                            />
-                            <Text
-                                style={styles.searchInputStyle}
-                                numberOfLines={1}
-                            >
-                                {placeholder ?? translate('common.searchWithThreeDots')}
-                            </Text>
-                        </View>
-                    )}
-                </PressableWithFeedback>
-            </Tooltip>
-        </View>
+        <Tooltip text={tooltip ?? translate('common.search')}>
+            <PressableWithFeedback
+                accessibilityLabel={tooltip ?? translate('common.search')}
+                role={CONST.ROLE.BUTTON}
+                onPress={onPress}
+                style={styles.searchPressable}
+            >
+                {({hovered}) => (
+                    <View style={[styles.searchContainer, hovered && styles.searchContainerHovered, style]}>
+                        <Icon
+                            src={Expensicons.MagnifyingGlass}
+                            width={variables.iconSizeSmall}
+                            height={variables.iconSizeSmall}
+                        />
+                        <Text
+                            style={styles.searchInputStyle}
+                            numberOfLines={1}
+                        >
+                            {placeholder ?? translate('common.searchWithThreeDots')}
+                        </Text>
+                    </View>
+                )}
+            </PressableWithFeedback>
+        </Tooltip>
     );
 }