I am new to React and trying to figure out how to enter information into a table onSubmit. i have tried to follow tutorials but when you are new, its difficult to know what your following. The output I hope to achieve is to enter a workout into the text box, choose a day for said work out and upon pressing the submission button, the work out populates the table matching the day chosen

I appreciate my code may not be great. However, any help here would be great. 

```
import './App.css';
import 'bootstrap/dist/css/bootstrap.css';
import Header from './components/Header';
import WorkOutList from './components/WorkoutList';
//import WorkoutAdder from './components/WorkoutAdder';
import WeightAdder from './components/WeightAdder';

function App() {
  return (
    <div className="App">
      <Header />
      <WorkOutList />
      <WeightAdder />
    </div>
  );
}

export default App;

import React from 'react';

class WorkoutAdder extends React.Component {
  state = {
    workout: '',
    day: ''
  };

  handleInputChange = event => {
    this.setState({ [event.target.name]: event.target.value });
  };

  render() {
    console.log(this.state);
    return (
      <div>
        <p>Todays Workout is:{this.props.dayMatcher[0].exercise}</p>
        <form onSubmit={this.props.handleSubmit}>
          <h4>Select a day to add workout </h4>
          <label htmlFor="day" id="day" />
          <select
            className="btn btn-primary dropdown-toggle"
            type="text"
            name="day"
            onChange={this.handleInputChange}
          >
            <option value="n/a">pick a day</option>
            <option value="Mon"> Mon</option>
            <option value="Tue"> Tue</option>
            <option value="Wed"> Wed</option>
            <option value="Thu"> Thu</option>
            <option value="Fri"> Fri</option>
            <option value="Sat"> Sat</option>
          </select>
          <br />
          <br />
          <input
            type="text"
            placeholder="Enter Workout Here"
            name="workout"
            onChange={this.handleInputChange}
          />
        </form>
        <br />
        <p>
          <button
            onClick={this.handleSubmit}
            className="btn btn-primary btn-sm"
          >
            {' '}
            Add Workout
          </button>
        </p>
      </div>
    );
  }
}

export default WorkoutAdder;

import React from 'react';
import WorkoutAdder from './WorkoutAdder';

class WorkOutList extends React.Component {
  state = {
    workout: [
      { exercise: '', day: 'Mon', weight: 0, dayNum: 1 },
      { exercise: '', day: 'Tue', weight: 0, dayNum: 2 },
      { exercise: '', day: 'Wed', weight: 0, dayNum: 3 },
      { exercise: '', day: 'Thu', weight: 0, dayNum: 4 },
      { exercise: 'Yoga', day: 'Fri', weight: 0, dayNum: 5 },
      { exercise: '', day: 'Sat', weight: 0, dayNum: 6 }
    ]
  };

  handleSubmit = event => {
    event.preventDefault();
    this.setState(currentState => {
      let copyArr = [...currentState.workout];
      let newArr = copyArr.map(copy => {
        const copyWorkout = copy;
        copyWorkout.exercise = copyArr.push(this.props.handleInputChange);
        console.log(copyWorkout);
        return copyWorkout;
      });
      console.log(newArr);
      this.setState({ newArr });
    });
  };

  render() {
    const getToday = new Date().getDay();

    const dayMatcher = this.state.workout.filter(d => {
      if (d.dayNum === getToday) {
        return d.day;
      }
      return this.dayMatcher;
    });
    // console.log(new Date());
    // const theDate = new Date();
    // console.log(theDate.getDay());
    return (
      <>
        <WorkoutAdder
          dayMatcher={dayMatcher}
          handleSubmit={this.handleSubmit}
        />

        <div className="grid-container">
          {this.state.workout.map(exercise => {
            return (
              <div className="grid-item" key={exercise.day}>
                {exercise.day}-{exercise.exercise}
              </div>
            );
          })}
        </div>
      </>
    );
  }
}

export default WorkOutList;

```