From 476eeda40cb165d6fa6b7f38dfaebbf9255442b1 Mon Sep 17 00:00:00 2001 From: Mateusz Rajski Date: Thu, 21 Dec 2023 22:18:14 +0100 Subject: [PATCH] Move switcher to LHP --- src/SCREENS.ts | 2 +- src/components/EnvironmentBadge.tsx | 5 - .../Navigators/LeftModalNavigator.tsx | 4 + .../Navigators/RightModalNavigator.tsx | 4 - .../createCustomBottomTabNavigator/TopBar.js | 7 +- src/libs/Navigation/linkingConfig.ts | 16 ++-- src/libs/Navigation/types.ts | 2 +- src/pages/WorkspaceSwitcherPage.js | 95 ++++++++++++------- 8 files changed, 82 insertions(+), 53 deletions(-) diff --git a/src/SCREENS.ts b/src/SCREENS.ts index 067d3728663f..e3b5aae0d752 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -85,6 +85,7 @@ const SCREENS = { }, LEFT_MODAL: { SEARCH: 'Search', + WORKSPACE_SWITCHER: 'WorkspaceSwitcher', }, WORKSPACE_SWITCHER: { ROOT: 'WorkspaceSwitcher_Root', @@ -113,7 +114,6 @@ const SCREENS = { ROOM_MEMBERS: 'RoomMembers', ROOM_INVITE: 'RoomInvite', REFERRAL: 'Referral', - WORKSPACE_SWITCHER: 'WorkspaceSwitcher', }, SIGN_IN_WITH_APPLE_DESKTOP: 'AppleSignInDesktop', SIGN_IN_WITH_GOOGLE_DESKTOP: 'GoogleSignInDesktop', diff --git a/src/components/EnvironmentBadge.tsx b/src/components/EnvironmentBadge.tsx index d2d4b0ccfa0f..782144414688 100644 --- a/src/components/EnvironmentBadge.tsx +++ b/src/components/EnvironmentBadge.tsx @@ -2,9 +2,7 @@ import React from 'react'; import useEnvironment from '@hooks/useEnvironment'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Environment from '@libs/Environment/Environment'; -import Navigation from '@libs/Navigation/Navigation'; import CONST from '@src/CONST'; -import ROUTES from '@src/ROUTES'; import pkg from '../../package.json'; import Badge from './Badge'; @@ -35,9 +33,6 @@ function EnvironmentBadge() { textStyles={[styles.headerEnvBadgeText]} environment={environment} pressable - onPress={() => { - Navigation.navigate(ROUTES.WORKSPACE_SWITCHER); - }} /> ); } diff --git a/src/libs/Navigation/AppNavigator/Navigators/LeftModalNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/LeftModalNavigator.tsx index b7385c930e2c..11fef951a28b 100644 --- a/src/libs/Navigation/AppNavigator/Navigators/LeftModalNavigator.tsx +++ b/src/libs/Navigation/AppNavigator/Navigators/LeftModalNavigator.tsx @@ -34,6 +34,10 @@ function LeftModalNavigator({navigation}: LeftModalNavigatorProps) { name={SCREENS.LEFT_MODAL.SEARCH} component={ModalStackNavigators.SearchModalStackNavigator} /> + diff --git a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx index 7a58a4d29c22..d7c31bcae7d9 100644 --- a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx +++ b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx @@ -29,10 +29,6 @@ function RightModalNavigator({navigation}: RightModalNavigatorProps) { name={SCREENS.RIGHT_MODAL.SETTINGS} component={ModalStackNavigators.SettingsModalStackNavigator} /> - - + { + Navigation.navigate(ROUTES.WORKSPACE_SWITCHER); + }} + > = { [SCREENS.SEARCH_ROOT]: ROUTES.SEARCH, }, }, + [SCREENS.LEFT_MODAL.WORKSPACE_SWITCHER]: { + screens: { + [SCREENS.WORKSPACE_SWITCHER.ROOT]: { + path: ROUTES.WORKSPACE_SWITCHER, + }, + }, + }, }, }, [NAVIGATORS.RIGHT_MODAL_NAVIGATOR]: { @@ -256,14 +263,7 @@ const linkingConfig: LinkingOptions = { }, [SCREENS.WORKSPACE.NAME]: ROUTES.WORKSPACE_NAME.route, }, - }, - [SCREENS.RIGHT_MODAL.WORKSPACE_SWITCHER]: { - screens: { - [SCREENS.WORKSPACE_SWITCHER.ROOT]: { - path: ROUTES.WORKSPACE_SWITCHER, - }, - }, - }, + }, [SCREENS.RIGHT_MODAL.PRIVATE_NOTES]: { screens: { [SCREENS.PRIVATE_NOTES.VIEW]: ROUTES.PRIVATE_NOTES_VIEW.route, diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index ef1f538fb9e5..c7fd33f904f7 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -355,6 +355,7 @@ type PrivateNotesNavigatorParamList = { type LeftModalNavigatorParamList = { [SCREENS.LEFT_MODAL.SEARCH]: NavigatorScreenParams; + [SCREENS.LEFT_MODAL.WORKSPACE_SWITCHER]: NavigatorScreenParams; }; type RightModalNavigatorParamList = { @@ -381,7 +382,6 @@ type RightModalNavigatorParamList = { [SCREENS.RIGHT_MODAL.SIGN_IN]: NavigatorScreenParams; [SCREENS.RIGHT_MODAL.REFERRAL]: NavigatorScreenParams; [SCREENS.RIGHT_MODAL.PRIVATE_NOTES]: NavigatorScreenParams; - [SCREENS.RIGHT_MODAL.WORKSPACE_SWITCHER]: NavigatorScreenParams; }; type SettingsCentralPaneNavigatorParamList = { diff --git a/src/pages/WorkspaceSwitcherPage.js b/src/pages/WorkspaceSwitcherPage.js index 3fd52455eb69..28386617eca5 100644 --- a/src/pages/WorkspaceSwitcherPage.js +++ b/src/pages/WorkspaceSwitcherPage.js @@ -10,10 +10,10 @@ import OptionsSelector from '@components/OptionsSelector'; import Text from '@components/Text'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useNetwork from '@hooks/useNetwork'; -import * as PolicyUtils from '@libs/PolicyUtils'; -import * as ReportUtils from '@libs/ReportUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; +import * as PolicyUtils from '@libs/PolicyUtils'; +import * as ReportUtils from '@libs/ReportUtils'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -65,8 +65,8 @@ function WorkspaceSwitcherPage({policies, activeWorkspaceID}) { const hasUnreadData = useCallback( // TO DO: Implement checking if policy has some unread data // eslint-disable-next-line no-unused-vars - (policyId) => false, - [] + (policyId) => false, + [], ); const selectPolicy = useCallback((option) => { @@ -83,7 +83,7 @@ function WorkspaceSwitcherPage({policies, activeWorkspaceID}) { const onChangeText = useCallback((newSearchTerm) => { // TO DO: Handle searching logic setSearchTerm(newSearchTerm); - }, []) + }, []); const usersWorkspaces = useMemo( () => @@ -110,10 +110,10 @@ function WorkspaceSwitcherPage({policies, activeWorkspaceID}) { const usersWorkspacesSectionData = useMemo( () => ({ - data: usersWorkspaces, - shouldShow: true, - indexOffset: 0, - }), + data: usersWorkspaces, + shouldShow: true, + indexOffset: 0, + }), [usersWorkspaces], ); @@ -153,13 +153,25 @@ function WorkspaceSwitcherPage({policies, activeWorkspaceID}) { ); - }, [activeWorkspaceID, getIndicatorTypeForPolicy, hasUnreadData, selectPolicy, styles.alignItemsCenter, styles.flexRow, styles.justifyContentBetween, styles.label, styles.mb3, styles.mh4, theme.textSupporting]); + }, [ + activeWorkspaceID, + getIndicatorTypeForPolicy, + hasUnreadData, + selectPolicy, + styles.alignItemsCenter, + styles.flexRow, + styles.justifyContentBetween, + styles.label, + styles.mb3, + styles.mh4, + theme.textSupporting, + ]); const inputCallbackRef = useAutoFocusInput(); const workspacesSection = useMemo( () => ( <> - + - {/* TO DO: Display breadcrumb */} - {usersWorkspacesSectionData.data.length === 0 && } - 8} - onChangeText={onChangeText} - selectedOptions={selectedOption ? [selectedOption] : []} - onSelectRow={selectPolicy} - boldStyle - shouldPreventDefaultFocusOnSelectRow - highlightSelectedOptions - shouldShowOptions - autoFocus={false} - disableFocusOptions - canSelectMultipleOptions={false} - shouldShowSubscript={false} - showTitleTooltip={false} - contentContainerStyles={[styles.pt0, styles.mt0]} + {/* TO DO: Display breadcrumb */} + {usersWorkspacesSectionData.data.length === 0 && } + 8} + onChangeText={onChangeText} + selectedOptions={selectedOption ? [selectedOption] : []} + onSelectRow={selectPolicy} + boldStyle + shouldPreventDefaultFocusOnSelectRow + highlightSelectedOptions + shouldShowOptions + autoFocus={false} + disableFocusOptions + canSelectMultipleOptions={false} + shouldShowSubscript={false} + showTitleTooltip={false} + contentContainerStyles={[styles.pt0, styles.mt0]} /> - + ), - [inputCallbackRef, onChangeText, searchTerm, selectPolicy, selectedOption, styles.alignItemsCenter, styles.flexRow, styles.justifyContentBetween, styles.label, styles.mb1, styles.mh4, styles.mt0, styles.mt3, styles.pt0, theme.textSupporting, usersWorkspacesSectionData], + [ + inputCallbackRef, + onChangeText, + searchTerm, + selectPolicy, + selectedOption, + styles.alignItemsCenter, + styles.flexRow, + styles.justifyContentBetween, + styles.label, + styles.mb1, + styles.mh4, + styles.mt0, + styles.mt3, + styles.pt0, + theme.textSupporting, + usersWorkspacesSectionData, + ], ); useEffect(() => {