Adjust types to ideal nav v2

src/components/HeaderWithBackButton/types.ts

@@ -1,11 +1,10 @@
 import type {ReactNode} from 'react';
 import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
 import type {Action} from '@hooks/useSingleExecution';
-import type {AvatarSource} from '@libs/UserUtils';
 import type {StepCounterParams} from '@src/languages/types';
 import type {AnchorPosition} from '@src/styles';
 import type {PersonalDetails, Policy, Report} from '@src/types/onyx';
-import {Icon} from '@src/types/onyx/OnyxCommon';
+import type {Icon} from '@src/types/onyx/OnyxCommon';
 import type ChildrenProps from '@src/types/utils/ChildrenProps';
 import type IconAsset from '@src/types/utils/IconAsset';
 

src/components/Indicator.tsx

@@ -86,6 +86,7 @@ export default withOnyx<IndicatorProps, IndicatorOnyxProps>({
     bankAccountList: {
         key: ONYXKEYS.BANK_ACCOUNT_LIST,
     },
+    // @ts-expect-error: ONYXKEYS.REIMBURSEMENT_ACCOUNT is conflicting with ONYXKEYS.FORMS.REIMBURSEMENT_ACCOUNT_FORM
     reimbursementAccount: {
         key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
     },

src/languages/en.ts

@@ -875,7 +875,6 @@ export default {
         accountSettings: 'Account Settings',
         account: 'Account',
         general: 'General',
-        workspaces: 'Workspaces',
     },
     closeAccountPage: {
         closeAccount: 'Close account',

src/libs/Navigation/linkingConfig/customGetPathFromState.ts

@@ -8,7 +8,7 @@ import SCREENS from '@src/SCREENS';
 const removePolicyIDParamFromState = (state: State<RootStackParamList>) => {
     const stateCopy = _.cloneDeep(state);
     const bottomTabRoute = getTopmostBottomTabRoute(stateCopy);
-    if (bottomTabRoute?.name && [SCREENS.HOME, SCREENS.SETTINGS.ROOT].includes(bottomTabRoute?.name) && bottomTabRoute?.params && 'policyID' in bottomTabRoute?.params) {
+    if (bottomTabRoute?.name && [SCREENS.HOME, SCREENS.SETTINGS.ROOT].includes(bottomTabRoute.name) && bottomTabRoute?.params && 'policyID' in bottomTabRoute.params) {
         delete bottomTabRoute.params.policyID;
     }
     return stateCopy;

src/libs/Navigation/linkingConfig/getAdaptedStateFromPath.ts

@@ -14,7 +14,9 @@ import getMatchingBottomTabRouteForState from './getMatchingBottomTabRouteForSta
 import getMatchingCentralPaneRouteForState from './getMatchingCentralPaneRouteForState';
 import replacePathInNestedState from './replacePathInNestedState';
 
-const RHP_SCREENS_OPENED_FROM_LHN = [SCREENS.SETTINGS.SHARE_CODE, SCREENS.SETTINGS.PROFILE.STATUS];
+const RHP_SCREENS_OPENED_FROM_LHN = [SCREENS.SETTINGS.SHARE_CODE, SCREENS.SETTINGS.PROFILE.STATUS] as const;
+
+type RHPScreenOpenedFromLHN = (typeof RHP_SCREENS_OPENED_FROM_LHN)[number];
 
 type Metainfo = {
     // Sometimes modal screens don't have information about what should be visible under the overlay.
@@ -162,7 +164,7 @@ function getAdaptedState(state: PartialState<NavigationState<RootStackParamList>
 
         if (topmostNestedRHPRoute) {
             let matchingRootRoute = getMatchingRootRouteForRHPRoute(topmostNestedRHPRoute, policyID);
-            const isRHPScreenOpenedFromLHN = topmostNestedRHPRoute?.name && RHP_SCREENS_OPENED_FROM_LHN.includes(topmostNestedRHPRoute?.name);
+            const isRHPScreenOpenedFromLHN = topmostNestedRHPRoute?.name && RHP_SCREENS_OPENED_FROM_LHN.includes(topmostNestedRHPRoute?.name as RHPScreenOpenedFromLHN);
             // This may happen if this RHP doens't have a route that should be under the overlay defined.
             if (!matchingRootRoute || isRHPScreenOpenedFromLHN) {
                 metainfo.isCentralPaneAndBottomTabMandatory = false;

src/libs/Navigation/switchPolicyID.ts

@@ -61,7 +61,7 @@ function getActionForBottomTabNavigator(action: StackNavigationAction, state: Na
     };
 }
 
-export default function switchPolicyID(navigation: NavigationContainerRef<RootStackParamList> | null, {policyID, route, isPolicyAdmin = false}: SwitchPolicyIDParams) {
+export default function switchPolicyID(navigation: NavigationContainerRef<RootStackParamList> | null, {policyID, route}: SwitchPolicyIDParams) {
     if (!navigation) {
         throw new Error("Couldn't find a navigation object. Is your component inside a screen in a navigator?");
     }
@@ -121,23 +121,12 @@ export default function switchPolicyID(navigation: NavigationContainerRef<RootSt
                 params.policyID = policyID;
             }
 
-            // We need to redirect non admin users to profile screen, when switching workspace.
-            // if (!isPolicyAdmin && isWorkspaceScreen && screen !== SCREENS.WORKSPACE.PROFILE) {
-            //     screen = SCREENS.WORKSPACE.PROFILE;
-            // }
-
             // If the user is on the home page and changes the current workspace, then should be displayed a report from the selected workspace.
             // To achieve that, it's necessary to navigate without the reportID param.
             if (checkIfActionPayloadNameIsEqual(actionForBottomTabNavigator, SCREENS.HOME)) {
                 delete params.reportID;
             }
 
-            // When the user from the screen with the workspaces list opens the specific workspace from the switcher, the appropriate settings screen has to be pushed to the CentralPane.
-            // if (screen === SCREENS.SETTINGS.WORKSPACES && policyID) {
-            //     screen = TAB_TO_CENTRAL_PANE_MAPPING[SCREENS.WORKSPACE.INITIAL][0];
-            //     params.policyID = policyID;
-            // }
-
             root.dispatch({
                 type: CONST.NAVIGATION.ACTION_TYPE.PUSH,
                 payload: {

src/libs/Navigation/types.ts

@@ -624,4 +624,5 @@ export type {
     OnboardEngagementNavigatorParamList,
     SwitchPolicyIDParams,
     FullScreenNavigatorParamList,
+    WorkspacesCentralPaneNavigatorParamList,
 };

src/pages/WorkspaceSwitcherPage.tsx

@@ -102,7 +102,7 @@ function WorkspaceSwitcherPage({policies}: WorkspaceSwitcherPageProps) {
                 return;
             }
 
-            const {policyID, isPolicyAdmin} = option;
+            const {policyID} = option;
 
             if (policyID) {
                 setSelectedOption(option);
@@ -112,7 +112,7 @@ function WorkspaceSwitcherPage({policies}: WorkspaceSwitcherPageProps) {
             setActiveWorkspaceID(policyID);
             Navigation.goBack();
             if (policyID !== activeWorkspaceID) {
-                Navigation.navigateWithSwitchPolicyID({policyID, isPolicyAdmin});
+                Navigation.navigateWithSwitchPolicyID({policyID});
             }
         },
         [activeWorkspaceID, setActiveWorkspaceID],

src/pages/home/sidebar/SidebarLinks.js

@@ -1,11 +1,8 @@
 /* eslint-disable rulesdir/onyx-props-must-have-default */
-import lodashGet from 'lodash/get';
 import PropTypes from 'prop-types';
 import React, {useCallback, useEffect, useMemo, useRef} from 'react';
 import {InteractionManager, StyleSheet, View} from 'react-native';
-import {withOnyx} from 'react-native-onyx';
 import _ from 'underscore';
-import Breadcrumbs from '@components/Breadcrumbs';
 import LHNOptionsList from '@components/LHNOptionsList/LHNOptionsList';
 import OptionsListSkeletonView from '@components/OptionsListSkeletonView';
 import useLocalize from '@hooks/useLocalize';
@@ -43,11 +40,11 @@ const propTypes = {
     isActiveReport: PropTypes.func.isRequired,
 };
 
-function SidebarLinks({onLinkClick, insets, optionListItems, isLoading, priorityMode = CONST.PRIORITY_MODE.DEFAULT, isActiveReport, isCreateMenuOpen, activePolicy}) {
+function SidebarLinks({onLinkClick, insets, optionListItems, isLoading, priorityMode = CONST.PRIORITY_MODE.DEFAULT, isActiveReport, isCreateMenuOpen}) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const modal = useRef({});
-    const {translate, updateLocale} = useLocalize();
+    const {updateLocale} = useLocalize();
     const {isSmallScreenWidth} = useWindowDimensions();
 
     useEffect(() => {
@@ -152,9 +149,5 @@ function SidebarLinks({onLinkClick, insets, optionListItems, isLoading, priority
 SidebarLinks.propTypes = propTypes;
 SidebarLinks.displayName = 'SidebarLinks';
 
-export default withOnyx({
-    activePolicy: {
-        key: ({activeWorkspaceID}) => `${ONYXKEYS.COLLECTION.POLICY}${activeWorkspaceID}`,
-    },
-})(SidebarLinks);
+export default SidebarLinks;
 export {basePropTypes};

src/pages/settings/InitialSettingsPage.tsx

@@ -169,47 +169,47 @@ function InitialSettingsPage({session, userWallet, bankAccountList, fundList, wa
         };
     }, [loginList, fundList, styles.accountSettingsSectionContainer, bankAccountList, userWallet?.errors, walletTerms?.errors]);
 
-    const workspaceMenuItemsData: Menu = useMemo(
-        () => ({
-            sectionStyle: {
-                ...styles.pt4,
+    const workspaceMenuItemsData: Menu = useMemo(() => {
+        const items: MenuData[] = [
+            {
+                translationKey: 'common.workspaces',
+                icon: Expensicons.Building,
+                routeName: ROUTES.SETTINGS_WORKSPACES,
+                brickRoadIndicator: hasGlobalWorkspaceSettingsRBR(policies, policyMembers) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
             },
-            sectionTranslationKey: 'initialSettingsPage.workspaces',
-            items: [
-                {
-                    translationKey: 'initialSettingsPage.workspaces',
-                    icon: Expensicons.Building,
-                    routeName: ROUTES.SETTINGS_WORKSPACES,
-                    brickRoadIndicator: hasGlobalWorkspaceSettingsRBR(policies, policyMembers) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined,
+            {
+                translationKey: 'allSettingsScreen.cardsAndDomains',
+                icon: Expensicons.CardsAndDomains,
+                action: () => {
+                    Link.openOldDotLink(CONST.OLDDOT_URLS.ADMIN_DOMAINS_URL);
                 },
-                ...(shouldShowSubscriptionsMenu
-                    ? [
-                          {
-                              translationKey: 'allSettingsScreen.subscriptions',
-                              icon: Expensicons.MoneyBag,
-                              action: () => {
-                                  Link.openOldDotLink(CONST.OLDDOT_URLS.ADMIN_POLICIES_URL);
-                              },
-                              shouldShowRightIcon: true,
-                              iconRight: Expensicons.NewWindow,
-                              link: () => Link.buildOldDotURL(CONST.OLDDOT_URLS.ADMIN_POLICIES_URL),
-                          },
-                      ]
-                    : []),
-                {
-                    translationKey: 'allSettingsScreen.cardsAndDomains',
-                    icon: Expensicons.CardsAndDomains,
-                    action: () => {
-                        Link.openOldDotLink(CONST.OLDDOT_URLS.ADMIN_DOMAINS_URL);
-                    },
-                    shouldShowRightIcon: true,
-                    iconRight: Expensicons.NewWindow,
-                    link: () => Link.buildOldDotURL(CONST.OLDDOT_URLS.ADMIN_DOMAINS_URL),
+                shouldShowRightIcon: true,
+                iconRight: Expensicons.NewWindow,
+                link: () => Link.buildOldDotURL(CONST.OLDDOT_URLS.ADMIN_DOMAINS_URL),
+            },
+        ];
+
+        if (shouldShowSubscriptionsMenu) {
+            items.splice(1, 0, {
+                translationKey: 'allSettingsScreen.subscriptions',
+                icon: Expensicons.MoneyBag,
+                action: () => {
+                    Link.openOldDotLink(CONST.OLDDOT_URLS.ADMIN_POLICIES_URL);
                 },
-            ],
-        }),
-        [policies, policyMembers, styles.pt4],
-    );
+                shouldShowRightIcon: true,
+                iconRight: Expensicons.NewWindow,
+                link: () => Link.buildOldDotURL(CONST.OLDDOT_URLS.ADMIN_POLICIES_URL),
+            });
+        }
+
+        return {
+            sectionStyle: {
+                ...styles.pt4,
+            },
+            sectionTranslationKey: 'common.workspaces',
+            items,
+        };
+    }, [policies, policyMembers, styles.pt4]);
 
     /**
      * Retuns a list of menu items data for general section
@@ -271,7 +271,7 @@ function InitialSettingsPage({session, userWallet, bankAccountList, fundList, wa
                 ...defaultMenu.items,
             ].filter((item) => item.translationKey !== 'initialSettingsPage.signOut' && item.translationKey !== 'exitSurvey.goToExpensifyClassic');
 
-            return {sectionStyle: styles.accountSettingsSectionContainer, sectionTranslationKey: 'initialSettingsPage.account', items: hybridAppMenuItems};
+            return {sectionStyle: styles.accountSettingsSectionContainer, sectionTranslationKey: 'initialSettingsPage.general', items: hybridAppMenuItems};
         }
 
         return defaultMenu;

src/pages/workspace/WorkspaceInitialPage.tsx

@@ -2,18 +2,16 @@ import {useNavigationState} from '@react-navigation/native';
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useCallback, useEffect, useMemo, useState} from 'react';
 import {ScrollView, View} from 'react-native';
-import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
+import {withOnyx} from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
-import Breadcrumbs from '@components/Breadcrumbs';
 import ConfirmModal from '@components/ConfirmModal';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import * as Expensicons from '@components/Icon/Expensicons';
 import MenuItem from '@components/MenuItem';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
 import ScreenWrapper from '@components/ScreenWrapper';
-import useActiveRoute from '@hooks/useActiveRoute';
 import useLocalize from '@hooks/useLocalize';
 import usePrevious from '@hooks/usePrevious';
 import useSingleExecution from '@hooks/useSingleExecution';
@@ -220,7 +218,6 @@ function WorkspaceInitialPage({policyDraft, policy: policyProp, policyMembers, r
                 subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
             >
                 <HeaderWithBackButton
-                    // style={[styles.ph5, styles.mb5]}
                     title={policyName}
                     onBackButtonPress={Navigation.dismissModal}
                     policyAvatar={policyAvatar}

src/pages/workspace/WorkspaceMembersPage.tsx

@@ -29,7 +29,7 @@ import useWindowDimensions from '@hooks/useWindowDimensions';
 import * as DeviceCapabilities from '@libs/DeviceCapabilities';
 import Log from '@libs/Log';
 import Navigation from '@libs/Navigation/Navigation';
-import type {CentralPaneNavigatorParamList} from '@libs/Navigation/types';
+import type {WorkspacesCentralPaneNavigatorParamList} from '@libs/Navigation/types';
 import * as OptionsListUtils from '@libs/OptionsListUtils';
 import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils';
 import * as PolicyUtils from '@libs/PolicyUtils';
@@ -55,7 +55,7 @@ type WorkspaceMembersPageOnyxProps = {
 type WorkspaceMembersPageProps = WithPolicyAndFullscreenLoadingProps &
     WithCurrentUserPersonalDetailsProps &
     WorkspaceMembersPageOnyxProps &
-    StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.MEMBERS>;
+    StackScreenProps<WorkspacesCentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.MEMBERS>;
 
 /**
  * Inverts an object, equivalent of _.invert

src/pages/workspace/bills/WorkspaceBillsPage.tsx

@@ -4,14 +4,14 @@ import {View} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
-import type {CentralPaneNavigatorParamList} from '@navigation/types';
+import type {WorkspacesCentralPaneNavigatorParamList} from '@navigation/types';
 import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
 import WorkspaceBillsNoVBAView from './WorkspaceBillsNoVBAView';
 import WorkspaceBillsVBAView from './WorkspaceBillsVBAView';
 
-type WorkspaceBillsPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.BILLS>;
+type WorkspaceBillsPageProps = StackScreenProps<WorkspacesCentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.BILLS>;
 
 function WorkspaceBillsPage({route}: WorkspaceBillsPageProps) {
     const {translate} = useLocalize();

src/pages/workspace/card/WorkspaceCardPage.tsx

@@ -4,15 +4,15 @@ import {View} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
-import type {CentralPaneNavigatorParamList} from '@libs/Navigation/types';
+import type {WorkspacesCentralPaneNavigatorParamList} from '@libs/Navigation/types';
 import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
 import WorkspaceCardNoVBAView from './WorkspaceCardNoVBAView';
 import WorkspaceCardVBANoECardView from './WorkspaceCardVBANoECardView';
 import WorkspaceCardVBAWithECardView from './WorkspaceCardVBAWithECardView';
 
-type WorkspaceCardPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CARD>;
+type WorkspaceCardPageProps = StackScreenProps<WorkspacesCentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CARD>;
 
 function WorkspaceCardPage({route}: WorkspaceCardPageProps) {
     const {translate} = useLocalize();

src/pages/workspace/categories/WorkspaceCategoriesPage.tsx

@@ -1,8 +1,8 @@
 import type {StackScreenProps} from '@react-navigation/stack';
 import React, {useMemo, useState} from 'react';
 import {View} from 'react-native';
-import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
+import {withOnyx} from 'react-native-onyx';
 import Button from '@components/Button';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import Icon from '@components/Icon';
@@ -18,7 +18,7 @@ import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
 import Navigation from '@libs/Navigation/Navigation';
-import type {CentralPaneNavigatorParamList} from '@navigation/types';
+import type {WorkspacesCentralPaneNavigatorParamList} from '@navigation/types';
 import AdminPolicyAccessOrNotFoundWrapper from '@pages/workspace/AdminPolicyAccessOrNotFoundWrapper';
 import PaidPolicyAccessOrNotFoundWrapper from '@pages/workspace/PaidPolicyAccessOrNotFoundWrapper';
 import ONYXKEYS from '@src/ONYXKEYS';
@@ -39,7 +39,7 @@ type WorkspaceCategoriesOnyxProps = {
     policyCategories: OnyxEntry<OnyxTypes.PolicyCategories>;
 };
 
-type WorkspaceCategoriesPageProps = WorkspaceCategoriesOnyxProps & StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
+type WorkspaceCategoriesPageProps = WorkspaceCategoriesOnyxProps & StackScreenProps<WorkspacesCentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.CATEGORIES>;
 
 function WorkspaceCategoriesPage({policyCategories, route}: WorkspaceCategoriesPageProps) {
     const {isSmallScreenWidth} = useWindowDimensions();

src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx

@@ -4,14 +4,14 @@ import {View} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWindowDimensions from '@hooks/useWindowDimensions';
-import type {CentralPaneNavigatorParamList} from '@navigation/types';
+import type {WorkspacesCentralPaneNavigatorParamList} from '@navigation/types';
 import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections';
 import CONST from '@src/CONST';
 import type SCREENS from '@src/SCREENS';
 import WorkspaceInvoicesNoVBAView from './WorkspaceInvoicesNoVBAView';
 import WorkspaceInvoicesVBAView from './WorkspaceInvoicesVBAView';
 
-type WorkspaceInvoicesPageProps = StackScreenProps<CentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.INVOICES>;
+type WorkspaceInvoicesPageProps = StackScreenProps<WorkspacesCentralPaneNavigatorParamList, typeof SCREENS.WORKSPACE.INVOICES>;
 
 function WorkspaceInvoicesPage({route}: WorkspaceInvoicesPageProps) {
     const {translate} = useLocalize();