diff --git a/src/api/fetchData.ts b/src/api/fetchData.ts
index ce98cb1..4094e63 100644
--- a/src/api/fetchData.ts
+++ b/src/api/fetchData.ts
@@ -43,6 +43,7 @@ export default async function fetchData<
if (response.status === 401) {
localStorage.removeItem("accessToken");
localStorage.removeItem("refreshToken");
+ window.location.href = `/auth/${AuthPaths.LOGIN}`;
}
const newAccessToken = response.headers.get("x-access-token");
@@ -51,7 +52,7 @@ export default async function fetchData<
}
if (!response.ok) {
- window.location.href = `/auth/${AuthPaths.LOGIN}`;
+ throw new Error(`${response.status}`);
}
return response.json();
diff --git a/src/api/user/deleteUser.ts b/src/api/user/deleteUser.ts
new file mode 100644
index 0000000..556e0c9
--- /dev/null
+++ b/src/api/user/deleteUser.ts
@@ -0,0 +1,9 @@
+import fetchData from "../fetchData";
+
+export default async function deleteUser(userId: number) {
+ const url = `/admin-root/users/${userId}`;
+
+ const response = await fetchData({ url, method: "DELETE" });
+
+ return response;
+}
diff --git a/src/pages/user/DeleteDialog.tsx b/src/pages/user/DeleteDialog.tsx
new file mode 100644
index 0000000..97ecfe9
--- /dev/null
+++ b/src/pages/user/DeleteDialog.tsx
@@ -0,0 +1,57 @@
+import {
+ DialogContent,
+ DialogDescription,
+ DialogHeader,
+ DialogTitle,
+} from "../../components/ui/dialog";
+
+import { Button } from "../../components/ui/button";
+import { DefaultPaths } from "../../router/paths";
+import deleteUser from "../../api/user/deleteUser";
+import { useMutation } from "@tanstack/react-query";
+import { useNavigate } from "react-router-dom";
+
+type DeleteDialogProps = {
+ id: number;
+ email: string;
+};
+
+export default function DeleteDialog({ id, email }: DeleteDialogProps) {
+ const navigate = useNavigate();
+ const deleteMutation = useMutation({
+ mutationFn: () => deleteUser(id),
+
+ onSuccess: () => {
+ navigate(`/${DefaultPaths.USER.LIST}`);
+ },
+ onError: () => {
+ alert("계정 삭제는 root 계정만 가능합니다.");
+ },
+ });
+
+ const onClickDeleteUser = () => {
+ deleteMutation.mutate();
+ };
+
+ return (
+
+
+ 해당 유저를 삭제하시겠습니까?
+
+ 한번 삭제한 유저는 되돌릴 수 없습니다.
+
+
+
+
+
+
+ );
+}
diff --git a/src/pages/user/Detail.tsx b/src/pages/user/Detail.tsx
index e7ba26d..bd3d6bb 100644
--- a/src/pages/user/Detail.tsx
+++ b/src/pages/user/Detail.tsx
@@ -4,10 +4,14 @@ import APIErrorProvider, {
import APILoadingProvider, {
useAPILoading,
} from "../../components/fallback/APILoadingProvider";
+import { Dialog, DialogTrigger } from "../../components/ui/dialog";
+import { Button } from "../../components/ui/button";
+import DeleteDialog from "./DeleteDialog";
import ItemContainer from "../../components/Detail/ItemContainer";
import UIErrorBoundary from "../../components/fallback/UIErrorBoundary";
import { UserType } from "../../api/user";
+import sprite from "../../assets/SVGsprite.svg";
import { useLoaderData } from "react-router-dom";
import { useQuery } from "@tanstack/react-query";
import userQueryOptions from "../../queries/userQueryOptions";
@@ -109,6 +113,17 @@ function UserDetailContent() {
+
);