/**
* Autocomplete Input for Google Places API
* @flow
*/
import React, {Component} from 'react';
import { Input } from 'native-base';
import {get} from '../utils/request';
class GooglePlacesAutocomplete extends Component {
state = {
text: this.props.value
};
/**
* @returns {Promise.<*>}
*/
async _request(data) {
try {
return await get('https://maps.googleapis.com/maps/api/place/autocomplete/json', data);
} catch (e) {
return e
}
}
async _onChangeText(text) {
const {onChangeData, onSuggestionError} = this.props;
try {
let response = await this._request({input: text, ...this.props.query});
if(onChangeData){
onChangeData(response.predictions);
}
} catch (e) {
if(onSuggestionError) {
onSuggestionError(e)
}
}
}
async _handleChangeText(text) {
this._onChangeText(text).catch(() => {});
const {onChangeText} = this.props;
if (onChangeText) {
onChangeText(text);
}
}
render = () => (
<Input {...{
...this.props,
...this.state,
onChangeText: text => this._handleChangeText(text),
value: this.state.text,
}} />
);
}
GooglePlacesAutocomplete.defaultProps = {
query: {
key: 'missing api key',
language: 'en',
types: 'geocode',
},
data: []
};
export default GooglePlacesAutocomplete;