From 8d7394e62cf69fafed017199b51235b9a2189dd7 Mon Sep 17 00:00:00 2001
From: kiyeong <kjr07145@gmail.com>
Date: Wed, 4 Dec 2024 21:45:01 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=ED=9E=88=EC=8A=A4=ED=86=A0=EB=A6=AC=20?=
 =?UTF-8?q?=EC=82=AD=EC=A0=9C,=20=EC=9D=B4=EB=A6=84=EB=B3=80=EA=B2=BD,=20?=
 =?UTF-8?q?=ED=9A=8C=EC=9B=90=ED=83=88=ED=87=B4=20=EA=B8=B0=EB=8A=A5=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/MainPage/Sidebar/Sidebar.tsx | 53 ++++++++++++++++++++++++++
 1 file changed, 53 insertions(+)

diff --git a/src/pages/MainPage/Sidebar/Sidebar.tsx b/src/pages/MainPage/Sidebar/Sidebar.tsx
index 8ae6c5b..38848b4 100644
--- a/src/pages/MainPage/Sidebar/Sidebar.tsx
+++ b/src/pages/MainPage/Sidebar/Sidebar.tsx
@@ -101,6 +101,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, toggleSidebar }) => {
           title: "히스토리 이름이 성공적으로 변경되었습니다.",
           status: "success",
           duration: 3000,
+          position: "top",
           isClosable: true,
         });
         fetchHistories(); // 히스토리 목록 새로고침
@@ -109,6 +110,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, toggleSidebar }) => {
           title: "히스토리 이름 변경에 실패했습니다.",
           status: "error",
           duration: 3000,
+          position: "top",
           isClosable: true,
         });
       }
@@ -118,6 +120,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, toggleSidebar }) => {
         title: "히스토리 이름 변경 중 오류가 발생했습니다.",
         status: "error",
         duration: 3000,
+        position: "top",
         isClosable: true,
       });
     }
@@ -166,6 +169,55 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, toggleSidebar }) => {
     }
   };
 
+  const handleUserDelete = async () => {
+    const confirmation = window.confirm(
+      "정말로 회원탈퇴를 하시겠습니까? 모든 데이터가 삭제됩니다."
+    );
+    if (!confirmation) return;
+
+    try {
+      const token = localStorage.getItem("accessToken");
+      const response = await fetch(`${baseURL}/api/member/delete`, {
+        method: "DELETE",
+        headers: {
+          Authorization: `Bearer ${token}`,
+          "Content-Type": "application/json",
+        },
+      });
+
+      if (response.ok) {
+        toast({
+          title: "회원탈퇴가 완료되었습니다.",
+          status: "success",
+          duration: 3000,
+          position: "top",
+          isClosable: true,
+        });
+        localStorage.removeItem("accessToken");
+        navigate("/");
+        window.location.reload();
+      } else {
+        const errorData = await response.json();
+        toast({
+          title: `회원탈퇴 실패: ${errorData.error || "알 수 없는 오류"}`,
+          status: "error",
+          duration: 3000,
+          position: "top",
+          isClosable: true,
+        });
+      }
+    } catch (error) {
+      console.error("회원탈퇴 중 오류 발생:", error);
+      toast({
+        title: "회원탈퇴 중 오류가 발생했습니다.",
+        status: "error",
+        duration: 3000,
+        position: "top",
+        isClosable: true,
+      });
+    }
+  };
+
   useEffect(() => {
     const fetchUserInfo = async () => {
       const baseURL = import.meta.env.VITE_BASE_URL; // 환경변수에서 baseURL 가져오기
@@ -539,6 +591,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ isOpen, toggleSidebar }) => {
                   bg="#EFA9A4"
                   color="black"
                   _hover={{ bg: "#D17C74" }}
+                  onClick={handleUserDelete} // 회원탈퇴 버튼
                   boxShadow={
                     "0px 2px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.06)"
                   } // 사용자 정의 그림자