Added delete

jin-co · Oct 22, 2023 · 768a659 · 768a659
1 parent 3044eff
commit 768a659
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/React/test-feed/src/components/FeedItem.js b/React/test-feed/src/components/FeedItem.js
@@ -2,13 +2,14 @@ import React from 'react'
 import {FaTimes} from 'react-icons/fa'
 import { Card } from './shared/Card'
 
-export const FeedItem = ({feed}) => {
+export const FeedItem = ({feed, deleteFeed}) => {  
   return (
     <Card>
       <div className="num-display">{feed.rating}</div>
       <FaTimes
         color="red"
         className="close"
+        onClick={() => deleteFeed(feed.id)}
       />
       <div className="text-display">{feed.text}</div>
       {/* <button onClick={onClick}>click</button> */}

diff --git a/React/test-feed/src/components/FeedList.js b/React/test-feed/src/components/FeedList.js
@@ -1,12 +1,12 @@
 import React from 'react'
 import { FeedItem } from './FeedItem'
 
-export const FeedList = ({ feed }) => {
+export const FeedList = ({ feed, deleteFeed }) => {
   return (
     <div className="feedback-list">
       {
         feed.map((f) => (
-          <FeedItem feed={f} />
+          <FeedItem deleteFeed={deleteFeed} feed={f} />
         ))
       }
     </div>

diff --git a/React/test-feed/src/pages/Home.js b/React/test-feed/src/pages/Home.js
@@ -11,11 +11,15 @@ export const Home = () => {
     console.log(feed)
   }, [])
 
+  const deleteFeed = (id) => {
+    setFeed(feed.filter(f => f.id !== id))
+  }
+
   return (
     <div className='container'>
       <FeedStat feed={feed} />
       <FeedForm />
-      <FeedList feed={feed} />
+      <FeedList feed={feed} deleteFeed={deleteFeed} />
     </div>
   )
 }