Skip to content

Commit ef87510

Browse files
authored
Merge pull request Expensify#85426 from huult/83363-migrate-debug-final-misc
2 parents 6b17cfc + 385fa17 commit ef87510

9 files changed

Lines changed: 79 additions & 79 deletions

File tree

src/ROUTES.ts

Lines changed: 23 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -120,6 +120,29 @@ const DYNAMIC_ROUTES = {
120120
getRoute: (country = '') => `country?country=${country}`,
121121
queryParams: ['country'],
122122
},
123+
DETAILS_CONSTANT_PICKER: {
124+
path: 'constant-picker',
125+
entryScreens: [SCREENS.DEBUG.REPORT, SCREENS.DEBUG.REPORT_ACTION, SCREENS.DEBUG.TRANSACTION, SCREENS.DEBUG.TRANSACTION_VIOLATION],
126+
getRoute: (formType: string, fieldName: string, fieldValue?: string, policyID?: string) =>
127+
getUrlWithParams('constant-picker', {
128+
formType,
129+
fieldName,
130+
fieldValue,
131+
policyID,
132+
}),
133+
queryParams: ['formType', 'fieldName', 'fieldValue', 'policyID'],
134+
},
135+
DETAILS_DATE_TIME_PICKER: {
136+
path: 'datetime-picker',
137+
entryScreens: [SCREENS.DEBUG.REPORT, SCREENS.DEBUG.REPORT_ACTION, SCREENS.DEBUG.TRANSACTION, SCREENS.DEBUG.TRANSACTION_VIOLATION],
138+
getRoute: (fieldName: string, fieldValue?: string, policyID?: string) =>
139+
getUrlWithParams('datetime-picker', {
140+
fieldName,
141+
fieldValue,
142+
policyID,
143+
}),
144+
queryParams: ['fieldName', 'fieldValue', 'policyID'],
145+
},
123146
} as const satisfies DynamicRoutes;
124147

125148
const ROUTES = {
@@ -3907,18 +3930,6 @@ const ROUTES = {
39073930
route: 'debug/report/:reportID/actions/:reportActionID/preview',
39083931
getRoute: (reportID: string, reportActionID: string) => `debug/report/${reportID}/actions/${reportActionID}/preview` as const,
39093932
},
3910-
DETAILS_CONSTANT_PICKER_PAGE: {
3911-
route: 'debug/:formType/details/constant/:fieldName',
3912-
getRoute: (formType: string, fieldName: string, fieldValue?: string, policyID?: string, backTo?: string) =>
3913-
// eslint-disable-next-line no-restricted-syntax -- Legacy route generation
3914-
getUrlWithBackToParam(`debug/${formType}/details/constant/${fieldName}?fieldValue=${fieldValue}&policyID=${policyID}`, backTo),
3915-
},
3916-
DETAILS_DATE_TIME_PICKER_PAGE: {
3917-
route: 'debug/details/datetime/:fieldName',
3918-
3919-
// eslint-disable-next-line no-restricted-syntax -- Legacy route generation
3920-
getRoute: (fieldName: string, fieldValue?: string, backTo?: string) => getUrlWithBackToParam(`debug/details/datetime/${fieldName}?fieldValue=${fieldValue}`, backTo),
3921-
},
39223933
DEBUG_TRANSACTION: {
39233934
route: 'debug/transaction/:transactionID',
39243935
getRoute: (transactionID: string) => `debug/transaction/${transactionID}` as const,

src/SCREENS.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -927,8 +927,8 @@ const SCREENS = {
927927
REPORT: 'Debug_Report',
928928
REPORT_ACTION: 'Debug_Report_Action',
929929
REPORT_ACTION_CREATE: 'Debug_Report_Action_Create',
930-
DETAILS_CONSTANT_PICKER_PAGE: 'Debug_Details_Constant_Picker_Page',
931-
DETAILS_DATE_TIME_PICKER_PAGE: 'Debug_Details_Date_Time_Picker_Page',
930+
DYNAMIC_DETAILS_CONSTANT_PICKER_PAGE: 'Dynamic_Debug_Details_Constant_Picker_Page',
931+
DYNAMIC_DETAILS_DATE_TIME_PICKER_PAGE: 'Dynamic_Debug_Details_Date_Time_Picker_Page',
932932
TRANSACTION: 'Debug_Transaction',
933933
TRANSACTION_VIOLATION_CREATE: 'Debug_Transaction_Violation_Create',
934934
TRANSACTION_VIOLATION: 'Debug_Transaction_Violation',

src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1070,8 +1070,8 @@ const DebugModalStackNavigator = createModalStackNavigator<DebugParamList>({
10701070
[SCREENS.DEBUG.REPORT]: () => require<ReactComponentModule>('../../../../pages/Debug/Report/DebugReportPage').default,
10711071
[SCREENS.DEBUG.REPORT_ACTION]: () => require<ReactComponentModule>('../../../../pages/Debug/ReportAction/DebugReportActionPage').default,
10721072
[SCREENS.DEBUG.REPORT_ACTION_CREATE]: () => require<ReactComponentModule>('../../../../pages/Debug/ReportAction/DebugReportActionCreatePage').default,
1073-
[SCREENS.DEBUG.DETAILS_CONSTANT_PICKER_PAGE]: () => require<ReactComponentModule>('../../../../pages/Debug/DebugDetailsConstantPickerPage').default,
1074-
[SCREENS.DEBUG.DETAILS_DATE_TIME_PICKER_PAGE]: () => require<ReactComponentModule>('../../../../pages/Debug/DebugDetailsDateTimePickerPage').default,
1073+
[SCREENS.DEBUG.DYNAMIC_DETAILS_CONSTANT_PICKER_PAGE]: () => require<ReactComponentModule>('../../../../pages/Debug/DynamicDebugDetailsConstantPickerPage').default,
1074+
[SCREENS.DEBUG.DYNAMIC_DETAILS_DATE_TIME_PICKER_PAGE]: () => require<ReactComponentModule>('../../../../pages/Debug/DynamicDebugDetailsDateTimePickerPage').default,
10751075
[SCREENS.DEBUG.TRANSACTION]: () => require<ReactComponentModule>('../../../../pages/Debug/Transaction/DebugTransactionPage').default,
10761076
[SCREENS.DEBUG.TRANSACTION_VIOLATION_CREATE]: () => require<ReactComponentModule>('../../../../pages/Debug/TransactionViolation/DebugTransactionViolationCreatePage').default,
10771077
[SCREENS.DEBUG.TRANSACTION_VIOLATION]: () => require<ReactComponentModule>('../../../../pages/Debug/TransactionViolation/DebugTransactionViolationPage').default,

src/libs/Navigation/linkingConfig/config.ts

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2031,14 +2031,8 @@ const config: LinkingOptions<RootNavigatorParamList>['config'] = {
20312031
path: ROUTES.DEBUG_REPORT_ACTION_CREATE.route,
20322032
exact: true,
20332033
},
2034-
[SCREENS.DEBUG.DETAILS_CONSTANT_PICKER_PAGE]: {
2035-
path: ROUTES.DETAILS_CONSTANT_PICKER_PAGE.route,
2036-
exact: true,
2037-
},
2038-
[SCREENS.DEBUG.DETAILS_DATE_TIME_PICKER_PAGE]: {
2039-
path: ROUTES.DETAILS_DATE_TIME_PICKER_PAGE.route,
2040-
exact: true,
2041-
},
2034+
[SCREENS.DEBUG.DYNAMIC_DETAILS_CONSTANT_PICKER_PAGE]: DYNAMIC_ROUTES.DETAILS_CONSTANT_PICKER.path,
2035+
[SCREENS.DEBUG.DYNAMIC_DETAILS_DATE_TIME_PICKER_PAGE]: DYNAMIC_ROUTES.DETAILS_DATE_TIME_PICKER.path,
20422036
[SCREENS.DEBUG.TRANSACTION]: {
20432037
path: ROUTES.DEBUG_TRANSACTION.route,
20442038
exact: true,

src/libs/Navigation/types.ts

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3130,19 +3130,15 @@ type DebugParamList = {
31303130
[SCREENS.DEBUG.REPORT_ACTION_CREATE]: {
31313131
reportID: string;
31323132
};
3133-
[SCREENS.DEBUG.DETAILS_CONSTANT_PICKER_PAGE]: {
3133+
[SCREENS.DEBUG.DYNAMIC_DETAILS_CONSTANT_PICKER_PAGE]: {
31343134
formType: string;
31353135
fieldName: string;
31363136
fieldValue?: string;
31373137
policyID?: string;
3138-
// eslint-disable-next-line no-restricted-syntax -- `backTo` usages in this file are legacy. Do not add new `backTo` params to screens. See contributingGuides/NAVIGATION.md
3139-
backTo?: string;
31403138
};
3141-
[SCREENS.DEBUG.DETAILS_DATE_TIME_PICKER_PAGE]: {
3139+
[SCREENS.DEBUG.DYNAMIC_DETAILS_DATE_TIME_PICKER_PAGE]: {
31423140
fieldName: string;
31433141
fieldValue?: string;
3144-
// eslint-disable-next-line no-restricted-syntax -- `backTo` usages in this file are legacy. Do not add new `backTo` params to screens. See contributingGuides/NAVIGATION.md
3145-
backTo?: string;
31463142
};
31473143
[SCREENS.DEBUG.TRANSACTION]: {
31483144
transactionID: string;

src/pages/Debug/ConstantSelector.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,10 @@ import React, {useEffect} from 'react';
44
import type {View} from 'react-native';
55
import type {ValueOf} from 'type-fest';
66
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
7+
import createDynamicRoute from '@libs/Navigation/helpers/dynamicRoutesUtils/createDynamicRoute';
78
import Navigation from '@libs/Navigation/Navigation';
89
import CONST from '@src/CONST';
9-
import ROUTES from '@src/ROUTES';
10+
import {DYNAMIC_ROUTES} from '@src/ROUTES';
1011

1112
type ConstantSelectorProps = {
1213
/** Form error text. e.g when no constant is selected */
@@ -63,7 +64,7 @@ function ConstantSelector(
6364
brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
6465
errorText={errorText}
6566
onPress={() => {
66-
Navigation.navigate(ROUTES.DETAILS_CONSTANT_PICKER_PAGE.getRoute(formType, name, value, policyID, Navigation.getActiveRoute()));
67+
Navigation.navigate(createDynamicRoute(DYNAMIC_ROUTES.DETAILS_CONSTANT_PICKER.getRoute(formType, name, value, policyID)));
6768
}}
6869
shouldShowRightIcon
6970
/>

src/pages/Debug/DateTimeSelector.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,10 @@ import type {ForwardedRef} from 'react';
33
import React, {useEffect} from 'react';
44
import type {View} from 'react-native';
55
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
6+
import createDynamicRoute from '@libs/Navigation/helpers/dynamicRoutesUtils/createDynamicRoute';
67
import Navigation from '@libs/Navigation/Navigation';
78
import CONST from '@src/CONST';
8-
import ROUTES from '@src/ROUTES';
9+
import {DYNAMIC_ROUTES} from '@src/ROUTES';
910

1011
type DateTimeSelectorProps = {
1112
/** Form error text. e.g when no datetime is selected */
@@ -57,7 +58,7 @@ function DateTimeSelector(
5758
brickRoadIndicator={errorText ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : undefined}
5859
errorText={errorText}
5960
onPress={() => {
60-
Navigation.navigate(ROUTES.DETAILS_DATE_TIME_PICKER_PAGE.getRoute(name, value, Navigation.getActiveRoute()));
61+
Navigation.navigate(createDynamicRoute(DYNAMIC_ROUTES.DETAILS_DATE_TIME_PICKER.getRoute(name, value)));
6162
}}
6263
shouldShowRightIcon
6364
/>

src/pages/Debug/DebugDetailsConstantPickerPage.tsx renamed to src/pages/Debug/DynamicDebugDetailsConstantPickerPage.tsx

Lines changed: 19 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -4,45 +4,34 @@ import CategoryPicker from '@components/CategoryPicker';
44
import CurrencySelectionList from '@components/CurrencySelectionList';
55
import HeaderWithBackButton from '@components/HeaderWithBackButton';
66
import ScreenWrapper from '@components/ScreenWrapper';
7+
import useDynamicBackPath from '@hooks/useDynamicBackPath';
78
import useLocalize from '@hooks/useLocalize';
89
import useThemeStyles from '@hooks/useThemeStyles';
910
import Navigation from '@libs/Navigation/Navigation';
1011
import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
1112
import type {DebugParamList} from '@libs/Navigation/types';
1213
import {appendParam} from '@libs/Url';
1314
import CONST from '@src/CONST';
15+
import {DYNAMIC_ROUTES} from '@src/ROUTES';
1416
import type SCREENS from '@src/SCREENS';
1517
import TRANSACTION_FORM_INPUT_IDS from '@src/types/form/DebugTransactionForm';
1618
import ConstantPicker from './ConstantPicker';
1719
import DebugTagPicker from './DebugTagPicker';
1820

19-
type DebugDetailsConstantPickerPageProps = PlatformStackScreenProps<DebugParamList, typeof SCREENS.DEBUG.DETAILS_CONSTANT_PICKER_PAGE>;
21+
type DynamicDebugDetailsConstantPickerPageProps = PlatformStackScreenProps<DebugParamList, typeof SCREENS.DEBUG.DYNAMIC_DETAILS_CONSTANT_PICKER_PAGE>;
2022

21-
function DebugDetailsConstantPickerPage({
23+
function DynamicDebugDetailsConstantPickerPage({
2224
route: {
23-
params: {formType, fieldName, fieldValue, policyID = '', backTo = ''},
25+
params: {formType, fieldName, fieldValue, policyID = ''},
2426
},
25-
navigation,
26-
}: DebugDetailsConstantPickerPageProps) {
27+
}: DynamicDebugDetailsConstantPickerPageProps) {
2728
const {translate} = useLocalize();
2829
const styles = useThemeStyles();
29-
const onSubmit = useCallback(
30-
(item: {text?: string; keyForList?: string}) => {
31-
const value = item.text === fieldValue ? '' : (item.text ?? '');
32-
// Check the navigation state and "backTo" parameter to decide navigation behavior
33-
if (navigation.getState().routes.length === 1 && !backTo) {
34-
// If there is only one route and "backTo" is empty, go back in navigation
35-
Navigation.goBack();
36-
} else if (!!backTo && navigation.getState().routes.length === 1) {
37-
// If "backTo" is not empty and there is only one route, go back to the specific route defined in "backTo" with a country parameter
38-
Navigation.goBack(appendParam(backTo, fieldName, value));
39-
} else {
40-
// Otherwise, navigate to the specific route defined in "backTo" with a country parameter
41-
Navigation.navigate(appendParam(backTo, fieldName, value));
42-
}
43-
},
44-
[backTo, fieldName, fieldValue, navigation],
45-
);
30+
const backPath = useDynamicBackPath(DYNAMIC_ROUTES.DETAILS_CONSTANT_PICKER.path);
31+
const onSubmit = (item: {text?: string; keyForList?: string}) => {
32+
const value = item.text === fieldValue ? '' : (item.text ?? '');
33+
Navigation.goBack(appendParam(backPath, fieldName ?? '', value), {compareParams: false});
34+
};
4635

4736
const renderPicker = useCallback(() => {
4837
if (([TRANSACTION_FORM_INPUT_IDS.CURRENCY, TRANSACTION_FORM_INPUT_IDS.MODIFIED_CURRENCY, TRANSACTION_FORM_INPUT_IDS.ORIGINAL_CURRENCY] as string[]).includes(fieldName)) {
@@ -91,10 +80,16 @@ function DebugDetailsConstantPickerPage({
9180

9281
return (
9382
<ScreenWrapper testID="DebugDetailsConstantPickerPage">
94-
<HeaderWithBackButton title={fieldName} />
83+
<HeaderWithBackButton
84+
title={fieldName}
85+
shouldShowBackButton
86+
onBackButtonPress={() => {
87+
Navigation.goBack(fieldValue ? appendParam(backPath, fieldName, fieldValue) : backPath, {compareParams: false});
88+
}}
89+
/>
9590
<View style={styles.containerWithSpaceBetween}>{renderPicker()}</View>
9691
</ScreenWrapper>
9792
);
9893
}
9994

100-
export default DebugDetailsConstantPickerPage;
95+
export default DynamicDebugDetailsConstantPickerPage;

src/pages/Debug/DebugDetailsDateTimePickerPage.tsx renamed to src/pages/Debug/DynamicDebugDetailsDateTimePickerPage.tsx

Lines changed: 23 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,29 +7,43 @@ import ScreenWrapper from '@components/ScreenWrapper';
77
import ScrollView from '@components/ScrollView';
88
import Text from '@components/Text';
99
import TimePicker from '@components/TimePicker/TimePicker';
10+
import useDynamicBackPath from '@hooks/useDynamicBackPath';
1011
import useLocalize from '@hooks/useLocalize';
1112
import useThemeStyles from '@hooks/useThemeStyles';
1213
import DateUtils from '@libs/DateUtils';
1314
import Navigation from '@libs/Navigation/Navigation';
1415
import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
1516
import type {DebugParamList} from '@libs/Navigation/types';
1617
import {appendParam} from '@libs/Url';
18+
import {DYNAMIC_ROUTES} from '@src/ROUTES';
1719
import type SCREENS from '@src/SCREENS';
1820

19-
type DebugDetailsDateTimePickerPageProps = PlatformStackScreenProps<DebugParamList, typeof SCREENS.DEBUG.DETAILS_DATE_TIME_PICKER_PAGE>;
21+
type DynamicDebugDetailsDateTimePickerPageProps = PlatformStackScreenProps<DebugParamList, typeof SCREENS.DEBUG.DYNAMIC_DETAILS_DATE_TIME_PICKER_PAGE>;
2022

21-
function DebugDetailsDateTimePickerPage({
23+
function DynamicDebugDetailsDateTimePickerPage({
2224
route: {
23-
params: {fieldName, fieldValue = '', backTo = ''},
25+
params: {fieldName, fieldValue = ''},
2426
},
25-
navigation,
26-
}: DebugDetailsDateTimePickerPageProps) {
27+
}: DynamicDebugDetailsDateTimePickerPageProps) {
2728
const {translate} = useLocalize();
2829
const styles = useThemeStyles();
30+
const backPath = useDynamicBackPath(DYNAMIC_ROUTES.DETAILS_DATE_TIME_PICKER.path);
2931
const [date, setDate] = useState(() => DateUtils.extractDate(fieldValue));
32+
33+
const handleSubmit = (time: string) => {
34+
const formattedDateTime = format(new Date(`${date} ${time}`), 'yyyy-MM-dd HH:mm:ss.SSS');
35+
Navigation.goBack(appendParam(backPath, fieldName ?? '', formattedDateTime), {compareParams: false});
36+
};
37+
3038
return (
31-
<ScreenWrapper testID="DebugDetailsDateTimePickerPage">
32-
<HeaderWithBackButton title={fieldName} />
39+
<ScreenWrapper testID="DynamicDebugDetailsDateTimePickerPage">
40+
<HeaderWithBackButton
41+
title={fieldName}
42+
shouldShowBackButton
43+
onBackButtonPress={() => {
44+
Navigation.goBack(fieldValue ? appendParam(backPath, fieldName, fieldValue) : backPath, {compareParams: false});
45+
}}
46+
/>
3347
<ScrollView contentContainerStyle={styles.gap8}>
3448
<View style={styles.ph5}>
3549
<Text style={styles.headerText}>{translate('debug.date')}</Text>
@@ -42,19 +56,7 @@ function DebugDetailsDateTimePickerPage({
4256
<View>
4357
<Text style={[styles.headerText, styles.ph5]}>{translate('debug.time')}</Text>
4458
<TimePicker
45-
onSubmit={(time) => {
46-
// Check the navigation state and "backTo" parameter to decide navigation behavior
47-
if (navigation.getState().routes.length === 1 && !backTo) {
48-
// If there is only one route and "backTo" is empty, go back in navigation
49-
Navigation.goBack();
50-
} else if (!!backTo && navigation.getState().routes.length === 1) {
51-
// If "backTo" is not empty and there is only one route, go back to the specific route defined in "backTo" with a country parameter
52-
Navigation.goBack(appendParam(backTo, fieldName, format(new Date(`${date} ${time}`), 'yyyy-MM-dd HH:mm:ss.SSS')));
53-
} else {
54-
// Otherwise, navigate to the specific route defined in "backTo" with a country parameter
55-
Navigation.navigate(appendParam(backTo, fieldName, format(new Date(`${date} ${time}`), 'yyyy-MM-dd HH:mm:ss.SSS')));
56-
}
57-
}}
59+
onSubmit={handleSubmit}
5860
defaultValue={fieldValue}
5961
shouldValidate={false}
6062
showFullFormat
@@ -65,4 +67,4 @@ function DebugDetailsDateTimePickerPage({
6567
);
6668
}
6769

68-
export default DebugDetailsDateTimePickerPage;
70+
export default DynamicDebugDetailsDateTimePickerPage;

0 commit comments

Comments
 (0)