From b082d4177d1ddfe069076ce14e5b7bd1f320bce6 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 27 Dec 2023 09:08:14 -0700 Subject: [PATCH 1/8] Remove old waypoint editor --- src/pages/iou/MoneyRequestEditWaypointPage.js | 4 +- .../NewDistanceRequestWaypointEditorPage.js | 4 +- src/pages/iou/WaypointEditor.js | 277 ------------------ 3 files changed, 4 insertions(+), 281 deletions(-) delete mode 100644 src/pages/iou/WaypointEditor.js diff --git a/src/pages/iou/MoneyRequestEditWaypointPage.js b/src/pages/iou/MoneyRequestEditWaypointPage.js index fc777891109e..cc4b9658362a 100644 --- a/src/pages/iou/MoneyRequestEditWaypointPage.js +++ b/src/pages/iou/MoneyRequestEditWaypointPage.js @@ -1,6 +1,6 @@ import PropTypes from 'prop-types'; import React from 'react'; -import WaypointEditor from './WaypointEditor'; +import IOURequestStepWaypoint from './request/step/IOURequestStepWaypoint'; const propTypes = { /** Route params */ @@ -23,7 +23,7 @@ const defaultProps = { }; function MoneyRequestEditWaypointPage({route}) { - return ; + return ; } MoneyRequestEditWaypointPage.displayName = 'MoneyRequestEditWaypointPage'; diff --git a/src/pages/iou/NewDistanceRequestWaypointEditorPage.js b/src/pages/iou/NewDistanceRequestWaypointEditorPage.js index 269cde577040..81f4c4f0c7d6 100644 --- a/src/pages/iou/NewDistanceRequestWaypointEditorPage.js +++ b/src/pages/iou/NewDistanceRequestWaypointEditorPage.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {withOnyx} from 'react-native-onyx'; import ONYXKEYS from '@src/ONYXKEYS'; -import WaypointEditor from './WaypointEditor'; +import IOURequestStepWaypoint from './request/step/IOURequestStepWaypoint'; const propTypes = { /** The transactionID of this request */ @@ -34,7 +34,7 @@ const defaultProps = { // You can't use Onyx props in the withOnyx mapping, so we need to set up and access the transactionID here, and then pass it down so that WaypointEditor can subscribe to the transaction. function NewDistanceRequestWaypointEditorPage({transactionID, route}) { return ( - !_.isEmpty(waypoint))); - - const waypointDescriptionKey = useMemo(() => { - switch (parsedWaypointIndex) { - case 0: - return 'distance.waypointDescription.start'; - case waypointCount - 1: - return 'distance.waypointDescription.finish'; - default: - return 'distance.waypointDescription.stop'; - } - }, [parsedWaypointIndex, waypointCount]); - - const waypointAddress = lodashGet(currentWaypoint, 'address', ''); - const isEditingWaypoint = Boolean(threadReportID); - // Hide the menu when there is only start and finish waypoint - const shouldShowThreeDotsButton = waypointCount > 2; - const shouldDisableEditor = - isFocused && - (Number.isNaN(parsedWaypointIndex) || parsedWaypointIndex < 0 || parsedWaypointIndex > waypointCount || (filledWaypointCount < 2 && parsedWaypointIndex >= waypointCount)); - - const validate = (values) => { - const errors = {}; - const waypointValue = values[`waypoint${waypointIndex}`] || ''; - if (isOffline && waypointValue !== '' && !ValidationUtils.isValidAddress(waypointValue)) { - ErrorUtils.addErrorMessage(errors, `waypoint${waypointIndex}`, 'bankAccount.error.address'); - } - - // If the user is online, and they are trying to save a value without using the autocomplete, show an error message instructing them to use a selected address instead. - // That enables us to save the address with coordinates when it is selected - if (!isOffline && waypointValue !== '' && waypointAddress !== waypointValue) { - ErrorUtils.addErrorMessage(errors, `waypoint${waypointIndex}`, 'distance.errors.selectSuggestedAddress'); - } - - return errors; - }; - - const saveWaypoint = (waypoint) => Transaction.saveWaypoint(transactionID, waypointIndex, waypoint, isEditingWaypoint); - - const submit = (values) => { - const waypointValue = values[`waypoint${waypointIndex}`] || ''; - - // Allows letting you set a waypoint to an empty value - if (waypointValue === '') { - Transaction.removeWaypoint(transaction, waypointIndex); - } - - // While the user is offline, the auto-complete address search will not work - // Therefore, we're going to save the waypoint as just the address, and the lat/long will be filled in on the backend - if (isOffline && waypointValue) { - const waypoint = { - lat: null, - lng: null, - address: waypointValue, - name: null, - }; - saveWaypoint(waypoint); - } - - // Other flows will be handled by selecting a waypoint with selectWaypoint as this is mainly for the offline flow - Navigation.goBack(ROUTES.MONEY_REQUEST_DISTANCE_TAB.getRoute(iouType)); - }; - - const deleteStopAndHideModal = () => { - Transaction.removeWaypoint(transaction, waypointIndex); - setIsDeleteStopModalOpen(false); - Navigation.goBack(ROUTES.MONEY_REQUEST_DISTANCE_TAB.getRoute(iouType)); - }; - - const selectWaypoint = (values) => { - const waypoint = { - lat: values.lat, - lng: values.lng, - address: values.address, - name: values.name || null, - }; - saveWaypoint(waypoint); - - if (isEditingWaypoint) { - Navigation.goBack(ROUTES.REPORT_WITH_ID.getRoute(threadReportID)); - return; - } - Navigation.goBack(ROUTES.MONEY_REQUEST_DISTANCE_TAB.getRoute(iouType)); - }; - - return ( - textInput.current && textInput.current.focus()} - shouldEnableMaxHeight - testID={WaypointEditor.displayName} - > - - { - Navigation.goBack(ROUTES.MONEY_REQUEST_DISTANCE_TAB.getRoute(iouType)); - }} - shouldShowThreeDotsButton={shouldShowThreeDotsButton} - threeDotsAnchorPosition={styles.threeDotsPopoverOffset(windowWidth)} - threeDotsMenuItems={[ - { - icon: Expensicons.Trashcan, - text: translate('distance.deleteWaypoint'), - onSelected: () => setIsDeleteStopModalOpen(true), - }, - ]} - /> - setIsDeleteStopModalOpen(false)} - prompt={translate('distance.deleteWaypointConfirmation')} - confirmText={translate('common.delete')} - cancelText={translate('common.cancel')} - danger - /> - - (textInput.current = e)} - hint={!isOffline ? 'distance.errors.selectSuggestedAddress' : ''} - containerStyles={[styles.mt3]} - label={translate('distance.address')} - defaultValue={waypointAddress} - onPress={selectWaypoint} - maxInputLength={CONST.FORM_CHARACTER_LIMIT} - renamedInputKeys={{ - address: `waypoint${waypointIndex}`, - city: null, - country: null, - street: null, - street2: null, - zipCode: null, - lat: null, - lng: null, - state: null, - }} - predefinedPlaces={recentWaypoints} - resultTypes="" - /> - - - - ); -} - -WaypointEditor.displayName = 'WaypointEditor'; -WaypointEditor.propTypes = propTypes; -WaypointEditor.defaultProps = defaultProps; -export default withOnyx({ - transaction: { - key: ({route}) => `${ONYXKEYS.COLLECTION.TRANSACTION}${lodashGet(route, 'params.transactionID')}`, - }, - recentWaypoints: { - key: ONYXKEYS.NVP_RECENT_WAYPOINTS, - - // Only grab the most recent 5 waypoints because that's all that is shown in the UI. This also puts them into the format of data - // that the google autocomplete component expects for it's "predefined places" feature. - selector: (waypoints) => - _.map(waypoints ? waypoints.slice(0, 5) : [], (waypoint) => ({ - name: waypoint.name, - description: waypoint.address, - geometry: { - location: { - lat: waypoint.lat, - lng: waypoint.lng, - }, - }, - })), - }, -})(WaypointEditor); From 607c720bf3e7247d29bb260bb68a3c0fa81d5188 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 27 Dec 2023 09:14:19 -0700 Subject: [PATCH 2/8] Use proper route proptypes --- src/pages/iou/MoneyRequestEditWaypointPage.js | 22 +++---------------- 1 file changed, 3 insertions(+), 19 deletions(-) diff --git a/src/pages/iou/MoneyRequestEditWaypointPage.js b/src/pages/iou/MoneyRequestEditWaypointPage.js index cc4b9658362a..3ea4ce579215 100644 --- a/src/pages/iou/MoneyRequestEditWaypointPage.js +++ b/src/pages/iou/MoneyRequestEditWaypointPage.js @@ -1,25 +1,10 @@ -import PropTypes from 'prop-types'; import React from 'react'; +import IOURequestStepRoutePropTypes from './request/step/IOURequestStepRoutePropTypes'; import IOURequestStepWaypoint from './request/step/IOURequestStepWaypoint'; const propTypes = { - /** Route params */ - route: PropTypes.shape({ - params: PropTypes.shape({ - /** Thread reportID */ - threadReportID: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), - - /** ID of the transaction being edited */ - transactionID: PropTypes.string, - - /** Index of the waypoint being edited */ - waypointIndex: PropTypes.string, - }), - }), -}; - -const defaultProps = { - route: {}, + /** Navigation route context info provided by react navigation */ + route: IOURequestStepRoutePropTypes.isRequired, }; function MoneyRequestEditWaypointPage({route}) { @@ -28,5 +13,4 @@ function MoneyRequestEditWaypointPage({route}) { MoneyRequestEditWaypointPage.displayName = 'MoneyRequestEditWaypointPage'; MoneyRequestEditWaypointPage.propTypes = propTypes; -MoneyRequestEditWaypointPage.defaultProps = defaultProps; export default MoneyRequestEditWaypointPage; From 022438632ebd5a3aaec6fef29ebcb9d96ef30208 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 27 Dec 2023 09:19:33 -0700 Subject: [PATCH 3/8] Remove old money request edit page --- src/ROUTES.ts | 4 ---- src/components/DistanceRequest/index.js | 7 ++++++- .../AppNavigator/ModalStackNavigators.tsx | 1 - src/libs/Navigation/linkingConfig.ts | 1 - src/libs/Navigation/types.ts | 6 ------ src/pages/iou/MoneyRequestEditWaypointPage.js | 16 ---------------- 6 files changed, 6 insertions(+), 29 deletions(-) delete mode 100644 src/pages/iou/MoneyRequestEditWaypointPage.js diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 49f0337798ee..1c1b7403399e 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -298,10 +298,6 @@ const ROUTES = { route: ':iouType/new/address/:reportID?', getRoute: (iouType: string, reportID = '') => `${iouType}/new/address/${reportID}` as const, }, - MONEY_REQUEST_EDIT_WAYPOINT: { - route: 'r/:threadReportID/edit/distance/:transactionID/waypoint/:waypointIndex', - getRoute: (threadReportID: number, transactionID: string, waypointIndex: number) => `r/${threadReportID}/edit/distance/${transactionID}/waypoint/${waypointIndex}` as const, - }, MONEY_REQUEST_DISTANCE_TAB: { route: ':iouType/new/:reportID?/distance', getRoute: (iouType: string, reportID = '') => `${iouType}/new/${reportID}/distance` as const, diff --git a/src/components/DistanceRequest/index.js b/src/components/DistanceRequest/index.js index 72be7c2b8873..fe0265a0b6e8 100644 --- a/src/components/DistanceRequest/index.js +++ b/src/components/DistanceRequest/index.js @@ -24,6 +24,7 @@ import variables from '@styles/variables'; import * as MapboxToken from '@userActions/MapboxToken'; import * as Transaction from '@userActions/Transaction'; import * as TransactionEdit from '@userActions/TransactionEdit'; +import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import DistanceRequestFooter from './DistanceRequestFooter'; @@ -170,7 +171,11 @@ function DistanceRequest({transactionID, report, transaction, route, isEditingRe * @param {Number} index of the waypoint to edit */ const navigateToWaypointEditPage = (index) => { - Navigation.navigate(isEditingRequest ? ROUTES.MONEY_REQUEST_EDIT_WAYPOINT.getRoute(report.reportID, transactionID, index) : ROUTES.MONEY_REQUEST_WAYPOINT.getRoute('request', index)); + Navigation.navigate( + isEditingRequest + ? ROUTES.MONEY_REQUEST_STEP_WAYPOINT.getRoute(CONST.IOU.TYPE.REQUEST, transactionID, report.reportID, index, Navigation.getActiveRouteWithoutParams()) + : ROUTES.MONEY_REQUEST_WAYPOINT.getRoute('request', index), + ); }; const getError = () => { diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx index 256ea6d4eceb..295583cf53b8 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx @@ -100,7 +100,6 @@ const MoneyRequestModalStackNavigator = createModalStackNavigator require('../../../pages/settings/Wallet/AddDebitCardPage').default as React.ComponentType, [SCREENS.IOU_SEND.ENABLE_PAYMENTS]: () => require('../../../pages/EnablePayments/EnablePaymentsPage').default as React.ComponentType, [SCREENS.MONEY_REQUEST.WAYPOINT]: () => require('../../../pages/iou/NewDistanceRequestWaypointEditorPage').default as React.ComponentType, - [SCREENS.MONEY_REQUEST.EDIT_WAYPOINT]: () => require('../../../pages/iou/MoneyRequestEditWaypointPage').default as React.ComponentType, [SCREENS.MONEY_REQUEST.DISTANCE]: () => require('../../../pages/iou/NewDistanceRequestPage').default as React.ComponentType, [SCREENS.MONEY_REQUEST.RECEIPT]: () => require('../../../pages/EditRequestReceiptPage').default as React.ComponentType, }); diff --git a/src/libs/Navigation/linkingConfig.ts b/src/libs/Navigation/linkingConfig.ts index e7080b3e72ec..277bd5aa67a8 100644 --- a/src/libs/Navigation/linkingConfig.ts +++ b/src/libs/Navigation/linkingConfig.ts @@ -428,7 +428,6 @@ const linkingConfig: LinkingOptions = { [SCREENS.MONEY_REQUEST.TAG]: ROUTES.MONEY_REQUEST_TAG.route, [SCREENS.MONEY_REQUEST.MERCHANT]: ROUTES.MONEY_REQUEST_MERCHANT.route, [SCREENS.MONEY_REQUEST.WAYPOINT]: ROUTES.MONEY_REQUEST_WAYPOINT.route, - [SCREENS.MONEY_REQUEST.EDIT_WAYPOINT]: ROUTES.MONEY_REQUEST_EDIT_WAYPOINT.route, [SCREENS.MONEY_REQUEST.RECEIPT]: ROUTES.MONEY_REQUEST_RECEIPT.route, [SCREENS.MONEY_REQUEST.DISTANCE]: ROUTES.MONEY_REQUEST_DISTANCE.route, [SCREENS.IOU_SEND.ENABLE_PAYMENTS]: ROUTES.IOU_SEND_ENABLE_PAYMENTS, diff --git a/src/libs/Navigation/types.ts b/src/libs/Navigation/types.ts index 1217e2cfa6b1..01b2fc7e3a0c 100644 --- a/src/libs/Navigation/types.ts +++ b/src/libs/Navigation/types.ts @@ -229,12 +229,6 @@ type MoneyRequestNavigatorParamList = { waypointIndex: string; threadReportID: number; }; - [SCREENS.MONEY_REQUEST.EDIT_WAYPOINT]: { - iouType: string; - transactionID: string; - waypointIndex: string; - threadReportID: number; - }; [SCREENS.MONEY_REQUEST.DISTANCE]: { iouType: ValueOf; reportID: string; diff --git a/src/pages/iou/MoneyRequestEditWaypointPage.js b/src/pages/iou/MoneyRequestEditWaypointPage.js deleted file mode 100644 index 3ea4ce579215..000000000000 --- a/src/pages/iou/MoneyRequestEditWaypointPage.js +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react'; -import IOURequestStepRoutePropTypes from './request/step/IOURequestStepRoutePropTypes'; -import IOURequestStepWaypoint from './request/step/IOURequestStepWaypoint'; - -const propTypes = { - /** Navigation route context info provided by react navigation */ - route: IOURequestStepRoutePropTypes.isRequired, -}; - -function MoneyRequestEditWaypointPage({route}) { - return ; -} - -MoneyRequestEditWaypointPage.displayName = 'MoneyRequestEditWaypointPage'; -MoneyRequestEditWaypointPage.propTypes = propTypes; -export default MoneyRequestEditWaypointPage; From e4c8dddd9de21106b83744cd021c5e258b957e1e Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 10 Jan 2024 11:12:47 -0700 Subject: [PATCH 4/8] Use the edit/create action from the route --- src/ROUTES.ts | 10 +++------- src/components/DistanceRequest/index.js | 11 ++++++++--- src/libs/Navigation/linkingConfig.ts | 1 - src/pages/iou/request/step/IOURequestStepWaypoint.js | 2 +- .../iou/request/step/withFullTransactionOrNotFound.js | 3 ++- 5 files changed, 14 insertions(+), 13 deletions(-) diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 59ebf441b8c0..37003a09a0cd 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -286,10 +286,6 @@ const ROUTES = { route: ':iouType/new/merchant/:reportID?', getRoute: (iouType: string, reportID = '') => `${iouType}/new/merchant/${reportID}` as const, }, - MONEY_REQUEST_WAYPOINT: { - route: ':iouType/new/waypoint/:waypointIndex', - getRoute: (iouType: string, waypointIndex: number) => `${iouType}/new/waypoint/${waypointIndex}` as const, - }, MONEY_REQUEST_RECEIPT: { route: ':iouType/new/receipt/:reportID?', getRoute: (iouType: string, reportID = '') => `${iouType}/new/receipt/${reportID}` as const, @@ -374,9 +370,9 @@ const ROUTES = { getUrlWithBackToParam(`create/${iouType}/tag/${transactionID}/${reportID}`, backTo), }, MONEY_REQUEST_STEP_WAYPOINT: { - route: 'create/:iouType/waypoint/:transactionID/:reportID/:pageIndex', - getRoute: (iouType: ValueOf, transactionID: string, reportID: string, pageIndex = '', backTo = '') => - getUrlWithBackToParam(`create/${iouType}/waypoint/${transactionID}/${reportID}/${pageIndex}`, backTo), + route: ':action/:iouType/waypoint/:transactionID/:reportID/:pageIndex', + getRoute: (action: ValueOf, iouType: ValueOf, transactionID: string, reportID: string, pageIndex = '', backTo = '') => + getUrlWithBackToParam(`${action}/${iouType}/waypoint/${transactionID}/${reportID}/${pageIndex}`, backTo), }, // This URL is used as a redirect to one of the create tabs below. This is so that we can message users with a link // straight to those flows without needing to have optimistic transaction and report IDs. diff --git a/src/components/DistanceRequest/index.js b/src/components/DistanceRequest/index.js index fe0265a0b6e8..0940c0d391b5 100644 --- a/src/components/DistanceRequest/index.js +++ b/src/components/DistanceRequest/index.js @@ -172,9 +172,14 @@ function DistanceRequest({transactionID, report, transaction, route, isEditingRe */ const navigateToWaypointEditPage = (index) => { Navigation.navigate( - isEditingRequest - ? ROUTES.MONEY_REQUEST_STEP_WAYPOINT.getRoute(CONST.IOU.TYPE.REQUEST, transactionID, report.reportID, index, Navigation.getActiveRouteWithoutParams()) - : ROUTES.MONEY_REQUEST_WAYPOINT.getRoute('request', index), + ROUTES.MONEY_REQUEST_STEP_WAYPOINT.getRoute( + isEditingRequest ? CONST.IOU.ACTION.EDIT : CONST.IOU.ACTION.CREATE, + CONST.IOU.TYPE.REQUEST, + transactionID, + report.reportID, + index, + Navigation.getActiveRouteWithoutParams(), + ), ); }; diff --git a/src/libs/Navigation/linkingConfig.ts b/src/libs/Navigation/linkingConfig.ts index 632afdbcbe5c..1a495e92eb80 100644 --- a/src/libs/Navigation/linkingConfig.ts +++ b/src/libs/Navigation/linkingConfig.ts @@ -433,7 +433,6 @@ const linkingConfig: LinkingOptions = { [SCREENS.MONEY_REQUEST.CATEGORY]: ROUTES.MONEY_REQUEST_CATEGORY.route, [SCREENS.MONEY_REQUEST.TAG]: ROUTES.MONEY_REQUEST_TAG.route, [SCREENS.MONEY_REQUEST.MERCHANT]: ROUTES.MONEY_REQUEST_MERCHANT.route, - [SCREENS.MONEY_REQUEST.WAYPOINT]: ROUTES.MONEY_REQUEST_WAYPOINT.route, [SCREENS.MONEY_REQUEST.RECEIPT]: ROUTES.MONEY_REQUEST_RECEIPT.route, [SCREENS.MONEY_REQUEST.DISTANCE]: ROUTES.MONEY_REQUEST_DISTANCE.route, [SCREENS.IOU_SEND.ENABLE_PAYMENTS]: ROUTES.IOU_SEND_ENABLE_PAYMENTS, diff --git a/src/pages/iou/request/step/IOURequestStepWaypoint.js b/src/pages/iou/request/step/IOURequestStepWaypoint.js index 09617026576d..13026b9f2ccd 100644 --- a/src/pages/iou/request/step/IOURequestStepWaypoint.js +++ b/src/pages/iou/request/step/IOURequestStepWaypoint.js @@ -81,7 +81,7 @@ const defaultProps = { function IOURequestStepWaypoint({ recentWaypoints, route: { - params: {iouType, pageIndex, reportID, transactionID}, + params: {action, iouType, pageIndex, reportID, transactionID}, }, transaction, userLocation, diff --git a/src/pages/iou/request/step/withFullTransactionOrNotFound.js b/src/pages/iou/request/step/withFullTransactionOrNotFound.js index 001159f944e9..7cdbb3484999 100644 --- a/src/pages/iou/request/step/withFullTransactionOrNotFound.js +++ b/src/pages/iou/request/step/withFullTransactionOrNotFound.js @@ -70,7 +70,8 @@ export default function (WrappedComponent) { transaction: { key: ({route}) => { const transactionID = lodashGet(route, 'params.transactionID', 0); - return `${transactionID === CONST.IOU.OPTIMISTIC_TRANSACTION_ID ? ONYXKEYS.COLLECTION.TRANSACTION_DRAFT : ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`; + const userAction = lodashGet(route, 'params.action', CONST.IOU.ACTION.CREATE); + return `${userAction === CONST.IOU.ACTION.CREATE ? ONYXKEYS.COLLECTION.TRANSACTION_DRAFT : ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`; }, }, })(WithFullTransactionOrNotFoundWithRef); From f55dbfdae421e011922d44de508845aa14dc7708 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 10 Jan 2024 11:24:22 -0700 Subject: [PATCH 5/8] Specify correct routes --- src/components/DistanceRequest/index.js | 9 +-------- src/pages/iou/request/step/IOURequestStepDistance.js | 5 ++++- 2 files changed, 5 insertions(+), 9 deletions(-) diff --git a/src/components/DistanceRequest/index.js b/src/components/DistanceRequest/index.js index 0940c0d391b5..b63ce337a1d9 100644 --- a/src/components/DistanceRequest/index.js +++ b/src/components/DistanceRequest/index.js @@ -172,14 +172,7 @@ function DistanceRequest({transactionID, report, transaction, route, isEditingRe */ const navigateToWaypointEditPage = (index) => { Navigation.navigate( - ROUTES.MONEY_REQUEST_STEP_WAYPOINT.getRoute( - isEditingRequest ? CONST.IOU.ACTION.EDIT : CONST.IOU.ACTION.CREATE, - CONST.IOU.TYPE.REQUEST, - transactionID, - report.reportID, - index, - Navigation.getActiveRouteWithoutParams(), - ), + ROUTES.MONEY_REQUEST_STEP_WAYPOINT.getRoute(CONST.IOU.ACTION.EDIT, CONST.IOU.TYPE.REQUEST, transactionID, report.reportID, index, Navigation.getActiveRouteWithoutParams()), ); }; diff --git a/src/pages/iou/request/step/IOURequestStepDistance.js b/src/pages/iou/request/step/IOURequestStepDistance.js index ddf692fedd46..9549a93c8124 100644 --- a/src/pages/iou/request/step/IOURequestStepDistance.js +++ b/src/pages/iou/request/step/IOURequestStepDistance.js @@ -21,6 +21,7 @@ import variables from '@styles/variables'; import * as IOU from '@userActions/IOU'; import * as MapboxToken from '@userActions/MapboxToken'; import * as Transaction from '@userActions/Transaction'; +import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; import IOURequestStepRoutePropTypes from './IOURequestStepRoutePropTypes'; import StepScreenWrapper from './StepScreenWrapper'; @@ -102,7 +103,9 @@ function IOURequestStepDistance({ * @param {Number} index of the waypoint to edit */ const navigateToWaypointEditPage = (index) => { - Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_WAYPOINT.getRoute(iouType, transactionID, reportID, index)); + Navigation.navigate( + ROUTES.MONEY_REQUEST_STEP_WAYPOINT.getRoute(CONST.IOU.ACTION.CREATE, CONST.IOU.TYPE.REQUEST, transactionID, report.reportID, index, Navigation.getActiveRouteWithoutParams()), + ); }; const navigateToNextStep = useCallback(() => { From a2b7f1045c3eb7a4bbbc97989e3d24143eca163d Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 10 Jan 2024 11:42:57 -0700 Subject: [PATCH 6/8] Fix draft logic --- src/libs/actions/Transaction.ts | 2 +- src/pages/iou/request/step/IOURequestStepWaypoint.js | 11 ++++++++--- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/src/libs/actions/Transaction.ts b/src/libs/actions/Transaction.ts index 674d0c000656..430de0557674 100644 --- a/src/libs/actions/Transaction.ts +++ b/src/libs/actions/Transaction.ts @@ -58,7 +58,7 @@ function addStop(transactionID: string) { } function saveWaypoint(transactionID: string, index: string, waypoint: RecentWaypoint | null, isDraft = false) { - Onyx.merge(`${isDraft ? ONYXKEYS.COLLECTION.TRANSACTION : ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`, { + Onyx.merge(`${isDraft ? ONYXKEYS.COLLECTION.TRANSACTION_DRAFT : ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`, { comment: { waypoints: { [`waypoint${index}`]: waypoint, diff --git a/src/pages/iou/request/step/IOURequestStepWaypoint.js b/src/pages/iou/request/step/IOURequestStepWaypoint.js index 13026b9f2ccd..a718726a2c73 100644 --- a/src/pages/iou/request/step/IOURequestStepWaypoint.js +++ b/src/pages/iou/request/step/IOURequestStepWaypoint.js @@ -81,7 +81,7 @@ const defaultProps = { function IOURequestStepWaypoint({ recentWaypoints, route: { - params: {action, iouType, pageIndex, reportID, transactionID}, + params: {action, backTo, iouType, pageIndex, reportID, transactionID}, }, transaction, userLocation, @@ -135,7 +135,7 @@ function IOURequestStepWaypoint({ return errors; }; - const saveWaypoint = (waypoint) => Transaction.saveWaypoint(transactionID, pageIndex, waypoint, false); + const saveWaypoint = (waypoint) => Transaction.saveWaypoint(transactionID, pageIndex, waypoint, action === CONST.IOU.ACTION.CREATE); const submit = (values) => { const waypointValue = values[`waypoint${pageIndex}`] || ''; @@ -180,7 +180,12 @@ function IOURequestStepWaypoint({ address: values.address, name: values.name || null, }; - Transaction.saveWaypoint(transactionID, pageIndex, waypoint, false); + console.log('timddd action', action); + Transaction.saveWaypoint(transactionID, pageIndex, waypoint, action === CONST.IOU.ACTION.CREATE); + if (backTo) { + Navigation.goBack(backTo); + return; + } Navigation.goBack(ROUTES.MONEY_REQUEST_CREATE_TAB_DISTANCE.getRoute(iouType, transactionID, reportID)); }; From 1f72b5f1ae31765183a2a7f51a450f1e9e27b1ff Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 10 Jan 2024 11:43:18 -0700 Subject: [PATCH 7/8] Remove debug --- src/pages/iou/request/step/IOURequestStepWaypoint.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/iou/request/step/IOURequestStepWaypoint.js b/src/pages/iou/request/step/IOURequestStepWaypoint.js index a718726a2c73..1087018eeed9 100644 --- a/src/pages/iou/request/step/IOURequestStepWaypoint.js +++ b/src/pages/iou/request/step/IOURequestStepWaypoint.js @@ -180,7 +180,6 @@ function IOURequestStepWaypoint({ address: values.address, name: values.name || null, }; - console.log('timddd action', action); Transaction.saveWaypoint(transactionID, pageIndex, waypoint, action === CONST.IOU.ACTION.CREATE); if (backTo) { Navigation.goBack(backTo); From d83a6a5afcab6944e6692475415725a89429ef30 Mon Sep 17 00:00:00 2001 From: Tim Golen Date: Wed, 10 Jan 2024 14:41:14 -0700 Subject: [PATCH 8/8] Rename page and test in native --- .../Navigation/AppNavigator/ModalStackNavigators.tsx | 2 +- ...ypointEditorPage.js => MoneyRequestWaypointPage.js} | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) rename src/pages/iou/{NewDistanceRequestWaypointEditorPage.js => MoneyRequestWaypointPage.js} (82%) diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx index 0215cb8a3485..b0f33af0ce2e 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx @@ -103,7 +103,7 @@ const MoneyRequestModalStackNavigator = createModalStackNavigator require('../../../pages/AddPersonalBankAccountPage').default as React.ComponentType, [SCREENS.IOU_SEND.ADD_DEBIT_CARD]: () => require('../../../pages/settings/Wallet/AddDebitCardPage').default as React.ComponentType, [SCREENS.IOU_SEND.ENABLE_PAYMENTS]: () => require('../../../pages/EnablePayments/EnablePaymentsPage').default as React.ComponentType, - [SCREENS.MONEY_REQUEST.WAYPOINT]: () => require('../../../pages/iou/NewDistanceRequestWaypointEditorPage').default as React.ComponentType, + [SCREENS.MONEY_REQUEST.WAYPOINT]: () => require('../../../pages/iou/MoneyRequestWaypointPage').default as React.ComponentType, [SCREENS.MONEY_REQUEST.DISTANCE]: () => require('../../../pages/iou/NewDistanceRequestPage').default as React.ComponentType, [SCREENS.MONEY_REQUEST.RECEIPT]: () => require('../../../pages/EditRequestReceiptPage').default as React.ComponentType, }); diff --git a/src/pages/iou/NewDistanceRequestWaypointEditorPage.js b/src/pages/iou/MoneyRequestWaypointPage.js similarity index 82% rename from src/pages/iou/NewDistanceRequestWaypointEditorPage.js rename to src/pages/iou/MoneyRequestWaypointPage.js index 81f4c4f0c7d6..2f8b8b9cc729 100644 --- a/src/pages/iou/NewDistanceRequestWaypointEditorPage.js +++ b/src/pages/iou/MoneyRequestWaypointPage.js @@ -32,7 +32,7 @@ const defaultProps = { // This component is responsible for grabbing the transactionID from the IOU key // You can't use Onyx props in the withOnyx mapping, so we need to set up and access the transactionID here, and then pass it down so that WaypointEditor can subscribe to the transaction. -function NewDistanceRequestWaypointEditorPage({transactionID, route}) { +function MoneyRequestWaypointPage({transactionID, route}) { return ( iou && iou.transactionID}, -})(NewDistanceRequestWaypointEditorPage); +})(MoneyRequestWaypointPage);