From fd058317c589341b278b2cc7f7c418cbec869cdd Mon Sep 17 00:00:00 2001
From: songye38 <ddev0308@gmail.com>
Date: Fri, 22 Dec 2023 02:53:06 +0900
Subject: [PATCH] =?UTF-8?q?Update=20Comments.tsx=20=EB=82=B4=EA=B0=80=20?=
 =?UTF-8?q?=EC=9E=91=EC=84=B1=ED=95=9C=20=EB=8C=93=EA=B8=80=EC=97=90?=
 =?UTF-8?q?=EB=A7=8C=20'=EC=82=AD=EC=A0=9C'=EA=B0=80=20=EB=B3=B4=EC=9D=B4?=
 =?UTF-8?q?=EA=B3=A0=20=EA=B7=B8=20=EB=8C=93=EA=B8=80=EC=9D=84=20=EC=8B=A4?=
 =?UTF-8?q?=EC=A0=9C=EB=A1=9C=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/Comments.tsx               | 27 ++++++++++++++++---
 1 file changed, 23 insertions(+), 4 deletions(-)

diff --git a/fastcampus-blog-app/src/components/Comments.tsx b/fastcampus-blog-app/src/components/Comments.tsx
index 86ed51b..bd2ebe8 100644
--- a/fastcampus-blog-app/src/components/Comments.tsx
+++ b/fastcampus-blog-app/src/components/Comments.tsx
@@ -1,6 +1,6 @@
 import { useContext, useState } from "react"
-import { PostProps } from "./PostList";
-import { arrayUnion, doc, updateDoc } from "firebase/firestore";
+import { CommentsInterface, PostProps } from "./PostList";
+import { arrayRemove, arrayUnion, doc, updateDoc } from "firebase/firestore";
 import { db } from "firebaseApp";
 import AuthContext from "context/AuthContext";
 import { toast } from "react-toastify";
@@ -22,7 +22,7 @@ export default function Comments({post,getPost}:CommentProps){
     if (name==='comment'){
         setComment(value);
     }
-    }
+    };
     const onSubmit = async (e:React.FormEvent<HTMLFormElement>)=>{
         e.preventDefault();
         
@@ -59,6 +59,18 @@ export default function Comments({post,getPost}:CommentProps){
 
         }
     };
+
+    const handleDeleteComment = async (data : CommentsInterface)=>{
+        const confirm = window.confirm('Are you sure you want to delete this comment');
+        if(confirm && post.id) {
+            const postRef = doc(db,'posts',post?.id);
+            await updateDoc(postRef,{
+                comments : arrayRemove(data),
+            });
+            toast.success('삭제되었습니다.');
+            await getPost(post.id);
+        }
+    };
     return (
         <div className="comments">
         <form className="comments__form" onSubmit = {onSubmit}>
@@ -76,7 +88,14 @@ export default function Comments({post,getPost}:CommentProps){
                     <div className="comment__profile-box">
                         <div className="comment__email">{comment?.email}</div>
                         <div className="comment__date">{comment?.createdAt}</div>
-                        <div className="comment__delete">삭제</div>
+                        {comment.uid === user?.uid && (
+                            <div
+                                className="comment__delete"
+                                onClick={() => handleDeleteComment(comment)}
+                            >
+                                삭제
+                            </div>
+                            )}
                     </div>
                     <div className="comment__text">{comment?.content}</div>
                 </div>