2.6 completed

parts/2/phoneBook/src/App.jsx

@@ -1,22 +1,32 @@
 import { useState } from "react";
+import PersonList from "./components/PersonList";
 
 const App = () => {
   const [persons, setPersons] = useState([{ name: "Arto Hellas" }]);
   const [newName, setNewName] = useState("");
 
+  const handleOnSubmit = (event) => {
+    event.preventDefault();
+    setPersons(persons.concat({ name: [newName] }));
+  };
+
+  const handleNameChange = (event) => {
+    setNewName(event.target.value);
+  };
+
   return (
     <div>
       <h2>Phonebook</h2>
-      <form>
+      <form onSubmit={handleOnSubmit}>
         <div>
-          name: <input />
+          name: <input onChange={handleNameChange} />
         </div>
         <div>
           <button type="submit">add</button>
         </div>
       </form>
       <h2>Numbers</h2>
-      ...
+      <PersonList persons={persons} />
     </div>
   );
 };