From 2ee413e077c8cffaef60a88bde1c7b1378890989 Mon Sep 17 00:00:00 2001
From: bicochan <chanii8@naver.com>
Date: Mon, 30 Jun 2025 16:55:34 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=95=84=EC=9B=83=20?=
 =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/cs/app/api/auth/logout/route.ts            | 17 +++++++++++++++++
 .../common/components/src/ui/header/index.tsx   | 14 +++++++++++++-
 2 files changed, 30 insertions(+), 1 deletion(-)
 create mode 100644 apps/cs/app/api/auth/logout/route.ts

diff --git a/apps/cs/app/api/auth/logout/route.ts b/apps/cs/app/api/auth/logout/route.ts
new file mode 100644
index 000000000..fdcc9df7c
--- /dev/null
+++ b/apps/cs/app/api/auth/logout/route.ts
@@ -0,0 +1,17 @@
+import { cookies } from "next/headers";
+import { NextResponse } from "next/server";
+import {
+  ACCESS_TOKEN,
+  AUTH_USER_ID,
+  CLAIM_NAME,
+  REFRESH_TOKEN,
+} from "@/shared/config";
+
+export async function POST() {
+  const cookieStore = await cookies();
+  cookieStore.delete(ACCESS_TOKEN);
+  cookieStore.delete(REFRESH_TOKEN);
+  cookieStore.delete(AUTH_USER_ID);
+  cookieStore.delete(CLAIM_NAME);
+  return NextResponse.json({ message: "Logged out" }, { status: 200 });
+}
diff --git a/packages/common/components/src/ui/header/index.tsx b/packages/common/components/src/ui/header/index.tsx
index ce9419ef1..433435009 100644
--- a/packages/common/components/src/ui/header/index.tsx
+++ b/packages/common/components/src/ui/header/index.tsx
@@ -52,6 +52,18 @@ export function Header({ viewOnly }: { viewOnly?: boolean }) {
     queryFn: () => getUserPopupList(),
   });
 
+  const logout = async () => {
+    try {
+      const response = await fetch("/api/auth/logout", {
+        method: "POST",
+      });
+      if (!response.ok) throw new Error("Failed to logout");
+      window.location.href = "/auth/login";
+    } catch (error) {
+      console.error(error);
+    }
+  };
+
   const openPopup = useCallback(async (popup: Popup) => {
     try {
       const cookieName = `cs-popup-hide-for-day-${popup.popupSn}`;
@@ -139,7 +151,7 @@ export function Header({ viewOnly }: { viewOnly?: boolean }) {
             <p className="text-base text-label">접속 IP</p>
             <p></p>
           </div>
-          <DropdownMenuItem>로그아웃</DropdownMenuItem>
+          <DropdownMenuItem onClick={logout}>로그아웃</DropdownMenuItem>
         </DropdownMenuContent>
       </DropdownMenu>
     </header>