import React from 'react';
import Map, {GoogleApiWrapper} from 'google-maps-react';

import { searchNearby } from 'utils/googleApiHelpers';

export class Container extends React.Component {
	onReady(mapProps, map) {
		// when map is ready and 
		const { google } = this.props;
		const opts = {
			location: map.center,
			radius: '500',
			types: ['cafe']
		}
		searchNearby(google, map, opts)
			.then((results, pagination) => {
				// we got some results and a pagination object
			}).catch((status, result) => {
				// there was an error
			})
	}
	render() {
		return (
			<div>
				<Map 
					onReady={this.onReady.bind(this)}
					google={this.props.google} />
			</div>
		)
	}
}

export default GoogleApiWrapper({
	apiKey: __GAPI_KEY__
})(Container);
@@ -183,16 +183,142 @@
 onent %7B%0A
+%09constructor(props) %7B%0A%09%09// super initializes this%0A%09%09super(props);%0A%0A%09%09this.state = %7B%0A%09%09%09places: %5B%5D,%0A%09%09%09pagination: null%0A%09%09%7D%0A%09%7D%0A
 %09onReady
@@ -358,20 +358,16 @@
 s ready 
-and 
 %0A%09%09const
@@ -596,16 +596,81 @@
  object%0A
+%09%09%09%09this.setState(%7B%0A%09%09%09%09%09places: results,%0A%09%09%09%09%09pagination%0A%09%09%09%09%7D)%0A
 %09%09%09%7D).ca
@@ -843,17 +843,153 @@
 google%7D 
-/
+%0A%09%09%09%09%09visible=%7Bfalse%7D %3E%0A%0A%09%09%09%09%09%7Bthis.state.places.map(place =%3E %7B%0A%09%09%09%09%09%09return (%3Cdiv key=%7Bplace.id%7D%3E%7Bplace.name%7D%3C/div%3E)%0A%09%09%09%09%09%7D)%7D%0A%0A%09%09%09%09%3C/Map
 %3E%0A%09%09%09%3C/d

Set Main container to be stateful