From fb191a9e11c4460abc1df43ec46884ff1fbf4d68 Mon Sep 17 00:00:00 2001
From: choiseohyeon <csh200310@naver.com>
Date: Mon, 18 Dec 2023 22:08:48 +0900
Subject: [PATCH] =?UTF-8?q?fix:=EA=B3=B5=EC=9C=A0=EA=B8=B0=EB=8A=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/Complete/CompleteWriting.tsx | 33 ++++++++++++++++----------
 1 file changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/pages/Complete/CompleteWriting.tsx b/src/pages/Complete/CompleteWriting.tsx
index b66f451..3df7312 100644
--- a/src/pages/Complete/CompleteWriting.tsx
+++ b/src/pages/Complete/CompleteWriting.tsx
@@ -38,7 +38,8 @@ function CompleteWriting() {
   );
   const [isLiked, setIsLiked] = useState(false);
   const [likesCount, setLikesCount] = useState(0);
-  const [showModal, setShowModal] = useState(false);
+  const [showShareModal, setShowShareModal] = useState(false);
+  const [showDeleteModal, setShowDeleteModal] = useState(false);
 
   const fetchRetrospective = async () => {
     try {
@@ -144,15 +145,16 @@ function CompleteWriting() {
   };
 
   const handleShareClick = () => {
-    setShowModal(true);
+    setShowShareModal(true);
   };
 
   const handleDeleteClick = () => {
-    setShowModal(true);
+    setShowDeleteModal(true);
   };
 
-  const handleOverlayClick = () => {
-    setShowModal(false);
+  const closeModals = () => {
+    setShowShareModal(false);
+    setShowDeleteModal(false);
   };
 
   return (
@@ -174,7 +176,7 @@ function CompleteWriting() {
             <div className="sharebtn" onClick={handleShareClick}>
               <img src={sharebtn} alt="Share" />
             </div>
-            {/* 유저의 글에만 보임 : 수정, 삭제 */}
+            {/* 유저의 글에만 보임: 수정, 삭제 */}
             {retrospective && retrospective.owner && (
               <>
                 <div className="editbtn">
@@ -194,12 +196,19 @@ function CompleteWriting() {
           <br />
         </div>
       </CompleteWritingWrap>
-      {showModal && (
-        <>
-          <ShareModal closeModal={() => setShowModal(false)} />
-          <DeleteModal closeModal={() => setShowModal(false)} />
-          <ModalOverlay onClick={handleOverlayClick} />
-        </>
+      {showShareModal && (
+        <ShareModal closeModal={() => setShowShareModal(false)} />
+      )}
+      {showDeleteModal && (
+        <DeleteModal closeModal={() => setShowDeleteModal(false)} />
+      )}
+      {(showShareModal || showDeleteModal) && (
+        <ModalOverlay
+          onClick={() => {
+            setShowShareModal(false);
+            setShowDeleteModal(false);
+          }}
+        />
       )}
     </>
   );