Wave 2

src/components/FinalPoem.js

@@ -4,11 +4,21 @@ import './FinalPoem.css';
 
 const FinalPoem = (props) => {
   console.log(props.poemList)
+// props.poemList.forEach((line) => {
+//   return ( <h3> {line} </h3>)
+// })
+
+//figure out how to render this one line at a time 
+
   return (
     <div className="FinalPoem">
       <section className="FinalPoem__poem">
         <h3>Final Poem</h3>
 
+        {props.poemList.forEach((line) => {
+          return ( <h3> {line} </h3>)
+        })}
+
       </section>
 
       <div className="FinalPoem__reveal-btn-container">

src/components/Game.js

@@ -17,15 +17,17 @@ const Game = () => {
   const [player, setPlayer] = useState(1);
 
   const addPoem = (poem) => {
-    const newPoemsList = [...poemList];
+    let newPoemsList = [...poemList];
 
     newPoemsList.push(poem);
     setPlayer(player + 1)
 
     setPoemList(newPoemsList);
   };
 
-  // console.log(poemList);
+  const poemListString = poemList.map((obj) => {
+    return `The ${obj.adj1} ${obj.noun1} ${obj.adv} ${obj.verb} the ${obj.adj2} ${obj.noun2} .`
+  })
 
   return (
     <div className='Game'>
@@ -43,7 +45,7 @@ const Game = () => {
 
       <PlayerSubmissionForm fields={FIELDS} onSubmitCallBack={addPoem} player={player}/>
 
-      <FinalPoem poemList={poemList}/>
+      <FinalPoem poemList={poemListString}/>
 
     </div>
   );

src/components/PlayerSubmissionForm.js

@@ -17,7 +17,6 @@ const PlayerSubmissionForm = () => {
 
       const onUserInputChange = (event) => {
         const { name, value } = event.target;
-
         const newPoem = {
           ...poem,
         };

src/components/RecentSubmission.test.js

@@ -4,7 +4,7 @@ import { render, screen } from '@testing-library/react';
 import RecentSubmission from './RecentSubmission';
 
 
-describe.skip('Wave 2:  RecentSubmission', () => {
+describe('Wave 2:  RecentSubmission', () => {
   test('It renders with a submission and shows the text', () => {
     // Act
     render(<RecentSubmission submission={'This is a submission'} />);