Solution Timeline

All versions (edits) of solutions to (React.js) Google Places Autocomplete & Semantic UI React appear below in the order they were created. Comments that appear under revisions were those created when that particular revision was current.

To see the revision history of a single solution (with diffs), click on the solution number (ie. "#1") in the upper right corner of a solution revision below.

← Bounty Expand all edits

Here's a component i did:

https://codesandbox.io/s/r0q7mnw3pn

Using the AutoComplete Service from google , i just do the query whenever handleResultSelect is done, after that the state changes. Check out "searchExample.js"

Tipped

Here's my take on the component: Autocomplete Example

This solution provides both - a title and a description field for the autocomplete, resulting in a more pleasing and readable experience.

It doesn't use any additional NPM libraries (like react-places-autocomplete), instead, it queries the Google API through the Google Maps Javascript API.

After the result is selected it's stored in this.state.selectedPlace object. The original Google place object is also retained under source (e.g. this.state.selectedPlace.source), for any further actions.

The component is based on the standard search example from Semantic UI

Winning solution