diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 419bc2917c1e..9715f73423b2 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -449,6 +449,54 @@ const ROUTES = { getRoute: (action: IOUAction, iouType: IOUType, transactionID: string, reportID: string, backTo = '', reportActionID?: string) => getUrlWithBackToParam(`${action as string}/${iouType as string}/category/${transactionID}/${reportID}${reportActionID ? `/${reportActionID}` : ''}`, backTo), }, + SETTINGS_TAGS_ROOT: { + route: 'settings/:policyID/tags', + getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tags`, backTo), + }, + SETTINGS_TAGS_SETTINGS: { + route: 'settings/:policyID/tags/settings', + getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tags/settings` as const, backTo), + }, + SETTINGS_TAGS_EDIT: { + route: 'settings/:policyID/tags/:orderWeight/edit', + getRoute: (policyID: string, orderWeight: number, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tags/${orderWeight}/edit` as const, backTo), + }, + SETTINGS_TAG_CREATE: { + route: 'settings/:policyID/tags/new', + getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tags/new` as const, backTo), + }, + SETTINGS_TAG_EDIT: { + route: 'settings/:policyID/tag/:orderWeight/:tagName/edit', + getRoute: (policyID: string, orderWeight: number, tagName: string, backTo = '') => + getUrlWithBackToParam(`settings/${policyID}/tag/${orderWeight}/${encodeURIComponent(tagName)}/edit` as const, backTo), + }, + SETTINGS_TAG_SETTINGS: { + route: 'settings/:policyID/tag/:orderWeight/:tagName', + getRoute: (policyID: string, orderWeight: number, tagName: string, backTo = '') => + getUrlWithBackToParam(`settings/${policyID}/tag/${orderWeight}/${encodeURIComponent(tagName)}` as const, backTo), + }, + SETTINGS_TAG_APPROVER: { + route: 'settings/:policyID/tag/:orderWeight/:tagName/approver', + getRoute: (policyID: string, orderWeight: number, tagName: string, backTo = '') => + getUrlWithBackToParam(`settings/${policyID}/tag/${orderWeight}/${encodeURIComponent(tagName)}/approver` as const, backTo), + }, + SETTINGS_TAG_LIST_VIEW: { + route: 'settings/:policyID/tag-list/:orderWeight', + getRoute: (policyID: string, orderWeight: number, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tag-list/${orderWeight}` as const, backTo), + }, + SETTINGS_TAG_GL_CODE: { + route: 'settings/:policyID/tag/:orderWeight/:tagName/gl-code', + getRoute: (policyID: string, orderWeight: number, tagName: string, backTo = '') => + getUrlWithBackToParam(`settings/${policyID}/tag/${orderWeight}/${encodeURIComponent(tagName)}/gl-code` as const, backTo), + }, + SETTINGS_TAGS_IMPORT: { + route: 'settings/:policyID/tags/import', + getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tags/import` as const, backTo), + }, + SETTINGS_TAGS_IMPORTED: { + route: 'settings/:policyID/tags/imported', + getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tags/imported` as const, backTo), + }, SETTINGS_CATEGORIES_ROOT: { route: 'settings/:policyID/categories', getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/categories`, backTo), @@ -467,7 +515,25 @@ const ROUTES = { }, SETTINGS_CATEGORY_EDIT: { route: 'settings/:policyID/category/:categoryName/edit', - getRoute: (policyID: string, categoryName: string, backTo = '') => getUrlWithBackToParam(`settings/workspaces/${policyID}/category/${encodeURIComponent(categoryName)}/edit`, backTo), + getRoute: (policyID: string, categoryName: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/category/${encodeURIComponent(categoryName)}/edit`, backTo), + }, + SETTINGS_CATEGORIES_IMPORT: { + route: 'settings/:policyID/categories/import', + getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/categories/import` as const, backTo), + }, + SETTINGS_CATEGORIES_IMPORTED: { + route: 'settings/:policyID/categories/imported', + getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/categories/imported` as const, backTo), + }, + SETTINGS_CATEGORY_PAYROLL_CODE: { + route: 'settings/:policyID/category/:categoryName/payroll-code', + getRoute: (policyID: string, categoryName: string, backTo = '') => + getUrlWithBackToParam(`settings/${policyID}/category/${encodeURIComponent(categoryName)}/payroll-code` as const, backTo), + }, + SETTINGS_CATEGORY_GL_CODE: { + route: 'settings/:policyID/category/:categoryName/gl-code', + getRoute: (policyID: string, categoryName: string, backTo = '') => + getUrlWithBackToParam(`settings/${policyID}/category/${encodeURIComponent(categoryName)}/gl-code` as const, backTo), }, MONEY_REQUEST_STEP_CURRENCY: { route: ':action/:iouType/currency/:transactionID/:reportID/:pageIndex?', @@ -519,10 +585,6 @@ const ROUTES = { getRoute: (action: IOUAction, iouType: IOUType, orderWeight: number, transactionID: string, reportID: string, backTo = '', reportActionID?: string) => getUrlWithBackToParam(`${action as string}/${iouType as string}/tag/${orderWeight}/${transactionID}/${reportID}${reportActionID ? `/${reportActionID}` : ''}`, backTo), }, - SETTINGS_TAGS_ROOT: { - route: 'settings/:policyID/tags', - getRoute: (policyID: string, backTo = '') => getUrlWithBackToParam(`settings/${policyID}/tags`, backTo), - }, MONEY_REQUEST_STEP_WAYPOINT: { route: ':action/:iouType/waypoint/:transactionID/:reportID/:pageIndex', getRoute: (action: IOUAction, iouType: IOUType, transactionID: string, reportID?: string, pageIndex = '', backTo = '') => @@ -911,7 +973,7 @@ const ROUTES = { }, WORKSPACE_TAG_APPROVER: { route: 'settings/workspaces/:policyID/tag/:orderWeight/:tagName/approver', - getRoute: (policyID: string, orderWeight: number, tagName: string) => `settings/workspaces/${policyID}/tag/${orderWeight}/${tagName}/approver` as const, + getRoute: (policyID: string, orderWeight: number, tagName: string) => `settings/workspaces/${policyID}/tag/${orderWeight}/${encodeURIComponent(tagName)}/approver` as const, }, WORKSPACE_TAG_LIST_VIEW: { route: 'settings/workspaces/:policyID/tag-list/:orderWeight', diff --git a/src/SCREENS.ts b/src/SCREENS.ts index d927162dbb42..5d7aeef36a42 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -178,6 +178,7 @@ const SCREENS = { SEARCH_ADVANCED_FILTERS: 'SearchAdvancedFilters', SEARCH_SAVED_SEARCH: 'SearchSavedSearch', SETTINGS_CATEGORIES: 'SettingsCategories', + SETTINGS_TAGS: 'SettingsTags', EXPENSIFY_CARD: 'ExpensifyCard', DOMAIN_CARD: 'DomainCard', RESTRICTED_ACTION: 'RestrictedAction', @@ -247,6 +248,10 @@ const SCREENS = { SETTINGS_CATEGORY_CREATE: 'Settings_Category_Create', SETTINGS_CATEGORY_EDIT: 'Settings_Category_Edit', SETTINGS_CATEGORIES_ROOT: 'Settings_Categories', + SETTINGS_CATEGORIES_IMPORT: 'Settings_Categories_Import', + SETTINGS_CATEGORIES_IMPORTED: 'Settings_Categories_Imported', + SETTINGS_CATEGORY_PAYROLL_CODE: 'Settings_Category_Payroll_Code', + SETTINGS_CATEGORY_GL_CODE: 'Settings_Category_GL_Code', }, EXPENSIFY_CARD: { EXPENSIFY_CARD_DETAILS: 'Expensify_Card_Details', @@ -259,7 +264,19 @@ const SCREENS = { DOMAIN_CARD_REPORT_FRAUD: 'Domain_Card_Report_Fraud', }, - SETTINGS_TAGS_ROOT: 'Settings_Tags', + SETTINGS_TAGS: { + SETTINGS_TAGS_ROOT: 'Settings_Tags', + SETTINGS_TAGS_SETTINGS: 'Settings_Tags_Settings', + SETTINGS_TAGS_EDIT: 'Settings_Tags_Edit', + SETTINGS_TAG_CREATE: 'Settings_Tag_Create', + SETTINGS_TAG_EDIT: 'Settings_Tag_Edit', + SETTINGS_TAG_SETTINGS: 'Settings_Tag_Settings', + SETTINGS_TAG_APPROVER: 'Settings_Tag_Approver', + SETTINGS_TAG_LIST_VIEW: 'Settings_Tag_List_View', + SETTINGS_TAG_GL_CODE: 'Settings_Tag_GL_Code', + SETTINGS_TAGS_IMPORT: 'Settings_Tags_Import', + SETTINGS_TAGS_IMPORTED: 'Settings_Tags_Imported', + }, REPORT_SETTINGS: { ROOT: 'Report_Settings_Root', diff --git a/src/components/ImportSpreadsheet.tsx b/src/components/ImportSpreadsheet.tsx index b68c773bc12d..ab0493faa2ff 100644 --- a/src/components/ImportSpreadsheet.tsx +++ b/src/components/ImportSpreadsheet.tsx @@ -167,7 +167,7 @@ function ImportSpreedsheet({backTo, goTo}: ImportSpreedsheetProps) { Navigation.navigate(backTo)} + onBackButtonPress={() => Navigation.goBack(backTo)} /> diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx index 6c209b5309f7..1ad9a7021521 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx @@ -87,7 +87,7 @@ const MoneyRequestModalStackNavigator = createModalStackNavigator require('../../../../pages/iou/request/step/IOURequestStepMerchant').default, [SCREENS.MONEY_REQUEST.STEP_PARTICIPANTS]: () => require('../../../../pages/iou/request/step/IOURequestStepParticipants').default, [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORIES_ROOT]: () => require('../../../../pages/workspace/categories/WorkspaceCategoriesPage').default, - [SCREENS.SETTINGS_TAGS_ROOT]: () => require('../../../../pages/workspace/tags/WorkspaceTagsPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_ROOT]: () => require('../../../../pages/workspace/tags/WorkspaceTagsPage').default, [SCREENS.MONEY_REQUEST.STEP_SCAN]: () => require('../../../../pages/iou/request/step/IOURequestStepScan').default, [SCREENS.MONEY_REQUEST.STEP_TAG]: () => require('../../../../pages/iou/request/step/IOURequestStepTag').default, [SCREENS.MONEY_REQUEST.STEP_WAYPOINT]: () => require('../../../../pages/iou/request/step/IOURequestStepWaypoint').default, @@ -142,6 +142,23 @@ const CategoriesModalStackNavigator = createModalStackNavigator({ [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORY_CREATE]: () => require('../../../../pages/workspace/categories/CreateCategoryPage').default, [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORY_EDIT]: () => require('../../../../pages/workspace/categories/EditCategoryPage').default, [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORY_SETTINGS]: () => require('../../../../pages/workspace/categories/CategorySettingsPage').default, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORIES_IMPORT]: () => require('../../../../pages/workspace/categories/ImportCategoriesPage').default, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORIES_IMPORTED]: () => require('../../../../pages/workspace/categories/ImportedCategoriesPage').default, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORY_PAYROLL_CODE]: () => require('../../../../pages/workspace/categories/CategoryPayrollCodePage').default, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORY_GL_CODE]: () => require('../../../../pages/workspace/categories/CategoryGLCodePage').default, +}); + +const TagsModalStackNavigator = createModalStackNavigator({ + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_SETTINGS]: () => require('../../../../pages/workspace/tags/WorkspaceTagsSettingsPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_EDIT]: () => require('../../../../pages/workspace/tags/WorkspaceEditTagsPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_IMPORT]: () => require('../../../../pages/workspace/tags/ImportTagsPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_IMPORTED]: () => require('../../../../pages/workspace/tags/ImportedTagsPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_SETTINGS]: () => require('../../../../pages/workspace/tags/TagSettingsPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_LIST_VIEW]: () => require('../../../../pages/workspace/tags/WorkspaceViewTagsPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_CREATE]: () => require('../../../../pages/workspace/tags/WorkspaceCreateTagPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_EDIT]: () => require('../../../../pages/workspace/tags/EditTagPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_APPROVER]: () => require('../../../../pages/workspace/tags/TagApproverPage').default, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_GL_CODE]: () => require('../../../../pages/workspace/tags/TagGLCodePage').default, }); const ExpensifyCardModalStackNavigator = createModalStackNavigator({ @@ -640,6 +657,7 @@ export { SettingsModalStackNavigator, SignInModalStackNavigator, CategoriesModalStackNavigator, + TagsModalStackNavigator, ExpensifyCardModalStackNavigator, DomainCardModalStackNavigator, SplitDetailsModalStackNavigator, diff --git a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx index 0df3ae3f4b92..da1ce32bf747 100644 --- a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx +++ b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx @@ -103,6 +103,10 @@ function RightModalNavigator({navigation, route}: RightModalNavigatorProps) { name={SCREENS.RIGHT_MODAL.SETTINGS_CATEGORIES} component={ModalStackNavigators.CategoriesModalStackNavigator} /> + ['config'] = { categoryName: (categoryName: string) => decodeURIComponent(categoryName), }, }, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORIES_IMPORT]: { + path: ROUTES.SETTINGS_CATEGORIES_IMPORT.route, + }, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORIES_IMPORTED]: { + path: ROUTES.SETTINGS_CATEGORIES_IMPORTED.route, + }, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORY_PAYROLL_CODE]: { + path: ROUTES.SETTINGS_CATEGORY_PAYROLL_CODE.route, + parse: { + categoryName: (categoryName: string) => decodeURIComponent(categoryName), + }, + }, + [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORY_GL_CODE]: { + path: ROUTES.SETTINGS_CATEGORY_GL_CODE.route, + parse: { + categoryName: (categoryName: string) => decodeURIComponent(categoryName), + }, + }, + }, + }, + [SCREENS.RIGHT_MODAL.SETTINGS_TAGS]: { + screens: { + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_SETTINGS]: { + path: ROUTES.SETTINGS_TAGS_SETTINGS.route, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_EDIT]: { + path: ROUTES.SETTINGS_TAGS_EDIT.route, + parse: { + orderWeight: Number, + }, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_CREATE]: { + path: ROUTES.SETTINGS_TAG_CREATE.route, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_EDIT]: { + path: ROUTES.SETTINGS_TAG_EDIT.route, + parse: { + orderWeight: Number, + tagName: (tagName: string) => decodeURIComponent(tagName), + }, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_SETTINGS]: { + path: ROUTES.SETTINGS_TAG_SETTINGS.route, + parse: { + orderWeight: Number, + tagName: (tagName: string) => decodeURIComponent(tagName), + }, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_APPROVER]: { + path: ROUTES.SETTINGS_TAG_APPROVER.route, + parse: { + orderWeight: Number, + tagName: (tagName: string) => decodeURIComponent(tagName), + }, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_LIST_VIEW]: { + path: ROUTES.SETTINGS_TAG_LIST_VIEW.route, + parse: { + orderWeight: Number, + }, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAG_GL_CODE]: { + path: ROUTES.SETTINGS_TAG_GL_CODE.route, + parse: { + orderWeight: Number, + tagName: (tagName: string) => decodeURIComponent(tagName), + }, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_IMPORT]: { + path: ROUTES.SETTINGS_TAGS_IMPORT.route, + }, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_IMPORTED]: { + path: ROUTES.SETTINGS_TAGS_IMPORTED.route, + }, }, }, [SCREENS.RIGHT_MODAL.EXPENSIFY_CARD]: { @@ -1078,7 +1152,7 @@ const config: LinkingOptions['config'] = { }, }, [SCREENS.SETTINGS_CATEGORIES.SETTINGS_CATEGORIES_ROOT]: ROUTES.SETTINGS_CATEGORIES_ROOT.route, - [SCREENS.SETTINGS_TAGS_ROOT]: ROUTES.SETTINGS_TAGS_ROOT.route, + [SCREENS.SETTINGS_TAGS.SETTINGS_TAGS_ROOT]: ROUTES.SETTINGS_TAGS_ROOT.route, [SCREENS.MONEY_REQUEST.STEP_SEND_FROM]: ROUTES.MONEY_REQUEST_STEP_SEND_FROM.route, [SCREENS.MONEY_REQUEST.STEP_COMPANY_INFO]: ROUTES.MONEY_REQUEST_STEP_COMPANY_INFO.route, [SCREENS.MONEY_REQUEST.STEP_AMOUNT]: ROUTES.MONEY_REQUEST_STEP_AMOUNT.route, diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index c48786ca1428..6af44de8867e 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -210,10 +210,12 @@ type SettingsNavigatorParamList = { [SCREENS.WORKSPACE.CATEGORY_PAYROLL_CODE]: { policyID: string; categoryName: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.CATEGORY_GL_CODE]: { policyID: string; categoryName: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.CATEGORY_DEFAULT_TAX_RATE]: { policyID: string; @@ -251,12 +253,15 @@ type SettingsNavigatorParamList = { }; [SCREENS.WORKSPACE.CATEGORIES_IMPORT]: { policyID: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.CATEGORIES_IMPORTED]: { policyID: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAG_CREATE]: { policyID: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.DISTANCE_RATE_DETAILS]: { policyID: string; @@ -276,40 +281,49 @@ type SettingsNavigatorParamList = { }; [SCREENS.WORKSPACE.TAGS_SETTINGS]: { policyID: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAGS_IMPORT]: { policyID: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAGS_IMPORTED]: { policyID: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAG_SETTINGS]: { policyID: string; orderWeight: number; tagName: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAG_LIST_VIEW]: { policyID: string; orderWeight: number; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAGS_EDIT]: { policyID: string; orderWeight: number; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAG_EDIT]: { policyID: string; orderWeight: number; tagName: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAG_APPROVER]: { policyID: string; orderWeight: number; tagName: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAG_GL_CODE]: { policyID: string; orderWeight: number; tagName: string; + backTo?: Routes; }; [SCREENS.SETTINGS.SUBSCRIPTION.ROOT]: undefined; [SCREENS.SETTINGS.SUBSCRIPTION.SIZE]: { @@ -1278,6 +1292,7 @@ type RightModalNavigatorParamList = { [SCREENS.RIGHT_MODAL.REPORT_DETAILS]: NavigatorScreenParams; [SCREENS.RIGHT_MODAL.REPORT_SETTINGS]: NavigatorScreenParams; [SCREENS.RIGHT_MODAL.SETTINGS_CATEGORIES]: NavigatorScreenParams; + [SCREENS.RIGHT_MODAL.SETTINGS_TAGS]: NavigatorScreenParams; [SCREENS.RIGHT_MODAL.EXPENSIFY_CARD]: NavigatorScreenParams; [SCREENS.RIGHT_MODAL.DOMAIN_CARD]: NavigatorScreenParams; [SCREENS.RIGHT_MODAL.REPORT_DESCRIPTION]: NavigatorScreenParams; @@ -1373,6 +1388,7 @@ type FullScreenNavigatorParamList = { }; [SCREENS.WORKSPACE.TAGS]: { policyID: string; + backTo?: Routes; }; [SCREENS.WORKSPACE.TAXES]: { policyID: string; diff --git a/src/pages/workspace/categories/CategoryGLCodePage.tsx b/src/pages/workspace/categories/CategoryGLCodePage.tsx index 131f17a14242..01cb73182151 100644 --- a/src/pages/workspace/categories/CategoryGLCodePage.tsx +++ b/src/pages/workspace/categories/CategoryGLCodePage.tsx @@ -26,11 +26,13 @@ function CategoryGLCodePage({route}: EditCategoryPageProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const policyId = route.params.policyID ?? '-1'; + const backTo = route.params.backTo; const [policyCategories] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${policyId}`); const categoryName = route.params.categoryName; const glCode = policyCategories?.[categoryName]?.['GL Code']; const {inputCallbackRef} = useAutoFocusInput(); + const isQuickSettingsFlow = !!backTo; const editGLCode = useCallback( (values: FormOnyxValues) => { @@ -38,9 +40,13 @@ function CategoryGLCodePage({route}: EditCategoryPageProps) { if (newGLCode !== glCode) { Category.setPolicyCategoryGLCode(route.params.policyID, categoryName, newGLCode); } - Navigation.goBack(ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName)); + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName, backTo) + : ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName), + ); }, - [categoryName, glCode, route.params.policyID], + [categoryName, glCode, route.params.policyID, isQuickSettingsFlow, backTo], ); return ( @@ -57,7 +63,13 @@ function CategoryGLCodePage({route}: EditCategoryPageProps) { > Navigation.goBack(ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName))} + onBackButtonPress={() => + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName, backTo) + : ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName), + ) + } /> ) => { @@ -38,9 +40,13 @@ function CategoryPayrollCodePage({route}: EditCategoryPageProps) { if (newPayrollCode !== payrollCode) { Category.setPolicyCategoryPayrollCode(route.params.policyID, categoryName, newPayrollCode); } - Navigation.goBack(ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName)); + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName, backTo) + : ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName), + ); }, - [categoryName, payrollCode, route.params.policyID], + [categoryName, payrollCode, route.params.policyID, isQuickSettingsFlow, backTo], ); return ( @@ -57,7 +63,13 @@ function CategoryPayrollCodePage({route}: EditCategoryPageProps) { > Navigation.goBack(ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName))} + onBackButtonPress={() => + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName, backTo) + : ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, categoryName), + ) + } /> { - if (backTo) { - Navigation.goBack(ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(policyID, backTo)); - return; - } - Navigation.goBack(); + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(policyID, backTo) : undefined); }; useEffect(() => { @@ -117,11 +114,9 @@ function CategorySettingsPage({ }; const navigateToEditCategory = () => { - if (backTo) { - Navigation.navigate(ROUTES.SETTINGS_CATEGORY_EDIT.getRoute(policyID, policyCategory.name, backTo)); - return; - } - Navigation.navigate(ROUTES.WORKSPACE_CATEGORY_EDIT.getRoute(policyID, policyCategory.name)); + Navigation.navigate( + isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORY_EDIT.getRoute(policyID, policyCategory.name, backTo) : ROUTES.WORKSPACE_CATEGORY_EDIT.getRoute(policyID, policyCategory.name), + ); }; const deleteCategory = () => { @@ -197,12 +192,18 @@ function CategorySettingsPage({ ROUTES.WORKSPACE_UPGRADE.getRoute( policyID, CONST.UPGRADE_FEATURE_INTRO_MAPPING.glAndPayrollCodes.alias, - ROUTES.WORKSPACE_CATEGORY_GL_CODE.getRoute(policyID, policyCategory.name), + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_GL_CODE.getRoute(policyID, policyCategory.name, backTo) + : ROUTES.WORKSPACE_CATEGORY_GL_CODE.getRoute(policyID, policyCategory.name), ), ); return; } - Navigation.navigate(ROUTES.WORKSPACE_CATEGORY_GL_CODE.getRoute(policyID, policyCategory.name)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_GL_CODE.getRoute(policyID, policyCategory.name, backTo) + : ROUTES.WORKSPACE_CATEGORY_GL_CODE.getRoute(policyID, policyCategory.name), + ); }} shouldShowRightIcon /> @@ -222,7 +223,11 @@ function CategorySettingsPage({ ); return; } - Navigation.navigate(ROUTES.WORKSPACE_CATEGORY_PAYROLL_CODE.getRoute(policyID, policyCategory.name)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_PAYROLL_CODE.getRoute(policyID, policyCategory.name, backTo) + : ROUTES.WORKSPACE_CATEGORY_PAYROLL_CODE.getRoute(policyID, policyCategory.name), + ); }} shouldShowRightIcon /> diff --git a/src/pages/workspace/categories/CreateCategoryPage.tsx b/src/pages/workspace/categories/CreateCategoryPage.tsx index 472cba1215af..c862be9fc60a 100644 --- a/src/pages/workspace/categories/CreateCategoryPage.tsx +++ b/src/pages/workspace/categories/CreateCategoryPage.tsx @@ -1,7 +1,6 @@ import type {StackScreenProps} from '@react-navigation/stack'; import React, {useCallback} from 'react'; -import {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import type {FormOnyxValues} from '@components/Form/types'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; @@ -15,31 +14,23 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; -import type {PolicyCategories} from '@src/types/onyx'; import CategoryForm from './CategoryForm'; -type WorkspaceCreateCategoryPageOnyxProps = { - /** All policy categories */ - policyCategories: OnyxEntry; -}; +type CreateCategoryPageProps = StackScreenProps; -type CreateCategoryPageProps = WorkspaceCreateCategoryPageOnyxProps & StackScreenProps; - -function CreateCategoryPage({route, policyCategories}: CreateCategoryPageProps) { +function CreateCategoryPage({route}: CreateCategoryPageProps) { + const [policyCategories] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${route.params.policyID}`); const styles = useThemeStyles(); const {translate} = useLocalize(); const backTo = route.params?.backTo; + const isQuickSettingsFlow = !!backTo; const createCategory = useCallback( (values: FormOnyxValues) => { Category.createPolicyCategory(route.params.policyID, values.categoryName.trim()); - if (backTo) { - Navigation.goBack(ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(route.params.policyID, backTo)); - return; - } - Navigation.goBack(); + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(route.params.policyID, backTo) : undefined); }, - [backTo, route.params.policyID], + [isQuickSettingsFlow, route.params.policyID, backTo], ); return ( @@ -56,7 +47,7 @@ function CreateCategoryPage({route, policyCategories}: CreateCategoryPageProps) > (backTo ? Navigation.goBack(ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(route.params.policyID, backTo)) : Navigation.goBack())} + onBackButtonPress={() => Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(route.params.policyID, backTo) : undefined)} /> ({ - policyCategories: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${route?.params?.policyID}`, - }, -})(CreateCategoryPage); +export default CreateCategoryPage; diff --git a/src/pages/workspace/categories/EditCategoryPage.tsx b/src/pages/workspace/categories/EditCategoryPage.tsx index 224233fff318..330c47f0197f 100644 --- a/src/pages/workspace/categories/EditCategoryPage.tsx +++ b/src/pages/workspace/categories/EditCategoryPage.tsx @@ -1,7 +1,6 @@ import type {StackScreenProps} from '@react-navigation/stack'; import React, {useCallback} from 'react'; -import {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import type {FormInputErrors, FormOnyxValues} from '@components/Form/types'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; @@ -15,21 +14,17 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; -import type {PolicyCategories} from '@src/types/onyx'; import CategoryForm from './CategoryForm'; -type WorkspaceEditCategoryPageOnyxProps = { - /** All policy categories */ - policyCategories: OnyxEntry; -}; +type EditCategoryPageProps = StackScreenProps; -type EditCategoryPageProps = WorkspaceEditCategoryPageOnyxProps & StackScreenProps; - -function EditCategoryPage({route, policyCategories}: EditCategoryPageProps) { +function EditCategoryPage({route}: EditCategoryPageProps) { + const [policyCategories] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${route.params.policyID}`); const styles = useThemeStyles(); const {translate} = useLocalize(); const currentCategoryName = route.params.categoryName; const backTo = route.params?.backTo; + const isQuickSettingsFlow = !!backTo; const validate = useCallback( (values: FormOnyxValues) => { @@ -54,13 +49,13 @@ function EditCategoryPage({route, policyCategories}: EditCategoryPageProps) { if (currentCategoryName !== newCategoryName) { Category.renamePolicyCategory(route.params.policyID, {oldName: currentCategoryName, newName: values.categoryName}); } - if (backTo) { - Navigation.goBack(ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName, backTo)); - return; - } - Navigation.goBack(); + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName, backTo) + : ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName), + ); }, - [backTo, currentCategoryName, route.params.categoryName, route.params.policyID], + [isQuickSettingsFlow, currentCategoryName, route.params.categoryName, route.params.policyID, backTo], ); return ( @@ -78,9 +73,11 @@ function EditCategoryPage({route, policyCategories}: EditCategoryPageProps) { - backTo - ? Navigation.goBack(ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName, backTo)) - : Navigation.goBack(ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName)) + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName, backTo) + : ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(route.params.policyID, route.params.categoryName), + ) } /> ({ - policyCategories: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${route?.params?.policyID}`, - }, -})(EditCategoryPage); +export default EditCategoryPage; diff --git a/src/pages/workspace/categories/ImportCategoriesPage.tsx b/src/pages/workspace/categories/ImportCategoriesPage.tsx index d0eecc54ab9c..82afe6dfc812 100644 --- a/src/pages/workspace/categories/ImportCategoriesPage.tsx +++ b/src/pages/workspace/categories/ImportCategoriesPage.tsx @@ -12,8 +12,10 @@ type ImportCategoriesPageProps = StackScreenProps; @@ -21,8 +23,8 @@ function ImportCategoriesPage({route}: ImportCategoriesPageProps) { return ( ); } diff --git a/src/pages/workspace/categories/ImportedCategoriesPage.tsx b/src/pages/workspace/categories/ImportedCategoriesPage.tsx index 041e2b77c91e..138c7ea681df 100644 --- a/src/pages/workspace/categories/ImportedCategoriesPage.tsx +++ b/src/pages/workspace/categories/ImportedCategoriesPage.tsx @@ -30,9 +30,11 @@ function ImportedCategoriesPage({route}: ImportedCategoriesPageProps) { const {containsHeader = true} = spreadsheet ?? {}; const [isValidationEnabled, setIsValidationEnabled] = useState(false); const policyID = route.params.policyID; + const backTo = route.params.backTo; const [policyCategories] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${policyID}`); const policy = usePolicy(policyID); const columnNames = generateColumnNames(spreadsheet?.data?.length ?? 0); + const isQuickSettingsFlow = !!backTo; const getColumnRoles = (): ColumnRole[] => { const roles = []; @@ -120,7 +122,7 @@ function ImportedCategoriesPage({route}: ImportedCategoriesPageProps) { const closeImportPageAndModal = () => { setIsImportingCategories(false); closeImportPage(); - Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(policyID, backTo) : ROUTES.WORKSPACE_CATEGORIES.getRoute(policyID)); }; return ( @@ -130,7 +132,9 @@ function ImportedCategoriesPage({route}: ImportedCategoriesPageProps) { > Navigation.goBack(ROUTES.WORKSPACE_CATEGORIES_IMPORT.getRoute(policyID))} + onBackButtonPress={() => + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_IMPORT.getRoute(policyID, backTo) : ROUTES.WORKSPACE_CATEGORIES_IMPORT.getRoute(policyID)) + } /> 0; const currentConnectionName = PolicyUtils.getCurrentConnectionName(policy); + const isQuickSettingsFlow = !!backTo; const canSelectMultiple = shouldUseNarrowLayout ? selectionMode?.isEnabled : true; @@ -140,27 +141,19 @@ function WorkspaceCategoriesPage({route}: WorkspaceCategoriesPageProps) { ); const navigateToCategorySettings = (category: PolicyOption) => { - if (backTo) { - Navigation.navigate(ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(policyId, category.keyForList, backTo)); - return; - } - Navigation.navigate(ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(policyId, category.keyForList)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_CATEGORY_SETTINGS.getRoute(policyId, category.keyForList, backTo) + : ROUTES.WORKSPACE_CATEGORY_SETTINGS.getRoute(policyId, category.keyForList), + ); }; const navigateToCategoriesSettings = () => { - if (backTo) { - Navigation.navigate(ROUTES.SETTINGS_CATEGORIES_SETTINGS.getRoute(policyId, backTo)); - return; - } - Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES_SETTINGS.getRoute(policyId)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_SETTINGS.getRoute(policyId, backTo) : ROUTES.WORKSPACE_CATEGORIES_SETTINGS.getRoute(policyId)); }; const navigateToCreateCategoryPage = () => { - if (backTo) { - Navigation.navigate(ROUTES.SETTINGS_CATEGORY_CREATE.getRoute(policyId, backTo)); - return; - } - Navigation.navigate(ROUTES.WORKSPACE_CATEGORY_CREATE.getRoute(policyId)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORY_CREATE.getRoute(policyId, backTo) : ROUTES.WORKSPACE_CATEGORY_CREATE.getRoute(policyId)); }; const dismissError = (item: PolicyOption) => { @@ -312,7 +305,7 @@ function WorkspaceCategoriesPage({route}: WorkspaceCategoriesPageProps) { Modal.close(() => setIsOfflineModalVisible(true)); return; } - Navigation.navigate(ROUTES.WORKSPACE_CATEGORIES_IMPORT.getRoute(policyId)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_IMPORT.getRoute(policyId, backTo) : ROUTES.WORKSPACE_CATEGORIES_IMPORT.getRoute(policyId)); }, }); } @@ -335,7 +328,7 @@ function WorkspaceCategoriesPage({route}: WorkspaceCategoriesPageProps) { } return menuItems; - }, [policyId, translate, isOffline, hasVisibleCategories, policy]); + }, [policyId, translate, isOffline, hasVisibleCategories, policy, isQuickSettingsFlow, backTo]); const selectionModeHeader = selectionMode?.isEnabled && shouldUseNarrowLayout; diff --git a/src/pages/workspace/categories/WorkspaceCategoriesSettingsPage.tsx b/src/pages/workspace/categories/WorkspaceCategoriesSettingsPage.tsx index c70360bd8478..2b3fae8e972c 100644 --- a/src/pages/workspace/categories/WorkspaceCategoriesSettingsPage.tsx +++ b/src/pages/workspace/categories/WorkspaceCategoriesSettingsPage.tsx @@ -9,6 +9,7 @@ import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import usePermissions from '@hooks/usePermissions'; import useThemeStyles from '@hooks/useThemeStyles'; +import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; @@ -20,9 +21,18 @@ import {setWorkspaceRequiresCategory} from '@userActions/Policy/Category'; import * as Policy from '@userActions/Policy/Policy'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; +import ROUTES from '@src/ROUTES'; import SpendCategorySelectorListItem from './SpendCategorySelectorListItem'; -type WorkspaceCategoriesSettingsPageProps = WithPolicyConnectionsProps; +type WorkspaceCategoriesSettingsRouteProps = { + route: { + params: { + backTo: string; + }; + }; +}; + +type WorkspaceCategoriesSettingsPageProps = WorkspaceCategoriesSettingsRouteProps & WithPolicyConnectionsProps; function WorkspaceCategoriesSettingsPage({policy, route}: WorkspaceCategoriesSettingsPageProps) { const styles = useThemeStyles(); @@ -30,12 +40,14 @@ function WorkspaceCategoriesSettingsPage({policy, route}: WorkspaceCategoriesSet const {canUseWorkspaceRules} = usePermissions(); const isConnectedToAccounting = Object.keys(policy?.connections ?? {}).length > 0; const policyID = route.params.policyID ?? '-1'; + const backTo = route.params.backTo; const [policyCategories] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_CATEGORIES}${policyID}`); const [currentPolicy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`); const currentConnectionName = PolicyUtils.getCurrentConnectionName(policy); const [isSelectorModalVisible, setIsSelectorModalVisible] = useState(false); const [categoryID, setCategoryID] = useState(); const [groupID, setGroupID] = useState(); + const isQuickSettingsFlow = backTo; const toggleSubtitle = isConnectedToAccounting && currentConnectionName ? `${translate('workspace.categories.needCategoryForExportToIntegration')} ${currentConnectionName}.` : undefined; @@ -90,7 +102,10 @@ function WorkspaceCategoriesSettingsPage({policy, route}: WorkspaceCategoriesSet style={[styles.defaultModalContainer]} testID={WorkspaceCategoriesSettingsPage.displayName} > - + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_CATEGORIES_ROOT.getRoute(policyID, backTo) : undefined)} + /> ; -}; +type EditTagPageProps = StackScreenProps; -type EditTagPageProps = EditTagPageOnyxProps & StackScreenProps; - -function EditTagPage({route, policyTags}: EditTagPageProps) { +function EditTagPage({route}: EditTagPageProps) { + const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`); + const backTo = route.params.backTo; const styles = useThemeStyles(); const {translate} = useLocalize(); const {inputCallbackRef} = useAutoFocusInput(); const currentTagName = PolicyUtils.getCleanedTagName(route.params.tagName); + const isQuickSettingsFlow = !!backTo; const validate = useCallback( (values: FormOnyxValues) => { @@ -64,9 +61,13 @@ function EditTagPage({route, policyTags}: EditTagPageProps) { Tag.renamePolicyTag(route.params.policyID, {oldName: route.params.tagName, newName: values.tagName.trim()}, route.params.orderWeight); } Keyboard.dismiss(); - Navigation.goBack(); + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_SETTINGS.getRoute(route?.params?.policyID, route.params.orderWeight, route.params.tagName, backTo) + : ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(route?.params?.policyID, route.params.orderWeight, route.params.tagName), + ); }, - [currentTagName, route.params.policyID, route.params.tagName, route.params.orderWeight], + [currentTagName, route.params.policyID, route.params.tagName, route.params.orderWeight, isQuickSettingsFlow, backTo], ); return ( @@ -83,7 +84,13 @@ function EditTagPage({route, policyTags}: EditTagPageProps) { > + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_SETTINGS.getRoute(route?.params?.policyID, route.params.orderWeight, route.params.tagName, backTo) + : ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(route?.params?.policyID, route.params.orderWeight, route.params.tagName), + ) + } /> ({ - policyTags: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`, - }, -})(EditTagPage); +export default EditTagPage; diff --git a/src/pages/workspace/tags/ImportTagsPage.tsx b/src/pages/workspace/tags/ImportTagsPage.tsx index 0dd7c01f0af3..1bbe22750210 100644 --- a/src/pages/workspace/tags/ImportTagsPage.tsx +++ b/src/pages/workspace/tags/ImportTagsPage.tsx @@ -9,11 +9,13 @@ type ImportTagsPageProps = StackScreenProps ); } diff --git a/src/pages/workspace/tags/ImportedTagsPage.tsx b/src/pages/workspace/tags/ImportedTagsPage.tsx index b2e95edc43a4..a37bb1a4cb0f 100644 --- a/src/pages/workspace/tags/ImportedTagsPage.tsx +++ b/src/pages/workspace/tags/ImportedTagsPage.tsx @@ -30,10 +30,12 @@ function ImportedTagsPage({route}: ImportedTagsPageProps) { const {containsHeader = true} = spreadsheet ?? {}; const [isValidationEnabled, setIsValidationEnabled] = useState(false); const policyID = route.params.policyID; + const backTo = route.params.backTo; const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`); const policyTagLists = useMemo(() => PolicyUtils.getTagLists(policyTags), [policyTags]); const policy = usePolicy(policyID); const columnNames = generateColumnNames(spreadsheet?.data?.length ?? 0); + const isQuickSettingsFlow = !!backTo; const getColumnRoles = (): ColumnRole[] => { const roles = []; @@ -116,7 +118,7 @@ function ImportedTagsPage({route}: ImportedTagsPageProps) { const closeImportPageAndModal = () => { setIsImportingTags(false); closeImportPage(); - Navigation.navigate(ROUTES.WORKSPACE_TAGS.getRoute(policyID)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_ROOT.getRoute(policyID, backTo) : ROUTES.WORKSPACE_TAGS.getRoute(policyID)); }; return ( @@ -126,7 +128,7 @@ function ImportedTagsPage({route}: ImportedTagsPageProps) { > Navigation.goBack(ROUTES.WORKSPACE_TAGS_IMPORT.getRoute(policyID))} + onBackButtonPress={() => Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_IMPORT.getRoute(policyID, backTo) : ROUTES.WORKSPACE_TAGS_IMPORT.getRoute(policyID))} /> ; function TagApproverPage({route}: TagApproverPageProps) { - const {policyID, tagName} = route.params; + const {policyID, tagName, orderWeight, backTo} = route.params; const styles = useThemeStyles(); const {translate} = useLocalize(); const tagApprover = PolicyUtils.getTagApproverRule(policyID, tagName)?.approver; + const isQuickSettingsFlow = !!backTo; + + const goBack = () => { + Navigation.goBack( + isQuickSettingsFlow ? ROUTES.SETTINGS_TAG_SETTINGS.getRoute(policyID, orderWeight, tagName, backTo) : ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(policyID, orderWeight, tagName), + ); + }; return ( Navigation.goBack()} + onBackButtonPress={goBack} /> { Tag.setPolicyTagApprover(policyID, tagName, email); - Navigation.setNavigationActionToMicrotaskQueue(Navigation.goBack); + Navigation.setNavigationActionToMicrotaskQueue(goBack); }} /> diff --git a/src/pages/workspace/tags/TagGLCodePage.tsx b/src/pages/workspace/tags/TagGLCodePage.tsx index 8360108be362..df93b7b61b97 100644 --- a/src/pages/workspace/tags/TagGLCodePage.tsx +++ b/src/pages/workspace/tags/TagGLCodePage.tsx @@ -29,16 +29,22 @@ function TagGLCodePage({route}: EditTagGLCodePageProps) { const {translate} = useLocalize(); const {inputCallbackRef} = useAutoFocusInput(); const policy = usePolicy(route.params.policyID); + const backTo = route.params.backTo; const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`); const tagName = route.params.tagName; const orderWeight = route.params.orderWeight; const {tags} = PolicyUtils.getTagList(policyTags, orderWeight); const glCode = tags?.[route.params.tagName]?.['GL Code']; + const isQuickSettingsFlow = !!backTo; const goBack = useCallback(() => { - Navigation.goBack(ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(route.params.policyID, orderWeight, tagName)); - }, [orderWeight, route.params.policyID, tagName]); + Navigation.goBack( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_SETTINGS.getRoute(route.params.policyID, orderWeight, tagName, backTo) + : ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(route.params.policyID, orderWeight, tagName), + ); + }, [orderWeight, route.params.policyID, tagName, isQuickSettingsFlow, backTo]); const editGLCode = useCallback( (values: FormOnyxValues) => { diff --git a/src/pages/workspace/tags/TagSettingsPage.tsx b/src/pages/workspace/tags/TagSettingsPage.tsx index aedd7e36a274..e57571ca0a5f 100644 --- a/src/pages/workspace/tags/TagSettingsPage.tsx +++ b/src/pages/workspace/tags/TagSettingsPage.tsx @@ -33,7 +33,7 @@ type TagSettingsPageProps = StackScreenProps PolicyUtils.getTagList(policyTags, orderWeight), [policyTags, orderWeight]); @@ -41,6 +41,7 @@ function TagSettingsPage({route, navigation}: TagSettingsPageProps) { const hasAccountingConnections = PolicyUtils.hasAccountingConnections(policy); const {canUseCategoryAndTagApprovers} = usePermissions(); const [isDeleteTagModalOpen, setIsDeleteTagModalOpen] = React.useState(false); + const isQuickSettingsFlow = !!backTo; const currentPolicyTag = policyTag.tags[tagName] ?? Object.values(policyTag.tags ?? {}).find((tag) => tag.previousTagName === tagName); @@ -58,7 +59,7 @@ function TagSettingsPage({route, navigation}: TagSettingsPageProps) { const deleteTagAndHideModal = () => { Tag.deletePolicyTags(policyID, [currentPolicyTag.name]); setIsDeleteTagModalOpen(false); - Navigation.goBack(); + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_ROOT.getRoute(policyID, backTo) : undefined); }; const updateWorkspaceTagEnabled = (value: boolean) => { @@ -66,21 +67,39 @@ function TagSettingsPage({route, navigation}: TagSettingsPageProps) { }; const navigateToEditTag = () => { - Navigation.navigate(ROUTES.WORKSPACE_TAG_EDIT.getRoute(policyID, orderWeight, currentPolicyTag.name)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_EDIT.getRoute(policyID, orderWeight, currentPolicyTag.name, backTo) + : ROUTES.WORKSPACE_TAG_EDIT.getRoute(policyID, orderWeight, currentPolicyTag.name), + ); }; const navigateToEditGlCode = () => { if (!PolicyUtils.isControlPolicy(policy)) { Navigation.navigate( - ROUTES.WORKSPACE_UPGRADE.getRoute(policyID, CONST.UPGRADE_FEATURE_INTRO_MAPPING.glCodes.alias, ROUTES.WORKSPACE_TAG_GL_CODE.getRoute(policy?.id ?? '', orderWeight, tagName)), + ROUTES.WORKSPACE_UPGRADE.getRoute( + policyID, + CONST.UPGRADE_FEATURE_INTRO_MAPPING.glCodes.alias, + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_GL_CODE.getRoute(policy?.id ?? '', orderWeight, tagName, backTo) + : ROUTES.WORKSPACE_TAG_GL_CODE.getRoute(policy?.id ?? '', orderWeight, tagName), + ), ); return; } - Navigation.navigate(ROUTES.WORKSPACE_TAG_GL_CODE.getRoute(policyID, orderWeight, currentPolicyTag.name)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_GL_CODE.getRoute(policyID, orderWeight, currentPolicyTag.name, backTo) + : ROUTES.WORKSPACE_TAG_GL_CODE.getRoute(policyID, orderWeight, currentPolicyTag.name), + ); }; const navigateToEditTagApprover = () => { - Navigation.navigate(ROUTES.WORKSPACE_TAG_APPROVER.getRoute(policyID, orderWeight, currentPolicyTag.name)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_APPROVER.getRoute(policyID, orderWeight, currentPolicyTag.name, backTo) + : ROUTES.WORKSPACE_TAG_APPROVER.getRoute(policyID, orderWeight, currentPolicyTag.name), + ); }; const isThereAnyAccountingConnection = Object.keys(policy?.connections ?? {}).length !== 0; @@ -105,6 +124,7 @@ function TagSettingsPage({route, navigation}: TagSettingsPageProps) { Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_ROOT.getRoute(policyID, backTo) : undefined)} /> ; -}; +type CreateTagPageProps = StackScreenProps; -type CreateTagPageProps = WorkspaceCreateTagPageOnyxProps & StackScreenProps; - -function CreateTagPage({route, policyTags}: CreateTagPageProps) { +function CreateTagPage({route}: CreateTagPageProps) { + const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`); const styles = useThemeStyles(); const {translate} = useLocalize(); const {inputCallbackRef} = useAutoFocusInput(); + const backTo = route.params.backTo; + const isQuickSettingsFlow = !!backTo; const validate = useCallback( (values: FormOnyxValues) => { @@ -63,9 +60,9 @@ function CreateTagPage({route, policyTags}: CreateTagPageProps) { (values: FormOnyxValues) => { Tag.createPolicyTag(route.params.policyID, values.tagName.trim()); Keyboard.dismiss(); - Navigation.goBack(); + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_ROOT.getRoute(route.params.policyID, backTo) : undefined); }, - [route.params.policyID], + [route.params.policyID, isQuickSettingsFlow, backTo], ); return ( @@ -82,7 +79,7 @@ function CreateTagPage({route, policyTags}: CreateTagPageProps) { > Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_ROOT.getRoute(route.params.policyID, backTo) : undefined)} /> ({ - policyTags: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`, - }, -})(CreateTagPage); +export default CreateTagPage; diff --git a/src/pages/workspace/tags/WorkspaceEditTagsPage.tsx b/src/pages/workspace/tags/WorkspaceEditTagsPage.tsx index d63799169ca8..f243c695e84a 100644 --- a/src/pages/workspace/tags/WorkspaceEditTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceEditTagsPage.tsx @@ -1,8 +1,7 @@ import type {StackScreenProps} from '@react-navigation/stack'; import React, {useCallback, useMemo} from 'react'; import {View} from 'react-native'; -import {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import FormProvider from '@components/Form/FormProvider'; import InputWrapper from '@components/Form/InputWrapper'; import type {FormInputErrors, FormOnyxValues} from '@components/Form/types'; @@ -19,22 +18,20 @@ import type {SettingsNavigatorParamList} from '@navigation/types'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; +import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; import INPUT_IDS from '@src/types/form/PolicyTagNameForm'; -import type * as OnyxTypes from '@src/types/onyx'; -type WorkspaceEditTagsPageOnyxProps = { - /** Collection of tags attached to a policy */ - policyTags: OnyxEntry; -}; +type WorkspaceEditTagsPageProps = StackScreenProps; -type WorkspaceEditTagsPageProps = WorkspaceEditTagsPageOnyxProps & StackScreenProps; - -function WorkspaceEditTagsPage({route, policyTags}: WorkspaceEditTagsPageProps) { +function WorkspaceEditTagsPage({route}: WorkspaceEditTagsPageProps) { + const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${route?.params?.policyID}`); const styles = useThemeStyles(); const {translate} = useLocalize(); const taglistName = useMemo(() => PolicyUtils.getTagListName(policyTags, route.params.orderWeight), [policyTags, route.params.orderWeight]); const {inputCallbackRef} = useAutoFocusInput(); + const backTo = route.params.backTo; + const isQuickSettingsFlow = !!backTo; const validateTagName = useCallback( (values: FormOnyxValues) => { @@ -58,9 +55,11 @@ function WorkspaceEditTagsPage({route, policyTags}: WorkspaceEditTagsPageProps) if (values[INPUT_IDS.POLICY_TAGS_NAME] !== taglistName) { Tag.renamePolicyTaglist(route.params.policyID, {oldName: taglistName, newName: values[INPUT_IDS.POLICY_TAGS_NAME]}, policyTags, route.params.orderWeight); } - Navigation.goBack(); + Navigation.goBack( + isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_SETTINGS.getRoute(route?.params?.policyID, backTo) : ROUTES.WORKSPACE_TAGS_SETTINGS.getRoute(route?.params?.policyID), + ); }, - [policyTags, route.params.orderWeight, route.params.policyID, taglistName], + [policyTags, route.params.orderWeight, route.params.policyID, taglistName, isQuickSettingsFlow, backTo], ); return ( @@ -74,7 +73,14 @@ function WorkspaceEditTagsPage({route, policyTags}: WorkspaceEditTagsPageProps) shouldEnableMaxHeight testID={WorkspaceEditTagsPage.displayName} > - + + Navigation.goBack( + isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_SETTINGS.getRoute(route?.params?.policyID, backTo) : ROUTES.WORKSPACE_TAGS_SETTINGS.getRoute(route?.params?.policyID), + ) + } + /> ({ - policyTags: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_TAGS}${route.params.policyID}`, - }, -})(WorkspaceEditTagsPage); +export default WorkspaceEditTagsPage; diff --git a/src/pages/workspace/tags/WorkspaceTagsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsPage.tsx index a30b56d6dda4..5574b5c78421 100644 --- a/src/pages/workspace/tags/WorkspaceTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsPage.tsx @@ -62,6 +62,7 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { const [isOfflineModalVisible, setIsOfflineModalVisible] = useState(false); const isFocused = useIsFocused(); const policyID = route.params.policyID ?? '-1'; + const backTo = route.params.backTo; const policy = usePolicy(policyID); const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`); const {selectionMode} = useMobileSelectionMode(); @@ -70,10 +71,10 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { const currentConnectionName = PolicyUtils.getCurrentConnectionName(policy); const [policyTagLists, isMultiLevelTags] = useMemo(() => [PolicyUtils.getTagLists(policyTags), PolicyUtils.isMultiLevelTags(policyTags)], [policyTags]); const canSelectMultiple = !isMultiLevelTags && (shouldUseNarrowLayout ? selectionMode?.isEnabled : true); - const fetchTags = useCallback(() => { Tag.openPolicyTagsPage(policyID); }, [policyID]); + const isQuickSettingsFlow = !!backTo; const {isOffline} = useNetwork({onReconnect: fetchTags}); @@ -172,19 +173,21 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { }; const navigateToTagsSettings = () => { - Navigation.navigate(ROUTES.WORKSPACE_TAGS_SETTINGS.getRoute(policyID)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_SETTINGS.getRoute(policyID, backTo) : ROUTES.WORKSPACE_TAGS_SETTINGS.getRoute(policyID)); }; const navigateToCreateTagPage = () => { - Navigation.navigate(ROUTES.WORKSPACE_TAG_CREATE.getRoute(policyID)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_TAG_CREATE.getRoute(policyID, backTo) : ROUTES.WORKSPACE_TAG_CREATE.getRoute(policyID)); }; const navigateToTagSettings = (tag: TagListItem) => { if (tag.orderWeight !== undefined) { - Navigation.navigate(ROUTES.WORKSPACE_TAG_LIST_VIEW.getRoute(policyID, tag.orderWeight)); - return; + Navigation.navigate( + isQuickSettingsFlow ? ROUTES.SETTINGS_TAG_LIST_VIEW.getRoute(policyID, tag.orderWeight, backTo) : ROUTES.WORKSPACE_TAG_LIST_VIEW.getRoute(policyID, tag.orderWeight), + ); } - Navigation.navigate(ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(policyID, 0, tag.value)); + + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_TAG_SETTINGS.getRoute(policyID, 0, tag.value, backTo) : ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(policyID, 0, tag.value)); }; const selectedTagsArray = Object.keys(selectedTags).filter((key) => selectedTags[key]); @@ -304,7 +307,7 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { Modal.close(() => setIsOfflineModalVisible(true)); return; } - Navigation.navigate(ROUTES.WORKSPACE_TAGS_IMPORT.getRoute(policyID)); + Navigation.navigate(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_IMPORT.getRoute(policyID, backTo) : ROUTES.WORKSPACE_TAGS_IMPORT.getRoute(policyID)); }, }, ]; @@ -328,7 +331,7 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { } return menuItems; - }, [translate, hasVisibleTags, isOffline, policyID]); + }, [translate, hasVisibleTags, isOffline, policyID, isQuickSettingsFlow, backTo]); const getHeaderText = () => ( @@ -374,7 +377,7 @@ function WorkspaceTagsPage({route}: WorkspaceTagsPageProps) { turnOffMobileSelectionMode(); return; } - Navigation.goBack(); + Navigation.goBack(backTo); }} shouldShowThreeDotsButton={!policy?.hasMultipleTagLists} threeDotsMenuItems={threeDotsMenuItems} diff --git a/src/pages/workspace/tags/WorkspaceTagsSettingsPage.tsx b/src/pages/workspace/tags/WorkspaceTagsSettingsPage.tsx index b5b527dc4dfa..3fadba088648 100644 --- a/src/pages/workspace/tags/WorkspaceTagsSettingsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceTagsSettingsPage.tsx @@ -2,7 +2,7 @@ import type {StackScreenProps} from '@react-navigation/stack'; import React, {useCallback, useMemo} from 'react'; import {View} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; -import {withOnyx} from 'react-native-onyx'; +import {useOnyx} from 'react-native-onyx'; import FullPageOfflineBlockingView from '@components/BlockingViews/FullPageOfflineBlockingView'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; @@ -27,11 +27,7 @@ import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; import type * as OnyxTypes from '@src/types/onyx'; -type WorkspaceTagsSettingsPageOnyxProps = { - /** Collection of tags attached to a policy */ - policyTags: OnyxEntry; -}; -type WorkspaceTagsSettingsPageProps = WorkspaceTagsSettingsPageOnyxProps & StackScreenProps; +type WorkspaceTagsSettingsPageProps = StackScreenProps; /** * The pending state might be set by either setPolicyBillableMode or disableWorkspaceBillableExpenses. @@ -53,8 +49,10 @@ function toggleBillableExpenses(policy: OnyxEntry) { } } -function WorkspaceTagsSettingsPage({route, policyTags}: WorkspaceTagsSettingsPageProps) { - const policyID = route.params.policyID; +function WorkspaceTagsSettingsPage({route}: WorkspaceTagsSettingsPageProps) { + const policyID = route.params.policyID ?? '-1'; + const backTo = route.params.backTo; + const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`); const styles = useThemeStyles(); const {translate} = useLocalize(); const [policyTagLists, isMultiLevelTags] = useMemo(() => [PolicyUtils.getTagLists(policyTags), PolicyUtils.isMultiLevelTags(policyTags)], [policyTags]); @@ -62,13 +60,13 @@ function WorkspaceTagsSettingsPage({route, policyTags}: WorkspaceTagsSettingsPag const {isOffline} = useNetwork(); const hasEnabledOptions = OptionsListUtils.hasEnabledOptions(Object.values(policyTags ?? {}).flatMap(({tags}) => Object.values(tags))); const {canUseWorkspaceRules} = usePermissions(); - const updateWorkspaceRequiresTag = useCallback( (value: boolean) => { Tag.setPolicyRequiresTag(policyID, value); }, [policyID], ); + const isQuickSettingsFlow = !!backTo; const getTagsSettings = (policy: OnyxEntry) => ( @@ -82,7 +80,13 @@ function WorkspaceTagsSettingsPage({route, policyTags}: WorkspaceTagsSettingsPag Navigation.navigate(ROUTES.WORKSPACE_EDIT_TAGS.getRoute(policyID, policyTagLists.at(0)?.orderWeight ?? 0))} + onPress={() => { + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAGS_EDIT.getRoute(policyID, policyTagLists.at(0)?.orderWeight ?? 0, backTo) + : ROUTES.WORKSPACE_EDIT_TAGS.getRoute(policyID, policyTagLists.at(0)?.orderWeight ?? 0), + ); + }} shouldShowRightIcon /> @@ -128,7 +132,10 @@ function WorkspaceTagsSettingsPage({route, policyTags}: WorkspaceTagsSettingsPag style={[styles.defaultModalContainer]} testID={WorkspaceTagsSettingsPage.displayName} > - + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_ROOT.getRoute(policyID, backTo) : undefined)} + /> {isOffline && isLoading ? {getTagsSettings(policy)} : getTagsSettings(policy)} )} @@ -138,8 +145,4 @@ function WorkspaceTagsSettingsPage({route, policyTags}: WorkspaceTagsSettingsPag WorkspaceTagsSettingsPage.displayName = 'WorkspaceTagsSettingsPage'; -export default withOnyx({ - policyTags: { - key: ({route}) => `${ONYXKEYS.COLLECTION.POLICY_TAGS}${route.params.policyID}`, - }, -})(WorkspaceTagsSettingsPage); +export default WorkspaceTagsSettingsPage; diff --git a/src/pages/workspace/tags/WorkspaceViewTagsPage.tsx b/src/pages/workspace/tags/WorkspaceViewTagsPage.tsx index a01707a04740..c7bd1cfbacda 100644 --- a/src/pages/workspace/tags/WorkspaceViewTagsPage.tsx +++ b/src/pages/workspace/tags/WorkspaceViewTagsPage.tsx @@ -53,11 +53,13 @@ function WorkspaceViewTagsPage({route}: WorkspaceViewTagsProps) { const [isDeleteTagsConfirmModalVisible, setIsDeleteTagsConfirmModalVisible] = useState(false); const isFocused = useIsFocused(); const policyID = route.params.policyID ?? '-1'; + const backTo = route.params.backTo; const policy = usePolicy(policyID); const [policyTags] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_TAGS}${policyID}`); const {selectionMode} = useMobileSelectionMode(); const currentTagListName = useMemo(() => PolicyUtils.getTagListName(policyTags, route.params.orderWeight), [policyTags, route.params.orderWeight]); const currentPolicyTag = policyTags?.[currentTagListName]; + const isQuickSettingsFlow = !!backTo; const fetchTags = useCallback(() => { Tag.openPolicyTagsPage(policyID); @@ -141,7 +143,11 @@ function WorkspaceViewTagsPage({route}: WorkspaceViewTagsProps) { }; const navigateToTagSettings = (tag: TagListItem) => { - Navigation.navigate(ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(policyID, route.params.orderWeight, tag.value)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAG_SETTINGS.getRoute(policyID, route.params.orderWeight, tag.value, backTo) + : ROUTES.WORKSPACE_TAG_SETTINGS.getRoute(policyID, route.params.orderWeight, tag.value), + ); }; const selectedTagsArray = Object.keys(selectedTags).filter((key) => selectedTags[key]); @@ -237,7 +243,11 @@ function WorkspaceViewTagsPage({route}: WorkspaceViewTagsProps) { } const navigateToEditTag = () => { - Navigation.navigate(ROUTES.WORKSPACE_EDIT_TAGS.getRoute(route.params.policyID, currentPolicyTag?.orderWeight ?? 0)); + Navigation.navigate( + isQuickSettingsFlow + ? ROUTES.SETTINGS_TAGS_EDIT.getRoute(route.params.policyID, currentPolicyTag?.orderWeight ?? 0, backTo) + : ROUTES.WORKSPACE_EDIT_TAGS.getRoute(route.params.policyID, currentPolicyTag?.orderWeight ?? 0), + ); }; const selectionModeHeader = selectionMode?.isEnabled && isSmallScreenWidth; @@ -261,7 +271,7 @@ function WorkspaceViewTagsPage({route}: WorkspaceViewTagsProps) { turnOffMobileSelectionMode(); return; } - Navigation.goBack(); + Navigation.goBack(isQuickSettingsFlow ? ROUTES.SETTINGS_TAGS_ROOT.getRoute(policyID) : ROUTES.WORKSPACE_TAGS.getRoute(policyID)); }} > {!shouldUseNarrowLayout && getHeaderButtons()}