From 4660bec8634df9f6742a4c79e1f83e30075f9e7b Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Tue, 21 Apr 2020 19:38:58 -0700 Subject: [PATCH 1/8] Setup the imput of form --- src/components/PlayerSubmissionForm.js | 51 ++++++++++++++++++++++---- 1 file changed, 44 insertions(+), 7 deletions(-) diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index ba19e6ef..e6914072 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -2,21 +2,58 @@ import React, { useState } from 'react'; import './PlayerSubmissionForm.css'; const PlayerSubmissionForm = () => { + const [formFields, setFormFields] = useState({ + firstName: '', + lastName: '', + email: '', + password: '', + id: 0, + }); + + // const onSubmitForm = () => { + // event.preventDefault(); + + // props.addAccountCallback(formFields); + + // setFormFields({ + // firstName: '', + // lastName: '', + // emaial: '',v + // password: '', + // id: 0 + // }); + // }; + + + + return ( -
+

Player Submission Form for Player #{ }

- - { - // Put your form inputs here... We've put in one below as an example - } + The + + + + The + + -
From 87d655a0293047e7fdb7f886fb0153319b7c3143 Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Wed, 22 Apr 2020 00:53:40 -0700 Subject: [PATCH 2/8] Finished wave two --- src/components/Game.js | 38 ++++++++++-- src/components/PlayerSubmissionForm.js | 84 +++++++++++++++++--------- src/components/RecentSubmission.js | 6 +- 3 files changed, 94 insertions(+), 34 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index ad27105b..274bc629 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -4,6 +4,15 @@ import PlayerSubmissionForm from './PlayerSubmissionForm'; import FinalPoem from './FinalPoem'; import RecentSubmission from './RecentSubmission'; +const poems = [{ + firstAdjective: '', + firstNoun: '', + adverb: '', + verb: '', + secondAdjective:'', + secondNoun: '', +}] + const Game = () => { const exampleFormat = FIELDS.map((field) => { if (field.key) { @@ -13,6 +22,27 @@ const Game = () => { } }).join(" "); + console.log() + + const [poemSubmissions, setPoemList] = useState(poems); + + const addPoem = (poem) => { + console.log(poem) + + const newPoemList = [...poemSubmissions]; + + newPoemList.push({ + firstAdjective: poem.firstAdjective, + firstNoun: poem.firstNoun, + adverb: poem.adverb, + verb: poem.verb, + secondAdjective: poem.secondAdjective, + secondNoun: poem.secondNoun, + }); + + setPoemList(newPoemList); + }; + return (

Game

@@ -24,11 +54,9 @@ const Game = () => {

{ exampleFormat }

- - - - - + + +
diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index e6914072..a83b33e2 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -1,59 +1,89 @@ import React, { useState } from 'react'; import './PlayerSubmissionForm.css'; -const PlayerSubmissionForm = () => { +const PlayerSubmissionForm = (props) => { + const [count, setCurrenCount] = useState(1); const [formFields, setFormFields] = useState({ - firstName: '', - lastName: '', - email: '', - password: '', - id: 0, + firstAdjective: '', + firstNoun: '', + adverb: '', + verb: '', + secondAdjective:'', + secondNoun: '', }); - // const onSubmitForm = () => { - // event.preventDefault(); - - // props.addAccountCallback(formFields); - - // setFormFields({ - // firstName: '', - // lastName: '', - // emaial: '',v - // password: '', - // id: 0 - // }); - // }; - - + const onInputChange = (event) => { + // console.log(`Changing field ${ event.target.name } to ${ event.target.value }`); + + const newFormFields = { + ...formFields, + } + newFormFields[event.target.name] = event.target.value; + setFormFields(newFormFields); + } + const onSubmitForm = (event) => { + event.preventDefault(); + + props.onCallBackPoem(formFields); + console.log(formFields) + setCurrenCount(count + 1) + setFormFields({ + firstAdjective: '', + firstNoun: '', + adverb: '', + verb: '', + secondAdjective:'', + secondNoun: '', + }); + }; return ( -
-

Player Submission Form for Player #{ }

+
+

Player Submission Form for Player #{count}

- +
The The + .
diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js index 663da34b..5676bcb1 100644 --- a/src/components/RecentSubmission.js +++ b/src/components/RecentSubmission.js @@ -2,12 +2,14 @@ import React from 'react'; import './RecentSubmission.css'; const RecentSubmission = (props) => { + + const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = props.poem; return (

The Most Recent Submission

-

{ }

+

{`The ${firstAdjective} ${firstNoun} ${adverb} ${verb} the ${secondAdjective} ${secondNoun}`}

); } -export default RecentSubmission; +export default RecentSubmission; \ No newline at end of file From 135cee42369537560d65446e339f4f1566d74cf8 Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Wed, 22 Apr 2020 02:36:36 -0700 Subject: [PATCH 3/8] input validation --- src/components/Game.js | 9 +++++---- src/components/PlayerSubmissionForm.css | 4 ++++ src/components/PlayerSubmissionForm.js | 17 +++++++++++++++++ src/components/RecentSubmission.js | 2 +- 4 files changed, 27 insertions(+), 5 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index 274bc629..a061f426 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -25,10 +25,9 @@ const Game = () => { console.log() const [poemSubmissions, setPoemList] = useState(poems); + const [recentSubmission, setrtRecentSubmission] = useState("") const addPoem = (poem) => { - console.log(poem) - const newPoemList = [...poemSubmissions]; newPoemList.push({ @@ -39,8 +38,10 @@ const Game = () => { secondAdjective: poem.secondAdjective, secondNoun: poem.secondNoun, }); - + setPoemList(newPoemList); + setrtRecentSubmission("The Most Recent Submission") + }; return ( @@ -54,7 +55,7 @@ const Game = () => {

{ exampleFormat }

- + diff --git a/src/components/PlayerSubmissionForm.css b/src/components/PlayerSubmissionForm.css index 7cded5d9..22de80d6 100644 --- a/src/components/PlayerSubmissionForm.css +++ b/src/components/PlayerSubmissionForm.css @@ -35,6 +35,10 @@ background-color: #FFE9E9; } +input .valid{ + background-color: #FFFFFF; +} + .PlayerSubmissionForm__input--invalid::placeholder { color: black; } diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index a83b33e2..9abcc118 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -23,6 +23,8 @@ const PlayerSubmissionForm = (props) => { } const onSubmitForm = (event) => { + if (!inputValid()) return; + event.preventDefault(); props.onCallBackPoem(formFields); @@ -38,6 +40,15 @@ const PlayerSubmissionForm = (props) => { }); }; + const inputValid = () => { + return (formFields.firstAdjective.match(/[a-zA-Z]/) && formFields.firstAdjective !== '' + && formFields.firstNoun.match(/[a-zA-Z]/) && formFields.firstNoun !== '' + && formFields.adverb.match(/[a-zA-Z]/) && formFields.adverb !== '' + && formFields.verb.match(/[a-zA-Z]/) && formFields.verb !== '' + && formFields.secondAdjective.match(/[a-zA-Z]/) && formFields.secondAdjective !== '' + && formFields.secondNoun.match(/[a-zA-Z]/) && formFields.secondNoun !== '') + } + return (

Player Submission Form for Player #{count}

@@ -51,22 +62,26 @@ const PlayerSubmissionForm = (props) => { value={formFields.firstAdjective} onChange = {onInputChange} placeholder="adjective" + className = {inputValid()? "valid" : "PlayerSubmissionFormt__input--invalid"} type="text" /> @@ -74,12 +89,14 @@ const PlayerSubmissionForm = (props) => { diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js index 5676bcb1..4b897f8f 100644 --- a/src/components/RecentSubmission.js +++ b/src/components/RecentSubmission.js @@ -6,7 +6,7 @@ const RecentSubmission = (props) => { const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = props.poem; return (
-

The Most Recent Submission

+

{`${props.recentSubmission}`}

{`The ${firstAdjective} ${firstNoun} ${adverb} ${verb} the ${secondAdjective} ${secondNoun}`}

); From d1a5887d4256a7b0d07133c0961954c6fc6c33f6 Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Wed, 22 Apr 2020 17:45:31 -0700 Subject: [PATCH 4/8] Finish wave two --- src/components/FinalPoem.js | 23 ++++++++++++++---- src/components/Game.js | 32 ++++++++++++-------------- src/components/PlayerSubmissionForm.js | 9 ++++---- 3 files changed, 37 insertions(+), 27 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index d516184e..3ad3e9bc 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -3,16 +3,29 @@ import './FinalPoem.css'; const FinalPoem = (props) => { + const result = props.poems.map((poem, i) =>{ + const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = poem + return

The {firstAdjective} {firstNoun} {adverb} {verb} the {secondAdjective} {secondNoun} .

+ }) + + const onButtonClick = () =>{ + props.callBackOnShowPoem() + } + return (
-
+ {!props.showPoem &&

Final Poem

+ {result} -
+
} -
- -
+ {props.showPoem &&
+ +
}
); } diff --git a/src/components/Game.js b/src/components/Game.js index a061f426..6f85e77e 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -4,15 +4,6 @@ import PlayerSubmissionForm from './PlayerSubmissionForm'; import FinalPoem from './FinalPoem'; import RecentSubmission from './RecentSubmission'; -const poems = [{ - firstAdjective: '', - firstNoun: '', - adverb: '', - verb: '', - secondAdjective:'', - secondNoun: '', -}] - const Game = () => { const exampleFormat = FIELDS.map((field) => { if (field.key) { @@ -22,10 +13,16 @@ const Game = () => { } }).join(" "); - console.log() - const [poemSubmissions, setPoemList] = useState(poems); + + const [poemSubmissions, setPoemList] = useState([]); const [recentSubmission, setrtRecentSubmission] = useState("") + const [showPoem, setshowPoem] = useState(true) + + const callBackOnShowPoem = () => { + setshowPoem(false) + } + const addPoem = (poem) => { const newPoemList = [...poemSubmissions]; @@ -40,8 +37,7 @@ const Game = () => { }); setPoemList(newPoemList); - setrtRecentSubmission("The Most Recent Submission") - + setrtRecentSubmission("The Most Recent Submission") }; return ( @@ -55,10 +51,12 @@ const Game = () => {

{ exampleFormat }

- - - - + { (showPoem) && poemSubmissions.length > 1 && + } + { (showPoem) && + } + +
); diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 9abcc118..b9fc3f2c 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -2,7 +2,8 @@ import React, { useState } from 'react'; import './PlayerSubmissionForm.css'; const PlayerSubmissionForm = (props) => { - const [count, setCurrenCount] = useState(1); + + const [count, setCurrenCount] = useState(1); const [formFields, setFormFields] = useState({ firstAdjective: '', firstNoun: '', @@ -13,8 +14,6 @@ const PlayerSubmissionForm = (props) => { }); const onInputChange = (event) => { - // console.log(`Changing field ${ event.target.name } to ${ event.target.value }`); - const newFormFields = { ...formFields, } @@ -41,12 +40,12 @@ const PlayerSubmissionForm = (props) => { }; const inputValid = () => { - return (formFields.firstAdjective.match(/[a-zA-Z]/) && formFields.firstAdjective !== '' + return formFields.firstAdjective.match(/[a-zA-Z]/) && formFields.firstAdjective !== '' && formFields.firstNoun.match(/[a-zA-Z]/) && formFields.firstNoun !== '' && formFields.adverb.match(/[a-zA-Z]/) && formFields.adverb !== '' && formFields.verb.match(/[a-zA-Z]/) && formFields.verb !== '' && formFields.secondAdjective.match(/[a-zA-Z]/) && formFields.secondAdjective !== '' - && formFields.secondNoun.match(/[a-zA-Z]/) && formFields.secondNoun !== '') + && formFields.secondNoun.match(/[a-zA-Z]/) && formFields.secondNoun !== '' } return ( From 6f962af292ce6a795bf88474f2ac0dacab07e61f Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Wed, 22 Apr 2020 18:45:42 -0700 Subject: [PATCH 5/8] fixed The Most Recent Submission --- src/components/Game.js | 9 ++------- src/components/PlayerSubmissionForm.js | 14 +++++++------- src/components/RecentSubmission.js | 2 +- 3 files changed, 10 insertions(+), 15 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index 6f85e77e..fffc8cfe 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -16,7 +16,6 @@ const Game = () => { const [poemSubmissions, setPoemList] = useState([]); - const [recentSubmission, setrtRecentSubmission] = useState("") const [showPoem, setshowPoem] = useState(true) const callBackOnShowPoem = () => { @@ -37,7 +36,6 @@ const Game = () => { }); setPoemList(newPoemList); - setrtRecentSubmission("The Most Recent Submission") }; return ( @@ -51,11 +49,8 @@ const Game = () => {

{ exampleFormat }

- { (showPoem) && poemSubmissions.length > 1 && - } - { (showPoem) && - } - + { (showPoem) && poemSubmissions.length > 0 && } + { (showPoem) && }
diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index b9fc3f2c..21af9192 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -27,8 +27,8 @@ const PlayerSubmissionForm = (props) => { event.preventDefault(); props.onCallBackPoem(formFields); - console.log(formFields) setCurrenCount(count + 1) + setFormFields({ firstAdjective: '', firstNoun: '', @@ -40,12 +40,12 @@ const PlayerSubmissionForm = (props) => { }; const inputValid = () => { - return formFields.firstAdjective.match(/[a-zA-Z]/) && formFields.firstAdjective !== '' - && formFields.firstNoun.match(/[a-zA-Z]/) && formFields.firstNoun !== '' - && formFields.adverb.match(/[a-zA-Z]/) && formFields.adverb !== '' - && formFields.verb.match(/[a-zA-Z]/) && formFields.verb !== '' - && formFields.secondAdjective.match(/[a-zA-Z]/) && formFields.secondAdjective !== '' - && formFields.secondNoun.match(/[a-zA-Z]/) && formFields.secondNoun !== '' + return formFields.firstAdjective.match(/[a-zA-Z]/) + && formFields.firstNoun.match(/[a-zA-Z]/) + && formFields.adverb.match(/[a-zA-Z]/) + && formFields.verb.match(/[a-zA-Z]/) + && formFields.secondAdjective.match(/[a-zA-Z]/) + && formFields.secondNoun.match(/[a-zA-Z]/) } return ( diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js index 4b897f8f..5676bcb1 100644 --- a/src/components/RecentSubmission.js +++ b/src/components/RecentSubmission.js @@ -6,7 +6,7 @@ const RecentSubmission = (props) => { const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = props.poem; return (
-

{`${props.recentSubmission}`}

+

The Most Recent Submission

{`The ${firstAdjective} ${firstNoun} ${adverb} ${verb} the ${secondAdjective} ${secondNoun}`}

); From 3e668f5dabce285226184ad7275cb67457b01d3b Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Wed, 22 Apr 2020 19:17:08 -0700 Subject: [PATCH 6/8] Cleand code --- src/components/FinalPoem.js | 6 +++--- src/components/Game.js | 13 +++++-------- src/components/PlayerSubmissionForm.js | 4 ++-- 3 files changed, 10 insertions(+), 13 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index 3ad3e9bc..f3c70e5f 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -4,13 +4,13 @@ import './FinalPoem.css'; const FinalPoem = (props) => { const result = props.poems.map((poem, i) =>{ - const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = poem + const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = poem; return

The {firstAdjective} {firstNoun} {adverb} {verb} the {secondAdjective} {secondNoun} .

}) const onButtonClick = () =>{ - props.callBackOnShowPoem() - } + props.callBackOnShowPoem(); + }; return (
diff --git a/src/components/Game.js b/src/components/Game.js index fffc8cfe..1e19760b 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -5,6 +5,9 @@ import FinalPoem from './FinalPoem'; import RecentSubmission from './RecentSubmission'; const Game = () => { + const [poemSubmissions, setPoemList] = useState([]); + const [showPoem, setshowPoem] = useState(true); + const exampleFormat = FIELDS.map((field) => { if (field.key) { return field.placeholder; @@ -13,15 +16,9 @@ const Game = () => { } }).join(" "); - - - const [poemSubmissions, setPoemList] = useState([]); - const [showPoem, setshowPoem] = useState(true) - const callBackOnShowPoem = () => { - setshowPoem(false) - } - + setshowPoem(false); + }; const addPoem = (poem) => { const newPoemList = [...poemSubmissions]; diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 21af9192..3637483e 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -19,7 +19,7 @@ const PlayerSubmissionForm = (props) => { } newFormFields[event.target.name] = event.target.value; setFormFields(newFormFields); - } + }; const onSubmitForm = (event) => { if (!inputValid()) return; @@ -46,7 +46,7 @@ const PlayerSubmissionForm = (props) => { && formFields.verb.match(/[a-zA-Z]/) && formFields.secondAdjective.match(/[a-zA-Z]/) && formFields.secondNoun.match(/[a-zA-Z]/) - } + }; return (
From da15ae48957bcea966ea4dcdaf53309b3b626a8c Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Wed, 22 Apr 2020 19:17:08 -0700 Subject: [PATCH 7/8] Cleaned code. --- src/components/FinalPoem.js | 6 +++--- src/components/Game.js | 13 +++++-------- src/components/PlayerSubmissionForm.js | 4 ++-- 3 files changed, 10 insertions(+), 13 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index 3ad3e9bc..f3c70e5f 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -4,13 +4,13 @@ import './FinalPoem.css'; const FinalPoem = (props) => { const result = props.poems.map((poem, i) =>{ - const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = poem + const {firstAdjective, firstNoun, adverb, verb, secondAdjective, secondNoun} = poem; return

The {firstAdjective} {firstNoun} {adverb} {verb} the {secondAdjective} {secondNoun} .

}) const onButtonClick = () =>{ - props.callBackOnShowPoem() - } + props.callBackOnShowPoem(); + }; return (
diff --git a/src/components/Game.js b/src/components/Game.js index fffc8cfe..1e19760b 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -5,6 +5,9 @@ import FinalPoem from './FinalPoem'; import RecentSubmission from './RecentSubmission'; const Game = () => { + const [poemSubmissions, setPoemList] = useState([]); + const [showPoem, setshowPoem] = useState(true); + const exampleFormat = FIELDS.map((field) => { if (field.key) { return field.placeholder; @@ -13,15 +16,9 @@ const Game = () => { } }).join(" "); - - - const [poemSubmissions, setPoemList] = useState([]); - const [showPoem, setshowPoem] = useState(true) - const callBackOnShowPoem = () => { - setshowPoem(false) - } - + setshowPoem(false); + }; const addPoem = (poem) => { const newPoemList = [...poemSubmissions]; diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 21af9192..3637483e 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -19,7 +19,7 @@ const PlayerSubmissionForm = (props) => { } newFormFields[event.target.name] = event.target.value; setFormFields(newFormFields); - } + }; const onSubmitForm = (event) => { if (!inputValid()) return; @@ -46,7 +46,7 @@ const PlayerSubmissionForm = (props) => { && formFields.verb.match(/[a-zA-Z]/) && formFields.secondAdjective.match(/[a-zA-Z]/) && formFields.secondNoun.match(/[a-zA-Z]/) - } + }; return (
From 834a73ce81a58ecad6b27dae4e5c240d28a13d74 Mon Sep 17 00:00:00 2001 From: Jetmire Bajrami Date: Wed, 22 Apr 2020 20:40:57 -0700 Subject: [PATCH 8/8] Add propTypes for three siblings --- src/components/FinalPoem.js | 17 +++++++++++++++++ src/components/PlayerSubmissionForm.js | 5 +++++ src/components/RecentSubmission.js | 12 ++++++++++++ 3 files changed, 34 insertions(+) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index f3c70e5f..81ab7fbb 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -1,5 +1,6 @@ import React from 'react'; import './FinalPoem.css'; +import PropTypes from "prop-types" const FinalPoem = (props) => { @@ -30,4 +31,20 @@ const FinalPoem = (props) => { ); } +FinalPoem.propTypes = { + poems: PropTypes.arrayOf( + PropTypes.shape({ + firstAdjective: PropTypes.string.isRequired, + firstNoun: PropTypes.string.isRequired, + adverb: PropTypes.string.isRequired, + verb: PropTypes.string.isRequired, + secondAdjective: PropTypes.string.isRequired, + secondNoun: PropTypes.string.isRequired, + }) + ), + showPoem: PropTypes.bool.isRequired, + callBackOnShowPoem: PropTypes.func.isRequired, +}; + + export default FinalPoem; diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 3637483e..3b5b65ff 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -1,5 +1,6 @@ import React, { useState } from 'react'; import './PlayerSubmissionForm.css'; +import PropTypes from "prop-types" const PlayerSubmissionForm = (props) => { @@ -110,5 +111,9 @@ const PlayerSubmissionForm = (props) => { ); } +PlayerSubmissionForm.propTypes = { + onCallBackPoem: PropTypes.func.isRequired, +}; + export default PlayerSubmissionForm; diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js index 5676bcb1..8747279b 100644 --- a/src/components/RecentSubmission.js +++ b/src/components/RecentSubmission.js @@ -1,5 +1,6 @@ import React from 'react'; import './RecentSubmission.css'; +import PropTypes from "prop-types" const RecentSubmission = (props) => { @@ -12,4 +13,15 @@ const RecentSubmission = (props) => { ); } +RecentSubmission.propTypes = { + poem: PropTypes.shape({ + firstAdjective: PropTypes.string.isRequired, + firstNoun: PropTypes.string.isRequired, + adverb: PropTypes.string.isRequired, + verb: PropTypes.string.isRequired, + secondAdjective: PropTypes.string.isRequired, + secondNoun: PropTypes.string.isRequired, + }) +}; + export default RecentSubmission; \ No newline at end of file