content: import React, { Component } from 'react';
  import City from './City';
  import CurrentWeather from './CurrentWeather';
  import Options from './Options';
  import Forecast from './Forecast';
  import axios from 'axios';
  import { connect } from 'react-redux';
  import { formatCurrent, formatForecast } from '../helpers/dataFormatter';
  import { mapAppState } from '../mappers/propMapper';
  import { mapAppDispatch } from '../mappers/dispatchMapper';
  
  export class App extends Component {
      static propTypes = {
          city:           React.PropTypes.string,
          current:        React.PropTypes.object,
          unit:           React.PropTypes.string,
          forecast:       React.PropTypes.array,
          setCurrent:     React.PropTypes.func,
          setForecast:    React.PropTypes.func
      }
  
      refreshWeatherData() {
          const { city, unit, setCurrent, setForecast } = this.props;
          const url   = '/current?city='+ city + '&units=' + unit;
          const url2  = '/forecast?city='+ city + '&units=' + unit;
  
          axios.get(url)
              .then((response) => {
                  // THIS CAN BE HANDLED ON BA SIDE
                  setCurrent(formatCurrent(response.data));
              })
              .catch(() => {
                  setCurrent({});
                  // TODO HANDLE ERROR
              });
  
          axios.get(url2)
              .then((response) => {
                  // THIS CAN BE HANDLED ON BA SIDE
                  setForecast(formatForecast(response.data));
              })
              .catch(() => {
                  setForecast([]);
                  // TODO HANDLE ERROR
              });
      }
  
      render() {
          const { city, current, forecast, unit } = this.props;
  
          return (
              <div className="container">
                  <City name={city} />
                  <CurrentWeather current={current} unit={unit}/>
                  <Forecast forecast={forecast} unit={unit}/>
                  <Options refreshWeatherData={this.refreshWeatherData} />
              </div>
          );
      }
  }
  
  export default connect(mapAppState, mapAppDispatch)(App);
  