Upload 2.14

part2/phonebook/src/components/Person.js

@@ -1,7 +1,10 @@
-const Person = ({ person }) => {
+const Person = ({ person, deletePerson }) => {
   return (
-    <div>
-      {person.name} {person.number}
+    <div key={person.id}>
+      {person.name} {person.number}{" "}
+      <button onClick={() => deletePerson(person.id, person.name)}>
+        Delete
+      </button>
     </div>
   );
 };

part2/phonebook/src/components/ShowPersons.js

@@ -1,10 +1,10 @@
 import Person from "./Person";
 
-const ShowPersons = ({ showedPersons }) => {
+const ShowPersons = ({ showedPersons, deletePerson }) => {
   return (
     <div>
       {showedPersons.map((person) => (
-        <Person key={person.name} person={person} />
+        <Person key={person.name} person={person} deletePerson={deletePerson} />
       ))}
     </div>
   );