react-places-autocomplete
react-places-autocomplete copied to clipboard
Retrieving the establishments bussines
Do you want to request a feature or report a bug? feature What is the current behavior? There is not a establishment name What is the expected behavior? In the official api you can use getPlace() the pull the actual name of the establishment, am I missing something?
Hey @forrestblade I thought I'd reply because I've just been working on something which led me to this issue too. This component looks to be using the AutoComplete service which doesn't include the Place Name only the Place Id https://developers.google.com/places/web-service/autocomplete
To get around this in my app, I had to make a second call to the PlacesService and pass the id which react-places-autocomplete returned - https://developers.google.com/maps/documentation/javascript/reference/3.exp/places-service - and then I could pick out what was missing from the initial response.
Not the smoothest, but it was the best I could do with what I could find, if you found a better workaround then please share!
Yeah, I too looked into this, and it's just a limitation of Google autocomplete API upstream !!! Open an issue/request a feature with them 😉 I'd really like to have this as well.
We could maybe add some hybrid functionalities in this component, from both of Google's apis, but it might also not be best. What do you guys think ?
Seems like there should be a getDetails(placeId)
util method added which calls the Google Maps Places Service method getDetails since it provides much more detailed place information (e.g., address, name, rating, reviews, photos, etc.). My flow is the user enters a place name and I want to display some of the place details.
The Google JS API around fetching place details is a little icky (it requires a DOM node to instantiate), however it's not too difficult to work with. For anyone looking to do the same, here's what I came up with:
const getPlace = ({ fields, placeId, sessionToken }) => {
return new Promise((resolve, reject) => {
const placesService = new window.google.maps.places.PlacesService(document.createElement('div'));
placesService.getDetails(
{
fields,
placeId,
sessionToken,
},
(place, result) => {
if (result === 'OK') {
resolve(place);
} else {
reject(new Error(`Fetching place details for ${placeId} failed with ${result}`));
}
}
);
});
};
Doing something like this is required if you want to use session tokens (related to https://github.com/hibiken/react-places-autocomplete/issues/263).
(it requires a DOM node to instantiate) ...
const placesService = new window.google.maps.places.PlacesService(document.createElement('div'));
This is incorrect, a Node/Element is not required.
Also, please remember to limit fields in the details request so that you are not charged for data that you do not need!