fix: sort valid waypoints

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;

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')}
             />
         </ScrollView>

src/libs/TransactionUtils.js

@@ -302,14 +302,24 @@ 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
  * @param {Boolean} reArrangeIndexes
  * @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,
 };