location bias feature implementation

src/components/AddressSearch/index.js

@@ -111,6 +111,9 @@ const propTypes = {
     /** Information about the network */
     network: networkPropTypes.isRequired,
 
+    /** location bias based on rectangular format */
+    locationBias: PropTypes.string,
+
     ...withLocalizePropTypes,
 };
 
@@ -138,6 +141,7 @@ const defaultProps = {
     maxInputLength: undefined,
     predefinedPlaces: [],
     resultTypes: 'address',
+    locationBias: undefined,
 };
 
 function AddressSearch({
@@ -162,6 +166,7 @@ function AddressSearch({
     shouldSaveDraft,
     translate,
     value,
+    locationBias,
 }) {
     const theme = useTheme();
     const styles = useThemeStyles();
@@ -179,11 +184,11 @@ function AddressSearch({
             language: preferredLocale,
             types: resultTypes,
             components: isLimitedToUSA ? 'country:us' : undefined,
+            locationbias: locationBias || 'ipbias',
         }),
-        [preferredLocale, resultTypes, isLimitedToUSA],
+        [preferredLocale, resultTypes, isLimitedToUSA, locationBias],
     );
     const shouldShowCurrentLocationButton = canUseCurrentLocation && searchValue.trim().length === 0 && isFocused;
-
     const saveLocationDetails = (autocompleteData, details) => {
         const addressComponents = details.address_components;
         if (!addressComponents) {

src/pages/iou/request/step/IOURequestStepWaypoint.js

@@ -1,5 +1,6 @@
 import {useNavigation} from '@react-navigation/native';
 import lodashGet from 'lodash/get';
+import lodashIsNil from 'lodash/isNil';
 import PropTypes from 'prop-types';
 import React, {useMemo, useRef, useState} from 'react';
 import {View} from 'react-native';
@@ -38,6 +39,15 @@ const propTypes = {
     /** The optimistic transaction for this request */
     transaction: transactionPropTypes,
 
+    /* Current location coordinates of the user */
+    userLocation: PropTypes.shape({
+        /** Latitude of the location */
+        latitude: PropTypes.number,
+
+        /** Longitude of the location */
+        longitude: PropTypes.number,
+    }),
+
     /** Recent waypoints that the user has selected */
     recentWaypoints: PropTypes.arrayOf(
         PropTypes.shape({
@@ -65,6 +75,7 @@ const propTypes = {
 const defaultProps = {
     recentWaypoints: [],
     transaction: {},
+    userLocation: undefined,
 };
 
 function IOURequestStepWaypoint({
@@ -73,6 +84,7 @@ function IOURequestStepWaypoint({
         params: {iouType, pageIndex, reportID, transactionID},
     },
     transaction,
+    userLocation,
 }) {
     const styles = useThemeStyles();
     const {windowWidth} = useWindowDimensions();
@@ -83,6 +95,7 @@ function IOURequestStepWaypoint({
     const {isOffline} = useNetwork();
     const textInput = useRef(null);
     const parsedWaypointIndex = parseInt(pageIndex, 10);
+    const directionCoordinates = lodashGet(transaction, 'routes.route0.geometry.coordinates', []);
     const allWaypoints = lodashGet(transaction, 'comment.waypoints', {});
     const currentWaypoint = lodashGet(allWaypoints, `waypoint${pageIndex}`, {});
 
@@ -100,6 +113,65 @@ function IOURequestStepWaypoint({
         }
     }, [parsedWaypointIndex, waypointCount]);
 
+    // Construct the rectangular boundary based on user location, waypoints and direction coordinates
+    const locationBias = useMemo(() => {
+        // If there are no filled wayPoints and if user's current location cannot be retrieved,
+        // it is futile to arrive at a biased location. Let's return
+        if (filledWaypointCount === 0 && _.isEmpty(userLocation)) {
+            return null;
+        }
+
+        // Gather the longitudes and latitudes from filled waypoints.
+        const longitudes = _.filter(
+            _.map(allWaypoints, (waypoint) => {
+                if (!waypoint || lodashIsNil(waypoint.lng)) {
+                    return;
+                }
+                return waypoint.lng;
+            }),
+            (lng) => lng,
+        );
+        const latitudes = _.filter(
+            _.map(allWaypoints, (waypoint) => {
+                if (!waypoint || lodashIsNil(waypoint.lat)) {
+                    return;
+                }
+                return waypoint.lat;
+            }),
+            (lat) => lat,
+        );
+
+        // We will get direction coordinates when user is adding a stop after filling the Start and Finish waypoints.
+        // Include direction coordinates when available.
+        if (_.size(directionCoordinates) > 0) {
+            longitudes.push(..._.map(directionCoordinates, (coordinate) => coordinate[0]));
+            latitudes.push(..._.map(directionCoordinates, (coordinate) => coordinate[1]));
+        }
+
+        // When no filled waypoints are available but the current location of the user is available,
+        // let us consider the current user's location to construct a rectangular bound
+        if (filledWaypointCount === 0 && !_.isEmpty(userLocation)) {
+            longitudes.push(userLocation.longitude);
+            latitudes.push(userLocation.latitude);
+        }
+
+        // Extend the rectangular bound by 0.5 degree (roughly around 25-30 miles in US)
+        const minLat = Math.min(...latitudes) - 0.5;
+        const minLng = Math.min(...longitudes) - 0.5;
+        const maxLat = Math.max(...latitudes) + 0.5;
+        const maxLng = Math.max(...longitudes) + 0.5;
+
+        // Ensuring coordinates do not go out of range.
+        const south = minLat > -90 ? minLat : -90;
+        const west = minLng > -180 ? minLng : -180;
+        const north = maxLat < 90 ? maxLat : 90;
+        const east = maxLng < 180 ? maxLng : 180;
+
+        // Format: rectangle:south,west|north,east
+        const rectFormat = `rectangle:${south},${west}|${north},${east}`;
+        return rectFormat;
+    }, [userLocation, directionCoordinates, filledWaypointCount, allWaypoints]);
+
     const waypointAddress = lodashGet(currentWaypoint, 'address', '');
     // Hide the menu when there is only start and finish waypoint
     const shouldShowThreeDotsButton = waypointCount > 2;
@@ -219,6 +291,7 @@ function IOURequestStepWaypoint({
                     <View>
                         <InputWrapperWithRef
                             InputComponent={AddressSearch}
+                            locationBias={locationBias}
                             canUseCurrentLocation
                             inputID={`waypoint${pageIndex}`}
                             ref={(e) => (textInput.current = e)}
@@ -257,6 +330,9 @@ export default compose(
     withWritableReportOrNotFound,
     withFullTransactionOrNotFound,
     withOnyx({
+        userLocation: {
+            key: ONYXKEYS.USER_LOCATION,
+        },
         recentWaypoints: {
             key: ONYXKEYS.NVP_RECENT_WAYPOINTS,