diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index aa7c38e0c535..6790e8ae4d65 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -8,6 +8,7 @@ import _ from 'underscore'; import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; import * as MapboxToken from '../libs/actions/MapboxToken'; +import * as TransactionUtils from '../libs/TransactionUtils'; import * as Expensicons from './Icon/Expensicons'; import theme from '../styles/themes/default'; import styles from '../styles/styles'; @@ -47,7 +48,7 @@ const getWaypointMarkers = (waypoints) => { return; } - const index = Number(key.replace('waypoint', '')); + const index = TransactionUtils.getWaypointIndex(key); let MarkerComponent; if (index === 0) { MarkerComponent = Expensicons.DotIndicatorUnfilled; diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index efaf42639567..bb544ff13d30 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -90,7 +90,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) const lastWaypointIndex = numberOfWaypoints - 1; const isLoadingRoute = lodashGet(transaction, 'comment.isLoading', false); - const hasRouteError = lodashHas(transaction, 'errorFields.route'); + const hasRouteError = !!lodashGet(transaction, 'errorFields.route'); const haveWaypointsChanged = !_.isEqual(previousWaypoints, waypoints); const doesRouteExist = lodashHas(transaction, 'routes.route0.geometry.coordinates'); const validatedWaypoints = TransactionUtils.getValidWaypoints(waypoints); @@ -103,7 +103,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) return; } - const index = Number(key.replace('waypoint', '')); + const index = TransactionUtils.getWaypointIndex(key); let MarkerComponent; if (index === 0) { MarkerComponent = Expensicons.DotIndicatorUnfilled; @@ -181,7 +181,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) > {_.map(waypoints, (waypoint, key) => { // key is of the form waypoint0, waypoint1, ... - const index = Number(key.replace('waypoint', '')); + const index = TransactionUtils.getWaypointIndex(key); let descriptionKey = 'distance.waypointDescription.'; let waypointIcon; if (index === 0) { @@ -263,7 +263,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) success style={[styles.w100, styles.mb4, styles.ph4, styles.flexShrink0]} onPress={() => IOU.navigateToNextPage(iou, iouType, reportID, report)} - isDisabled={_.size(validatedWaypoints) < 2} + isDisabled={_.size(validatedWaypoints) < 2 || hasRouteError || isOffline} text={translate('common.next')} /> diff --git a/src/libs/TransactionUtils.js b/src/libs/TransactionUtils.js index b99c44abad90..f5b59edd9248 100644 --- a/src/libs/TransactionUtils.js +++ b/src/libs/TransactionUtils.js @@ -302,6 +302,15 @@ function waypointHasValidAddress(waypoint) { return true; } +/** + * Converts the key of a waypoint to its index + * @param {String} key + * @returns {Number} waypoint index + */ +function getWaypointIndex(key) { + return Number(key.replace('waypoint', '')); +} + /** * Filters the waypoints which are valid and returns those * @param {Object} waypoints @@ -309,7 +318,8 @@ function waypointHasValidAddress(waypoint) { * @returns {Object} validated waypoints */ function getValidWaypoints(waypoints, reArrangeIndexes = false) { - const waypointValues = _.values(waypoints); + const sortedIndexes = _.map(_.keys(waypoints), (key) => getWaypointIndex(key)).sort(); + const waypointValues = _.map(sortedIndexes, (index) => waypoints[`waypoint${index}`]); // Ensure the number of waypoints is between 2 and 25 if (waypointValues.length < 2 || waypointValues.length > 25) { return {}; @@ -339,7 +349,6 @@ function getValidWaypoints(waypoints, reArrangeIndexes = false) { }, {}, ); - return validWaypoints; } @@ -359,4 +368,5 @@ export { getValidWaypoints, isDistanceRequest, hasMissingSmartscanFields, + getWaypointIndex, };