mapPropsToDispatch-UserInput

import React, { Component } from "react";
import { connect } from 'react-redux';

//Add the Code below to add the action addTask.
import { addTask } from '../actions/TaskAction';


class UserInput extends Component {

  constructor(props) {
    super(props);

    this.state = {
      task: ''
    };
  }

  handleChange(event) {
    this.setState({
      task: event.target.value
    });
  }

  handleOnSubmit(event) {
    event.preventDefault();

    //Using the action addTask below in order to package the data for the reducer.
    this.props.dispatch(addTask(this.state.task))
  }

  render() {

    return(
      <form onSubmit={(event) => this.handleOnSubmit(event)}>
      <p>
        <input
          type="text"
          onChange={(event) => this.handleChange(event)}
          placeholder="enter name"/>
      </p>

        <input type="submit" />
      </form>
    )
  }
}

export default connect(undefined)(UserInput)