text: import React, {Component} from 'react';
  import {connect} from 'react-redux';
  import {bindActionCreators} from 'redux';
  import {fetchWeather} from '../actions/index';
  
  export class SearchBar extends Component {
      constructor(props) {
          super(props);
  
          this.state = {
              term: ''
          };
  
          this.onInputChange = this.onInputChange.bind(this);
          this.onFormSubmit = this.onFormSubmit.bind(this);
      } 
  
      onFormSubmit(event) {
          event.preventDefault();
  
          this.props.fetchWeather(this.state.term);
          this.setState({term: ''});
      }
         
      onInputChange(event) {
          this.setState({
              term: event.target.value
          })
      }
  
      render(){
          return (
              <div>
                  <form onSubmit={this.onFormSubmit} className="input-group" action="">
                      <input 
                          placeholder="get a five day forecast"
                          className="form-control"
                          value={this.state.term}
                          onChange={this.onInputChange}
                      />
                      <span className="input-group-btn">
                          <button type="submit" className="btn btn-secondary">Search</button>
                      </span>
                  </form>
              </div>
          )
      }
  }
  
  function mapDispatchToProps(dispatch) {
      return bindActionCreators({fetchWeather}, dispatch)
  }
  
  export default connect(null, mapDispatchToProps)(SearchBar);