Make placenames searchable on search field playground map

[maxvisser]

Description

As a result from alpha testing we came to the conclusion that volunteers are searching on cities instead of known playinggrounds.

DoD:

• [x] Add google maps search to search field, all dutch cities should be searchable.
• [x] Zoom in on city when city exists.

[KarafiziArtur]

After a little researching I see several options to do it:

• add a new field "city" ({ name, lat, lng }) to "playground" - it requires to change redux store and DB fields; with this change, we could implement searching by "tags" in the future (like https://github.com/TeamWertarbyte/material-ui-chip-input or https://github.com/Sharlaan/material-ui-superselectfield) during future refactoring;
• another way is just add a new input autosuggest field with hardcoded cities of the Netherlands and restrict the second search field of playgrounds by the selected city. In my opinion, the second way is faster to implement this change. @maxvisser could you please say which method is more preferable?

[maxvisser]

If there is a list of hardcoded cities and this will work I would go for the second option.

[dimitriirtimid]

I think we should look into using an api for this such as google places: https://developers.google.com/places/web-service/search

We need to investigate the costs for using this api, but considering our modest load I do not except this will amount to much

[KarafiziArtur]

@dimitriirtimid there is a cost 17$ per 1000 requests to find places. https://developers.google.com/places/web-service/usage-and-billing

[maxvisser]

As Arthur already has a big list of places with lat/longs; I think using the api for this is abit overkill as I don't think we will use the api for anything else.

[KarafiziArtur]

https://github.com/local-motion/onboarding-web/pull/357