From 6fa1aab66531fd6402ac20cbb4f13cc49ce09e7f Mon Sep 17 00:00:00 2001
From: Diana <dianah46@gmail.com>
Date: Tue, 10 Dec 2019 21:23:37 -0800
Subject: [PATCH 1/3] npm installed, fixed typo on a css file

---
 src/components/PlayerSubmissionForm.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/PlayerSubmissionForm.css b/src/components/PlayerSubmissionForm.css
index 7cded5d9..6d6f98eb 100644
--- a/src/components/PlayerSubmissionForm.css
+++ b/src/components/PlayerSubmissionForm.css
@@ -31,7 +31,7 @@
   background-color: tomato;
 }
 
-.PlayerSubmissionFormt__input--invalid {
+.PlayerSubmissionForm__input--invalid {
   background-color: #FFE9E9;
 }
 

From f692cce2a937ee8fc6a0f499d1d38b152967d799 Mon Sep 17 00:00:00 2001
From: Diana <dianah46@gmail.com>
Date: Thu, 12 Dec 2019 23:11:24 -0800
Subject: [PATCH 2/3] added submission form

---
 src/components/PlayerSubmissionForm.js | 100 ++++++++++++++++++++++---
 1 file changed, 90 insertions(+), 10 deletions(-)

diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js
index 1de05095..b885ed8d 100644
--- a/src/components/PlayerSubmissionForm.js
+++ b/src/components/PlayerSubmissionForm.js
@@ -5,29 +5,109 @@ class PlayerSubmissionForm extends Component {
 
   constructor(props) {
     super(props);
+
+    this.state = {
+      adj: '',
+      noun: '',
+      adv: '',
+      verb: '',
+      adj2: '',
+      noun2: '',
+    }
+  }
+
+  onInputChange = (event) => {
+    const updatedState = {};
+
+    const field = event.target.name;
+    const value = event.target.value;
+
+    updatedState[field] = value;
+    this.setState(updatedState);
+  }
+
+  onSubmitLine = (event) => {
+    event.preventDefault();
+
+    const submission = {
+      adj: this.state.adj,
+      noun: this.state.noun,
+      adv: this.state.adv,
+      verb: this.state.verb,
+      adj2: this.state.adj,
+      noun2: this.state.noun2,
+    }
+
+    this.props.sendSubmission(submission);
+    this.resetForm();
   }
 
   render() {
 
     return (
-      <div className="PlayerSubmissionForm">
+      <div className='PlayerSubmissionForm'>
         <h3>Player Submission Form for Player #{  }</h3>
 
-        <form className="PlayerSubmissionForm__form" >
+        <form className='PlayerSubmissionForm__form'
+          onSubmit={this.onSubmitLine}>
 
-          <div className="PlayerSubmissionForm__poem-inputs">
+          <div className='PlayerSubmissionForm__poem-inputs'>
 
-            {
-              // Put your form inputs here... We've put in one below as an example
-            }
             <input
-              placeholder="hm..."
-              type="text" />
+              type="text"
+              htmlFor='adj'
+              placeholder='adjective'
+              onChange={this.onInputChange}
+              value={this.state.adj}
+              className="PlayerSubmissionForm__input"/>
+          
+            <input
+              type='text'
+              htmlFor='noun'
+              placeholder='noun'
+              onChange={this.onInputChange}
+              value={this.state.noun}
+              className="PlayerSubmissionForm__input"/>
+
+            <input
+              type='text'
+              htmlFor='adv'
+              placeholder='adverb'
+              onChange={this.onInputChange}
+              value={this.state.adv}
+              className="PlayerSubmissionForm__input"/>
+
+            <input
+              type='text'
+              htmlFor='verb'
+              placeholder='verb'
+              onChange={this.onInputChange}
+              value={this.state.verb}
+              className="PlayerSubmissionForm__input"/>
+
+              the
 
+            <input
+              type='text'
+              htmlFor='adj2'
+              placeholder='adjective'
+              onChange={this.onInputChange}
+              value={this.state.adj}
+              className="PlayerSubmissionForm__input"/>
+          
+            <input
+              type='text'
+              htmlFor='noun2'
+              placeholder='noun'
+              onChange={this.onInputChange}
+              value={this.state.noun2}
+              className="PlayerSubmissionForm__input"/>
+          
+          
           </div>
 
-          <div className="PlayerSubmissionForm__submit">
-            <input type="submit" value="Submit Line" className="PlayerSubmissionForm__submit-btn" />
+          <div className='PlayerSubmissionForm__submit'>
+            <input type='submit' value='Submit Line' className='PlayerSubmissionForm__submit-btn' />
           </div>
         </form>
       </div>

From 839c3dfac1a4b8283048a746cb422fb75da48be3 Mon Sep 17 00:00:00 2001
From: Diana <dianah46@gmail.com>
Date: Thu, 12 Dec 2019 23:16:00 -0800
Subject: [PATCH 3/3] passed in submission as a prop to RecentSubmission, but
 unable to type into form fields

---
 src/components/PlayerSubmissionForm.js | 4 ++--
 src/components/RecentSubmission.js     | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js
index b885ed8d..a85c2fbf 100644
--- a/src/components/PlayerSubmissionForm.js
+++ b/src/components/PlayerSubmissionForm.js
@@ -26,7 +26,7 @@ class PlayerSubmissionForm extends Component {
     this.setState(updatedState);
   }
 
-  onSubmitLine = (event) => {
+  sendSubmission = (event) => {
     event.preventDefault();
 
     const submission = {
@@ -49,7 +49,7 @@ class PlayerSubmissionForm extends Component {
         <h3>Player Submission Form for Player #{  }</h3>
 
         <form className='PlayerSubmissionForm__form'
-          onSubmit={this.onSubmitLine}>
+          onSubmit={this.sendSubmission}>
 
           <div className='PlayerSubmissionForm__poem-inputs'>
 
diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js
index 663da34b..bd9d70ff 100644
--- a/src/components/RecentSubmission.js
+++ b/src/components/RecentSubmission.js
@@ -5,7 +5,7 @@ const RecentSubmission = (props) => {
   return (
     <div className="RecentSubmission">
       <h3>The Most Recent Submission</h3>
-      <p className="RecentSubmission__submission">{  }</p>
+      <p className="RecentSubmission__submission">{ props.submission }</p>
     </div>
   );
 }