diff --git a/frontend/app/(WithNavbar)/admin/[generation]/comments-disclosure/page.tsx b/frontend/app/(WithNavbar)/admin/[generation]/comments-disclosure/page.tsx
new file mode 100644
index 00000000..d9d55700
--- /dev/null
+++ b/frontend/app/(WithNavbar)/admin/[generation]/comments-disclosure/page.tsx
@@ -0,0 +1,65 @@
+"use client";
+
+import {
+ getCommentsDisclosure,
+ postCommentsDisclosure,
+} from "@/src/apis/comment";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+
+const QUERY_KEY = ["comments-disclosure"];
+
+export default function CommentsDisclosurePage() {
+ const queryClient = useQueryClient();
+ const { data, isLoading, isError } = useQuery(
+ QUERY_KEY,
+ getCommentsDisclosure
+ );
+
+ const { mutate: updateDisclosure, isLoading: isUpdating } = useMutation(
+ postCommentsDisclosure,
+ {
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: QUERY_KEY });
+ },
+ onError: () => {
+ alert("댓글 공개 상태 변경에 실패했습니다. 잠시 후 다시 시도해주세요.");
+ },
+ }
+ );
+
+ if (isLoading) {
+ return
로딩중...
;
+ }
+
+ if (isError || data === undefined) {
+ return 에러 발생
;
+ }
+
+ const nextDisclosure = !data;
+
+ return (
+
+ 댓글 전체 공개 상태 관리
+
+
+ 현재 상태:{" "}
+
+ {data ? "활성화" : "비활성화"}
+
+
+
+
+
+ );
+}
diff --git a/frontend/components/admin/AdminTabs.tsx b/frontend/components/admin/AdminTabs.tsx
index 8794b3e1..8c8785e9 100644
--- a/frontend/components/admin/AdminTabs.tsx
+++ b/frontend/components/admin/AdminTabs.tsx
@@ -14,6 +14,7 @@ export default function AdminTabs() {
const tabs = [
{ name: "멤버 권한 변경", href: `/admin/${generation}` },
{ name: "지원서 on/off", href: `/admin/${generation}/on-off` },
+ { name: "댓글 전체 공개 on/off", href: `/admin/${generation}/comments-disclosure` },
];
return (
diff --git a/frontend/src/apis/comment/index.ts b/frontend/src/apis/comment/index.ts
index f77c8e41..6e3e158e 100644
--- a/frontend/src/apis/comment/index.ts
+++ b/frontend/src/apis/comment/index.ts
@@ -107,3 +107,16 @@ export const getCommentsIsLike = async (commentId: string) => {
return data;
};
+
+export const getCommentsDisclosure = async () => {
+ const { data } = await https.get(`/comments/disclosure`);
+ return data === true || data === "true";
+};
+
+export const postCommentsDisclosure = async (isDisclosure: boolean) => {
+ const { data } = await https.post(
+ `/comments/disclosure`,
+ `${isDisclosure}`
+ );
+ return data === true || data === "true";
+};