From 97fb9046db1ebc12f99c4566fb5a3078d0d501fd Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 11:26:34 -0800 Subject: [PATCH 01/11] Planning and notes for how data will be passed around app. --- src/components/FinalPoem.js | 1 + src/components/Game.js | 4 ++++ src/components/PlayerSubmissionForm.js | 18 ++++++++++++++++++ src/components/RecentSubmission.js | 1 + 4 files changed, 24 insertions(+) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index d516184e..ea9ae359 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -12,6 +12,7 @@ const FinalPoem = (props) => {
+ {/* The lines of poetry that have been submitted will be passed down as a prop */}
); diff --git a/src/components/Game.js b/src/components/Game.js index e99f985a..595170b3 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -10,6 +10,10 @@ class Game extends Component { super(props); } + // the most recent line of poetry (Recent Submission, provided by the Player Submission Form) should live here + + // the final poem (which will contain all the submitted lines of poetry) should also live here, probably in an array that gets updated every time the Player Submission Form is submitted. + render() { const exampleFormat = FIELDS.map((field) => { diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 1de05095..35469658 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -5,6 +5,23 @@ class PlayerSubmissionForm extends Component { constructor(props) { super(props); + this.state = { + // user words are stored in state until submitted + adjective1: '', + noun1: '', + adverb: '', + verb: '', + adjective2: '', + noun2: '', + } + +onSubmitForm = () => { + // captures input from state and turns it into a line of poetry + // passes line up to Game + // Game passes line down to Recent Submission and Final Poem + // reset state? +} + } render() { @@ -19,6 +36,7 @@ class PlayerSubmissionForm extends Component { { // Put your form inputs here... We've put in one below as an example + } { return (

The Most Recent Submission

+ {/* Most recent submission comes from Game, which receives the line of poetry from User Submission Form */}

{ }

); From ae67c55d592d9b32690596023ce8f8200f0d585c Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 11:41:04 -0800 Subject: [PATCH 02/11] Adding player input fields. --- src/components/PlayerSubmissionForm.js | 38 +++++++++++++++++++------- 1 file changed, 28 insertions(+), 10 deletions(-) diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 35469658..39c37eed 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -15,12 +15,12 @@ class PlayerSubmissionForm extends Component { noun2: '', } -onSubmitForm = () => { - // captures input from state and turns it into a line of poetry - // passes line up to Game - // Game passes line down to Recent Submission and Final Poem - // reset state? -} +// onSubmitForm = () => { +// // captures input from state and turns it into a line of poetry +// // passes line up to Game +// // Game passes line down to Recent Submission and Final Poem +// // reset state? +// } } @@ -34,12 +34,30 @@ onSubmitForm = () => {
- { - // Put your form inputs here... We've put in one below as an example + {/* If field is empty, placeholder name appears. Otherwise, word that the player has entered appears. */} + + + + + + + + + + - }
From 3b00558b2302796ed326792e54eacd3e97f8a25b Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 12:05:35 -0800 Subject: [PATCH 03/11] Adding receptacles for current line and final poem and added articles to player submission form. --- src/components/Game.js | 26 ++++++++++++++++++++----- src/components/PlayerSubmissionForm.css | 2 +- src/components/PlayerSubmissionForm.js | 5 ++++- 3 files changed, 26 insertions(+), 7 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index 595170b3..989de685 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -8,11 +8,27 @@ class Game extends Component { constructor(props) { super(props); - } - - // the most recent line of poetry (Recent Submission, provided by the Player Submission Form) should live here - // the final poem (which will contain all the submitted lines of poetry) should also live here, probably in an array that gets updated every time the Player Submission Form is submitted. + // the most recent line of poetry (Recent Submission, provided by the Player Submission Form) should live here + + // the final poem (which will contain all the submitted lines of poetry) should also live here, probably in an array that gets updated every time the Player Submission Form is submitted. + + this.state = { + currentLine: '', + finalPoem: [] + } + + // the newly submitted line becomes the currentSubmission and gets added to the finalPoem array. + // addLine = (line) => { + // const {finalPoem} = this.state; + // finalPoem.push(line); + // this.setState({ + // currentLine: line, + // finalPoem, + // }) + // console.log(line) + // } + } render() { @@ -38,7 +54,7 @@ class Game extends Component { - + {this.addLine(line)}}/> 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; } diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 39c37eed..8c5caeb2 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -14,6 +14,7 @@ class PlayerSubmissionForm extends Component { adjective2: '', noun2: '', } + this.addLine = props.addLine; // onSubmitForm = () => { // // captures input from state and turns it into a line of poetry @@ -35,7 +36,7 @@ class PlayerSubmissionForm extends Component {
{/* If field is empty, placeholder name appears. Otherwise, word that the player has entered appears. */} - + The @@ -52,6 +53,8 @@ class PlayerSubmissionForm extends Component { placeholder={this.state.verb === '' ? "verb" : this.state.verb} type="text" /> + the + From 7c5140b54b4970b5e9e3ccd805e48793d8dac89e Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 13:08:56 -0800 Subject: [PATCH 04/11] Capturing submitted input and passing it to game via addLine. --- src/components/Game.js | 25 ++++++++-------- src/components/PlayerSubmissionForm.js | 40 +++++++++++++++++++------- 2 files changed, 43 insertions(+), 22 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index 989de685..6a167007 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -16,19 +16,20 @@ class Game extends Component { this.state = { currentLine: '', finalPoem: [] + } } + + // the newly submitted line becomes the currentLine and gets added to the finalPoem array + addLine = (line) => { + const {finalPoem} = this.state; + finalPoem.push(line); + this.setState({ + currentLine: line, + finalPoem, + }) + console.log(line) + console.log(finalPoem) } - - // the newly submitted line becomes the currentSubmission and gets added to the finalPoem array. - // addLine = (line) => { - // const {finalPoem} = this.state; - // finalPoem.push(line); - // this.setState({ - // currentLine: line, - // finalPoem, - // }) - // console.log(line) - // } - } + render() { diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 8c5caeb2..4d32b639 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -7,23 +7,37 @@ class PlayerSubmissionForm extends Component { super(props); this.state = { // user words are stored in state until submitted + article1: 'The', adjective1: '', noun1: '', adverb: '', verb: '', + article2: 'the', adjective2: '', noun2: '', } this.addLine = props.addLine; + } -// onSubmitForm = () => { -// // captures input from state and turns it into a line of poetry -// // passes line up to Game -// // Game passes line down to Recent Submission and Final Poem -// // reset state? -// } +updateWord = (word, event) => { + let value = event.target.value + this.setState({ + [word]: value + }) +} - } +onSubmitForm = (event) => { + // captures input from state and turns it into a line of poetry + // passes line up to Game + // Game passes line down to Recent Submission and Final Poem + // reset state? + event.preventDefault(); + let line = ''; + Object.keys(this.state).forEach((key) => { + line += ' ' + this.state[key]; + }) + this.addLine(line) +} render() { @@ -31,35 +45,41 @@ class PlayerSubmissionForm extends Component {

Player Submission Form for Player #{ }

-
- +
- {/* If field is empty, placeholder name appears. Otherwise, word that the player has entered appears. */} + {/* If field is empty, placeholder name appears. Otherwise, letters that the player has entered appear. */} The {this.updateWord('adjective1', event)}} placeholder={this.state.adjective1 === '' ? "adjective" : this.state.adjective1} type="text" /> {this.updateWord('noun1', event)}} placeholder={this.state.noun1 === '' ? "noun" : this.state.noun1} type="text" /> {this.updateWord('adverb', event)}} placeholder={this.state.adverb === '' ? "adverb" : this.state.adverb} type="text" /> {this.updateWord('verb', event)}} placeholder={this.state.verb === '' ? "verb" : this.state.verb} type="text" /> the {this.updateWord('adjective2', event)}} placeholder={this.state.adjective2 === '' ? "adjective" : this.state.adjective2} type="text" /> {this.updateWord('noun2', event)}} placeholder={this.state.noun2 === '' ? "noun" : this.state.noun2} type="text" /> From f02bb0fd1f5755fb482ca589a2ba8dd2ffdcdb23 Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 13:19:21 -0800 Subject: [PATCH 05/11] Adding recent submission line --- src/components/Game.js | 2 +- src/components/RecentSubmission.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Game.js b/src/components/Game.js index 6a167007..cdeaeb9e 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -53,7 +53,7 @@ class Game extends Component { { exampleFormat }

- + {this.addLine(line)}}/> diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js index 26159ce8..18f39d0c 100644 --- a/src/components/RecentSubmission.js +++ b/src/components/RecentSubmission.js @@ -6,7 +6,7 @@ const RecentSubmission = (props) => {

The Most Recent Submission

{/* Most recent submission comes from Game, which receives the line of poetry from User Submission Form */} -

{ }

+

{ props.recentSubmission }

); } From c8fae992d5f85ca46559d7264e67015353baed97 Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 13:28:14 -0800 Subject: [PATCH 06/11] Incrementing player number. --- src/components/PlayerSubmissionForm.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index 4d32b639..ebad477a 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -5,6 +5,7 @@ class PlayerSubmissionForm extends Component { constructor(props) { super(props); + this.playerNumber = 1; this.state = { // user words are stored in state until submitted article1: 'The', @@ -37,13 +38,14 @@ onSubmitForm = (event) => { line += ' ' + this.state[key]; }) this.addLine(line) + this.playerNumber ++; } render() { return (
-

Player Submission Form for Player #{ }

+

Player Submission Form for Player #{this.playerNumber}

From 668b1af77a0c571628119a3a75d27e052835ebd1 Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 14:37:00 -0800 Subject: [PATCH 07/11] Refactoring input fields to incorporate pattern we learned in class. Now fields reset after submit button is pressed. --- src/components/PlayerSubmissionForm.js | 50 ++++++++++++++++++-------- src/components/RecentSubmission.js | 2 +- 2 files changed, 36 insertions(+), 16 deletions(-) diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index ebad477a..df6fd5c4 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -7,7 +7,7 @@ class PlayerSubmissionForm extends Component { super(props); this.playerNumber = 1; this.state = { - // user words are stored in state until submitted + // user-inputted words are stored in state until submitted article1: 'The', adjective1: '', noun1: '', @@ -20,25 +20,33 @@ class PlayerSubmissionForm extends Component { this.addLine = props.addLine; } -updateWord = (word, event) => { +updateWord = (event) => { let value = event.target.value this.setState({ - [word]: value + [event.target.name]: value }) } onSubmitForm = (event) => { // captures input from state and turns it into a line of poetry - // passes line up to Game - // Game passes line down to Recent Submission and Final Poem - // reset state? event.preventDefault(); let line = ''; Object.keys(this.state).forEach((key) => { line += ' ' + this.state[key]; }) + // addLine passes line up to Game; Game passes line down to Recent Submission and Final Poem this.addLine(line) + // increment player number this.playerNumber ++; + // reset state so form is back to placeholders for next player + this.setState({ + adjective1: '', + noun1: '', + adverb: '', + verb: '', + adjective2: '', + noun2: '', + }) } render() { @@ -47,48 +55,60 @@ onSubmitForm = (event) => {

Player Submission Form for Player #{this.playerNumber}

- +
{/* If field is empty, placeholder name appears. Otherwise, letters that the player has entered appear. */} + {/* Refactoring input fields to incorporate resetting state pattern we covered in class */} The {this.updateWord('adjective1', event)}} + name="adjective1" + onChange={this.updateWord} placeholder={this.state.adjective1 === '' ? "adjective" : this.state.adjective1} + value={this.state.adjective1} type="text" /> {this.updateWord('noun1', event)}} + name="noun1" + onChange={this.updateWord} placeholder={this.state.noun1 === '' ? "noun" : this.state.noun1} + value={this.state.noun1} type="text" /> {this.updateWord('adverb', event)}} + name="adverb" + onChange={this.updateWord} placeholder={this.state.adverb === '' ? "adverb" : this.state.adverb} + value={this.state.adverb} type="text" /> {this.updateWord('verb', event)}} + name="verb" + onChange={this.updateWord} placeholder={this.state.verb === '' ? "verb" : this.state.verb} + value={this.state.verb} type="text" /> the {this.updateWord('adjective2', event)}} + name="adjective2" + onChange={this.updateWord} placeholder={this.state.adjective2 === '' ? "adjective" : this.state.adjective2} + value={this.state.adjective2} type="text" /> {this.updateWord('noun2', event)}} + name="noun2" + onChange={this.updateWord} placeholder={this.state.noun2 === '' ? "noun" : this.state.noun2} + value={this.state.noun2} type="text" />
- +
diff --git a/src/components/RecentSubmission.js b/src/components/RecentSubmission.js index 18f39d0c..aca8bace 100644 --- a/src/components/RecentSubmission.js +++ b/src/components/RecentSubmission.js @@ -5,7 +5,7 @@ const RecentSubmission = (props) => { return (

The Most Recent Submission

- {/* Most recent submission comes from Game, which receives the line of poetry from User Submission Form */} + {/* Most recent submission comes from Game via addLine, which holds the line of poetry from User Submission Form */}

{ props.recentSubmission }

); From 02abd3f6de124b73e375c16bfe11239a6b0abff0 Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 15:26:42 -0800 Subject: [PATCH 08/11] Displaying final poem but need to adjust form to match deployed example. --- src/components/FinalPoem.js | 32 +++++++++++++++++++++++++++----- src/components/Game.js | 13 ++++++++++--- 2 files changed, 37 insertions(+), 8 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index ea9ae359..771c434e 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -3,19 +3,41 @@ import './FinalPoem.css'; const FinalPoem = (props) => { + const revealPoem = () => { + props.revealPoemCallback(); + } + + // format lines so they look like a poem + const formatPoem = props.finalPoem.map((line, i) => { + console.log(line); + return ( +

+ {line} +

+ ) + +}) + + // logic for "reveal poem" button and displaying final poem: start with displayPoem value of false in game and "display poem" button visible. When button is clicked, displayPoem value turns to true and buttons is no longer visible. + console.log(props.displayPoem); + + if (props.displayPoem === true) { + return (

Final Poem

- + {formatPoem}
- -
- - {/* The lines of poetry that have been submitted will be passed down as a prop */}
+ ) + } else { + return ( +
+
); + } } export default FinalPoem; diff --git a/src/components/Game.js b/src/components/Game.js index cdeaeb9e..4a7c1ecf 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -15,7 +15,8 @@ class Game extends Component { this.state = { currentLine: '', - finalPoem: [] + finalPoem: [], + displayPoem: false, } } // the newly submitted line becomes the currentLine and gets added to the finalPoem array @@ -29,7 +30,12 @@ class Game extends Component { console.log(line) console.log(finalPoem) } - + + revealPoem = () => { + this.setState({ + displayPoem: true + }) + } render() { @@ -57,7 +63,8 @@ class Game extends Component { {this.addLine(line)}}/> - +{/* finalPoem stores the poem lines, displayPoem controls whether or not final poem is visible, reveal poem callback returns formatted lines */} +
); From 3ca1424533da595d9a1f3ea734242742dbd45267 Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 16:48:07 -0800 Subject: [PATCH 09/11] Adding if/else statement that removes recent submission and player submission form when final poem is displayed. Unlike the example version, my code removes the game instructions when the final poem is revealed but I assert that this is an intentional design choice --- src/components/FinalPoem.js | 1 - src/components/Game.js | 76 +++++++++++++++++++++---------------- 2 files changed, 43 insertions(+), 34 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index 771c434e..976407a5 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -19,7 +19,6 @@ const FinalPoem = (props) => { }) // logic for "reveal poem" button and displaying final poem: start with displayPoem value of false in game and "display poem" button visible. When button is clicked, displayPoem value turns to true and buttons is no longer visible. - console.log(props.displayPoem); if (props.displayPoem === true) { diff --git a/src/components/Game.js b/src/components/Game.js index 4a7c1ecf..dcb225ca 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -9,9 +9,9 @@ class Game extends Component { constructor(props) { super(props); - // the most recent line of poetry (Recent Submission, provided by the Player Submission Form) should live here + // the most recent line of poetry (Recent Submission, provided by the Player Submission Form) lives here - // the final poem (which will contain all the submitted lines of poetry) should also live here, probably in an array that gets updated every time the Player Submission Form is submitted. + // the final poem (which contains all the submitted lines of poetry) also lives here in an array that gets updated every time the Player Submission Form is submitted. this.state = { currentLine: '', @@ -20,22 +20,22 @@ class Game extends Component { } } // the newly submitted line becomes the currentLine and gets added to the finalPoem array - addLine = (line) => { - const {finalPoem} = this.state; - finalPoem.push(line); - this.setState({ - currentLine: line, - finalPoem, - }) - console.log(line) - console.log(finalPoem) - } - - revealPoem = () => { - this.setState({ - displayPoem: true - }) - } + addLine = (line) => { + const {finalPoem} = this.state; + finalPoem.push(line); + this.setState({ + currentLine: line, + finalPoem, + }) + console.log(line) + console.log(finalPoem) + } + + revealPoem = () => { + this.setState({ + displayPoem: true + }) + } render() { @@ -47,29 +47,38 @@ class Game extends Component { } }).join(" "); - return ( -
-

Game

- -

Each player should take turns filling out and submitting the form below. Each turn should be done individually and in secret! Take inspiration from the revealed recent submission. When all players are finished, click the final button on the bottom to reveal the entire poem.

+if (this.state.displayPoem === true) { + return ( + + ) -

Please follow the following format for your poetry submission:

- -

- { exampleFormat } -

+} else { + return ( +
+

Game

+ +

Each player should take turns filling out and submitting the form below. Each turn should be done individually and in secret! Take inspiration from the revealed recent submission. When all players are finished, click the final button on the bottom to reveal the entire poem.

+ +

Please follow the following format for your poetry submission:

+ +

+ { exampleFormat } +

+ +
{this.addLine(line)}}/> -{/* finalPoem stores the poem lines, displayPoem controls whether or not final poem is visible, reveal poem callback returns formatted lines */} - + +
+
-
); - } -} + }; +}; +}; const FIELDS = [ "The", @@ -101,4 +110,5 @@ const FIELDS = [ ".", ]; + export default Game; From 51d2090933f6fe4beb8ad242bf86c777fe5e1512 Mon Sep 17 00:00:00 2001 From: Julia A Kingrey Date: Sun, 15 Dec 2019 17:23:05 -0800 Subject: [PATCH 10/11] Applying conditional formatting for input fields. It ain't concise but it works. --- src/components/PlayerSubmissionForm.js | 31 ++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) diff --git a/src/components/PlayerSubmissionForm.js b/src/components/PlayerSubmissionForm.js index df6fd5c4..278216ad 100644 --- a/src/components/PlayerSubmissionForm.js +++ b/src/components/PlayerSubmissionForm.js @@ -49,6 +49,31 @@ onSubmitForm = (event) => { }) } +adjective1Valid = () => { + return this.state.adjective1.match(/.+/); +}; + +noun1Valid = () => { + return this.state.noun1.match(/.+/); +}; + +adverbValid = () => { + return this.state.adverb.match(/.+/); +}; + +verbValid = () => { + return this.state.verb.match(/.+/); +}; + +adjective2Valid = () => { + return this.state.adjective2.match(/.+/); +}; + +noun2Valid = () => { + return this.state.noun2.match(/.+/); +}; + + render() { return ( @@ -63,6 +88,7 @@ onSubmitForm = (event) => { The { { { { { Date: Sun, 15 Dec 2019 17:40:02 -0800 Subject: [PATCH 11/11] Cleaned up notes and removed console.log statements. Leaving notes in because I find it helpful to refer to them down the line. --- src/components/FinalPoem.js | 1 - src/components/Game.js | 8 ++------ 2 files changed, 2 insertions(+), 7 deletions(-) diff --git a/src/components/FinalPoem.js b/src/components/FinalPoem.js index 976407a5..d6a8592b 100644 --- a/src/components/FinalPoem.js +++ b/src/components/FinalPoem.js @@ -9,7 +9,6 @@ const FinalPoem = (props) => { // format lines so they look like a poem const formatPoem = props.finalPoem.map((line, i) => { - console.log(line); return (

{line} diff --git a/src/components/Game.js b/src/components/Game.js index dcb225ca..5d31992e 100644 --- a/src/components/Game.js +++ b/src/components/Game.js @@ -9,9 +9,7 @@ class Game extends Component { constructor(props) { super(props); - // the most recent line of poetry (Recent Submission, provided by the Player Submission Form) lives here - - // the final poem (which contains all the submitted lines of poetry) also lives here in an array that gets updated every time the Player Submission Form is submitted. + // game state stores current line (pushed up from player submission form), submitted lines get added to final poem array, and display poem controls whether or not finished poem is visible this.state = { currentLine: '', @@ -19,7 +17,7 @@ class Game extends Component { displayPoem: false, } } - // the newly submitted line becomes the currentLine and gets added to the finalPoem array + // the newly submitted line becomes the current line and gets added to the final poem array addLine = (line) => { const {finalPoem} = this.state; finalPoem.push(line); @@ -27,8 +25,6 @@ class Game extends Component { currentLine: line, finalPoem, }) - console.log(line) - console.log(finalPoem) } revealPoem = () => {