Unify default search data and avoid place details API call

src/components/LocationAutocompleteInput/GeocoderGoogleMaps.js

@@ -1,8 +1,11 @@
 import React from 'react';
+// import { types as sdkTypes } from '../../util/sdkLoader';
 import { getPlacePredictions, getPlaceDetails, locationBounds } from '../../util/googleMaps';
 import { userLocation } from '../../util/maps';
 import css from './LocationAutocompleteInput.css';
 
+// const { LatLng: SDKLatLng, LatLngBounds: SDKLatLngBounds } = sdkTypes;
+
 export const CURRENT_LOCATION_ID = 'current-location';
 const CURRENT_LOCATION_BOUNDS_DISTANCE = 1000; // meters
 
@@ -10,29 +13,24 @@ const CURRENT_LOCATION_BOUNDS_DISTANCE = 1000; // meters
 // focuses on the autocomplete input without typing a search. This can
 // be used to reduce typing and Geocoding API calls for common
 // searches.
-//
-// Example:
-//
-// [
-//   {
-//     place_id: 'Place ID from Google Maps Places API',
-//     description: 'Place name to show in the autocomplete dropdown',
-//   },
-// ]
-//
-// To know which values to set as defaults, log a real prediction
-// object from the Places API call and copy the Place ID from the
-// response.
 export const defaultPredictions = [
-  // // Current user location
+  // Examples:
+  // Current user location from the browser geolocation API
   // {
-  //   place_id: CURRENT_LOCATION_ID,
-  //   // LocationAutocompleteInputImpl adds the text from the translations
-  //   description: '',
+  //   id: CURRENT_LOCATION_ID,
+  //   predictionPlace: {},
   // },
+  // Helsinki
   // {
-  //   place_id: 'ChIJkQYhlscLkkYRY_fiO4S9Ts0',
-  //   description: 'Helsinki, Finland',
+  //   id: 'default-helsinki',
+  //   predictionPlace: {
+  //     address: 'Helsinki, Finland',
+  //     origin: new SDKLatLng(60.16985, 24.93837),
+  //     bounds: new SDKLatLngBounds(
+  //       new SDKLatLng(60.29783, 25.25448),
+  //       new SDKLatLng(59.92248, 24.78287)
+  //     ),
+  //   },
   // },
 ];
 
@@ -81,6 +79,11 @@ class GeocoderGoogleMaps {
    * Get the ID of the given prediction.
    */
   getPredictionId(prediction) {
+    if (prediction.predictionPlace) {
+      // default prediction defined above
+      return prediction.id;
+    }
+    // prediction from Google Maps Places API
     return prediction.place_id;
   }
 
@@ -88,6 +91,11 @@ class GeocoderGoogleMaps {
    * Get the address text of the given prediction.
    */
   getPredictionAddress(prediction) {
+    if (prediction.predictionPlace) {
+      // default prediction defined above
+      return prediction.predictionPlace.address;
+    }
+    // prediction from Google Maps Places API
     return prediction.description;
   }
 
@@ -109,6 +117,10 @@ class GeocoderGoogleMaps {
       });
     }
 
+    if (prediction.predictionPlace) {
+      return Promise.resolve(prediction.predictionPlace);
+    }
+
     return getPlaceDetails(prediction.place_id, this.getSessionToken()).then(place => {
       this.sessionToken = null;
       return place;

src/components/LocationAutocompleteInput/GeocoderMapbox.js

@@ -15,10 +15,6 @@ const locationBounds = (latlng, distance) => {
   );
 };
 
-const placeId = prediction => prediction.id;
-
-const placeAddress = prediction => prediction.place_name;
-
 const placeOrigin = prediction => {
   if (prediction && Array.isArray(prediction.center) && prediction.center.length === 2) {
     // Coordinates in Mapbox features are represented as [longitude, latitude].
@@ -42,33 +38,24 @@ const placeBounds = prediction => {
 // focuses on the autocomplete input without typing a search. This can
 // be used to reduce typing and Geocoding API calls for common
 // searches.
-//
-// Example:
-//
-// [
-//   {
-//     id: 'any unique id',
-//     place_name: 'Place name to show in the autocomplete dropdown',
-//     center: [longitude, latitude],
-//     bbox: [minX, minY, maxX, maxY],
-//   },
-// ]
-//
-// To know which values to set as defaults, log a real prediction
-// object from the Geocoding API call and check the values from the
-// response.
 export const defaultPredictions = [
-  // // Current user location
+  // Examples:
+  // Current user location from the browser geolocation API
   // {
   //   id: CURRENT_LOCATION_ID,
-  //   // LocationAutocompleteInputImpl adds the text from the translations
-  //   place_name: '',
+  //   predictionPlace: {},
   // },
+  // Helsinki
   // {
   //   id: 'default-helsinki',
-  //   place_name: 'Helsinki, Finland',
-  //   center: [24.94861, 60.17333],
-  //   bbox: [24.82617, 60.075361, 25.313112, 60.297839],
+  //   predictionPlace: {
+  //     address: 'Helsinki, Finland',
+  //     origin: new SDKLatLng(60.16985, 24.93837),
+  //     bounds: new SDKLatLngBounds(
+  //       new SDKLatLng(60.29783, 25.25448),
+  //       new SDKLatLng(59.92248, 24.78287)
+  //     ),
+  //   },
   // },
 ];
 
@@ -118,14 +105,19 @@ class GeocoderMapbox {
    * Get the ID of the given prediction.
    */
   getPredictionId(prediction) {
-    return placeId(prediction);
+    return prediction.id;
   }
 
   /**
    * Get the address text of the given prediction.
    */
   getPredictionAddress(prediction) {
-    return placeAddress(prediction);
+    if (prediction.predictionPlace) {
+      // default prediction defined above
+      return prediction.predictionPlace.address;
+    }
+    // prediction from Mapbox geocoding API
+    return prediction.place_name;
   }
 
   /**
@@ -146,8 +138,12 @@ class GeocoderMapbox {
       });
     }
 
+    if (prediction.predictionPlace) {
+      return Promise.resolve(prediction.predictionPlace);
+    }
+
     return Promise.resolve({
-      address: placeAddress(prediction),
+      address: this.getPredictionAddress(prediction),
       origin: placeOrigin(prediction),
       bounds: placeBounds(prediction),
     });