From 29bc717b2caec3a80b7ccf64b62d41e385477322 Mon Sep 17 00:00:00 2001
From: bicochan <chanii8@naver.com>
Date: Thu, 10 Jul 2025 16:50:19 +0900
Subject: [PATCH] =?UTF-8?q?[apps/cs]=20feat:=20=ED=9A=8C=EC=9B=90=20?=
 =?UTF-8?q?=EC=82=AD=EC=A0=9C=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80=20?=
 =?UTF-8?q?(CS=5FUT05010109)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/cs/src/pages/users/ui/user-detail.tsx | 30 +++++++++++++++-------
 1 file changed, 21 insertions(+), 9 deletions(-)

diff --git a/apps/cs/src/pages/users/ui/user-detail.tsx b/apps/cs/src/pages/users/ui/user-detail.tsx
index 60c1f34b8..fbfa016c2 100644
--- a/apps/cs/src/pages/users/ui/user-detail.tsx
+++ b/apps/cs/src/pages/users/ui/user-detail.tsx
@@ -3,6 +3,7 @@
 import dayjs from "dayjs";
 import { usePathname, useRouter } from "next/navigation";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import {
   Button,
   Table,
@@ -18,10 +19,11 @@ import { useAlertStore, useMutationWrapper } from "@/shared/lib";
 function UserDetail({ userUnqId }: { userUnqId: string }) {
   const router = useRouter();
   const pathname = usePathname();
+  const { confirm } = useConfirm();
   const queryClient = useQueryClient();
   const alert = useAlertStore((state) => state.setMessage);
 
-  const { data } = useQuery({
+  const { data, refetch } = useQuery({
     queryKey: [ENDPOINT.USER_SERVICE.USERS, userUnqId],
     queryFn: () => UserApi.findByUserUnqId(userUnqId),
     enabled: !!userUnqId,
@@ -31,9 +33,7 @@ function UserDetail({ userUnqId }: { userUnqId: string }) {
     mutationFn: () => UserApi.lockUser(userUnqId),
     onSuccess: () => {
       alert("계정 잠금이 활성화 되었습니다.");
-      queryClient.invalidateQueries({
-        queryKey: [ENDPOINT.USER_SERVICE.USERS, userUnqId],
-      });
+      refetch();
     },
   });
 
@@ -41,9 +41,7 @@ function UserDetail({ userUnqId }: { userUnqId: string }) {
     mutationFn: () => UserApi.unlockUser(userUnqId),
     onSuccess: () => {
       alert("계정 잠금이 해제되었습니다.");
-      queryClient.invalidateQueries({
-        queryKey: [ENDPOINT.USER_SERVICE.USERS, userUnqId],
-      });
+      refetch();
     },
   });
 
@@ -51,12 +49,26 @@ function UserDetail({ userUnqId }: { userUnqId: string }) {
     mutationFn: () => UserApi.applyUser(userUnqId),
     onSuccess: () => {
       alert("사용자 승인이 완료되었습니다.");
+      refetch();
+    },
+  });
+
+  const { mutateAsync: deleteUser } = useMutationWrapper({
+    mutationFn: () => UserApi.deleteUser(userUnqId),
+    onSuccess: () => {
+      alert("회원이 삭제되었습니다.", router.back);
       queryClient.invalidateQueries({
-        queryKey: [ENDPOINT.USER_SERVICE.USERS, userUnqId],
+        queryKey: [ENDPOINT.USER_SERVICE.USERS],
       });
     },
   });
 
+  const handleDelete = async () => {
+    if (await confirm("삭제하시겠습니까?")) {
+      await deleteUser();
+    }
+  };
+
   return (
     <div className="card card-border !mt-6">
       <div className="card-header">
@@ -164,7 +176,7 @@ function UserDetail({ userUnqId }: { userUnqId: string }) {
         <Button size="lg" onClick={() => router.push(`${pathname}/modify`)}>
           수정
         </Button>
-        <Button size="lg" color="red">
+        <Button size="lg" color="red" onClick={handleDelete}>
           삭제
         </Button>
       </div>