diff --git a/src/pages/iou/request/step/IOURequestStepDistance.tsx b/src/pages/iou/request/step/IOURequestStepDistance.tsx index 0d5972cffcb9..20bb33abc1ac 100644 --- a/src/pages/iou/request/step/IOURequestStepDistance.tsx +++ b/src/pages/iou/request/step/IOURequestStepDistance.tsx @@ -428,7 +428,7 @@ function IOURequestStepDistance({ item} + keyExtractor={(item) => (waypoints[item]?.keyForList ?? waypoints[item]?.address ?? '') + item} shouldUsePortal onDragEnd={updateWaypoints} ref={scrollViewRef} diff --git a/src/pages/iou/request/step/IOURequestStepWaypoint.tsx b/src/pages/iou/request/step/IOURequestStepWaypoint.tsx index 5576c3dedb8a..6c0eae98fb85 100644 --- a/src/pages/iou/request/step/IOURequestStepWaypoint.tsx +++ b/src/pages/iou/request/step/IOURequestStepWaypoint.tsx @@ -119,6 +119,7 @@ function IOURequestStepWaypoint({ name: values.name ?? '', lat: values.lat ?? 0, lng: values.lng ?? 0, + keyForList: `${(values.name ?? 'waypoint') as string}_${Date.now()}`, }; saveWaypoint(waypoint); } @@ -139,6 +140,7 @@ function IOURequestStepWaypoint({ lng: values.lng ?? 0, address: values.address ?? '', name: values.name ?? '', + keyForList: `${values.name ?? 'waypoint'}_${Date.now()}`, }; Transaction.saveWaypoint(transactionID, pageIndex, waypoint, action === CONST.IOU.ACTION.CREATE); diff --git a/src/types/onyx/RecentWaypoint.ts b/src/types/onyx/RecentWaypoint.ts index 55232f7ef71d..6ed55e080560 100644 --- a/src/types/onyx/RecentWaypoint.ts +++ b/src/types/onyx/RecentWaypoint.ts @@ -10,6 +10,9 @@ type RecentWaypoint = { /** The longitude of the waypoint */ lng?: number; + + /** A unique key for waypoint is required for correct draggable list rendering */ + keyForList?: string; }; export default RecentWaypoint; diff --git a/src/types/onyx/Transaction.ts b/src/types/onyx/Transaction.ts index 5ed318b21ce5..dd02c4ea4a07 100644 --- a/src/types/onyx/Transaction.ts +++ b/src/types/onyx/Transaction.ts @@ -38,6 +38,9 @@ type Waypoint = { /** Address street line 2 */ street2?: string; + + /** A unique key for waypoint is required for correct draggable list rendering */ + keyForList?: string; }; type WaypointCollection = Record;