Merge pull request #175 from CSE-Shaco/develop

Feat: 권한별 접근 제어를 위한 ApiCodeGuard 적용 및 레이아웃 업데이트

Author: CSE-Shaco

src/app/admin/layout.js

@@ -1,21 +1,15 @@
-//import { Suspense } from "react";
-
-
 import MenuHeader from '@/components/ui/common/MenuHeader';
 import ApiCodeGuard from '@/components/auth/ApiCodeGuard.jsx';
 
 export const metadata = {
-    title: "Admin",
-    description: "Admin management and participation platform",
+    title: "Admin", description: "Admin management and participation platform",
 };
 
-export default function AdminLayout({ children }) {
-    return (
-        <ApiCodeGuard>
+export default function AdminLayout({children}) {
+    return (<ApiCodeGuard requiredRole="ADMIN" nextOverride="/admin">
             <>
-                <MenuHeader />
+                <MenuHeader/>
                 {children}
             </>
-        </ApiCodeGuard>
-    );
+        </ApiCodeGuard>);
 }

src/app/core-attendance/layout.js

@@ -6,7 +6,7 @@ export const metadata = {
 };
 
 export default function CoreAttendanceLayout({children}) {
-    return (<ApiCodeGuard>
+    return (<ApiCodeGuard requiredRole="LEAD" nextOverride="/core-attendance">
             <>
                 <MenuHeader/>
                 {children}

src/app/coreadmin/layout.js

@@ -2,19 +2,14 @@ import MenuHeader from '@/components/ui/common/MenuHeader';
 import ApiCodeGuard from '@/components/auth/ApiCodeGuard.jsx';
 
 export const metadata = {
-  title: 'CoreAdmin',
-  description: 'Core member application management',
+    title: 'CoreAdmin', description: 'Core member application management',
 };
 
-export default function CoreAdminLayout({ children }) {
-  return (
-    <ApiCodeGuard>
-      <>
-        <MenuHeader />
-        {children}
-      </>
-    </ApiCodeGuard>
-  );
-}
-
-
+export default function CoreAdminLayout({children}) {
+    return (<ApiCodeGuard requiredRole="ORGANIZER" nextOverride="/coreadmin">
+            <>
+                <MenuHeader/>
+                {children}
+            </>
+        </ApiCodeGuard>);
+}

src/app/main/layout.js

@@ -1,19 +1,15 @@
-//import { Suspense } from "react";
 import MenuHeader from "@/components/ui/common/MenuHeader";
 import ApiCodeGuard from '@/components/auth/ApiCodeGuard.jsx';
 
 export const metadata = {
-    title: "Home",
-    description: "Home management and participation platform",
+    title: "Home", description: "Home management and participation platform",
 };
 
-export default function HomeLayout({ children }) {
-    return (
-        <ApiCodeGuard>
+export default function HomeLayout({children}) {
+    return (<ApiCodeGuard requiredRole="CORE" nextOverride="/main">
             <>
-                <MenuHeader />
+                <MenuHeader/>
                 {children}
             </>
-        </ApiCodeGuard>
-    );
+        </ApiCodeGuard>);
 }

src/components/auth/ApiCodeGuard.jsx

@@ -1,55 +1,80 @@
-'use client'
-
-import { useEffect, useState } from 'react';
-import { useRouter } from 'next/navigation';
+'use client';
 
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { usePathname, useRouter, useSearchParams } from 'next/navigation';
 import { useAuthenticatedApi } from '@/hooks/useAuthenticatedApi';
 import Loader from '@/components/ui/common/Loader';
 
-export default function ApiCodeGuard({ children }) {
-  const router = useRouter();
-  const { apiClient } = useAuthenticatedApi();
-
-  const [checking, setChecking] = useState(true);
-  const [allowed, setAllowed] = useState(false);
-
-  useEffect(() => {
-    let cancelled = false;
-
-    const verifyAccess = async () => {
-      try {
-        const res = await apiClient.get('/recruit/members', {
-          params: { page: 0, size: 20, sort: 'createdAt', dir: 'DESC' },
-        });
-
-        const code = res?.data?.code;
-        if (!cancelled) {
-          if (code === 200) {
-            setAllowed(true);
-          } else {
-            router.replace('/auth/signin');
-          }
-        }
-      } catch (error) {
-        if (!cancelled) {
-          // 인터셉터에서 401/403 처리로 리다이렉트가 발생할 수 있으므로, 보조적으로 차단
-          router.replace('/auth/signin');
-        }
-      } finally {
-        if (!cancelled) {
-          setChecking(false);
+/**
+ * ApiCodeGuard
+ * - /auth/{role}?next=<...> 를 호출해 200(또는 body.code=200)이면 통과
+ * - 아니면 로그인(/auth/signin?next=...)으로 보냄
+ *
+ * props:
+ *  - requiredRole: 'GUEST'|'MEMBER'|'CORE'|'LEAD'|'ORGANIZER'|'ADMIN' (백엔드 enum과 동일 문자열)
+ *  - nextOverride?: string  // 지정 시 이 URL을 next로 사용, 없으면 현재 경로 기준 자동 계산
+ *  - children: ReactNode
+ */
+export default function ApiCodeGuard({ requiredRole, nextOverride, children }) {
+    const router = useRouter();
+    const pathname = usePathname();
+    const searchParams = useSearchParams();
+    const { apiClient } = useAuthenticatedApi();
+
+    const [checking, setChecking] = useState(true);
+    const [allowed, setAllowed] = useState(false);
+
+    // next URL 계산 (override > 현재 경로)
+    const nextUrl = useMemo(() => {
+        if (nextOverride) return encodeURIComponent(nextOverride);
+        const q = searchParams?.toString();
+        return encodeURIComponent(`${pathname}${q ? `?${q}` : ''}`);
+    }, [nextOverride, pathname, searchParams]);
+
+    const cancelledRef = useRef(false);
+
+    useEffect(() => {
+        if (!requiredRole) {
+            // 역할이 없으면 바로 차단
+            router.replace(`/auth/signin?next=${nextUrl}`);
+            return;
         }
-      }
-    };
 
-    verifyAccess();
+        cancelledRef.current = false;
+
+        const verify = async () => {
+            try {
+                // ✅ 권한 체크: /auth/{role}?next=...
+                const res = await apiClient.get(`/auth/${requiredRole}`, {
+                    params: { next: decodeURIComponent(nextUrl) }, // 서버가 raw URL 원하면 decode해서 전달
+                });
+
+                if (cancelledRef.current) return;
+
+                const okHttp = res?.status === 200 || res?.status === 204;
+                const okBody = (res?.data?.code ?? 200) === 200;
+
+                if (okHttp && okBody) {
+                    setAllowed(true);
+                } else {
+                    router.replace(`/auth/signin?next=${nextUrl}`);
+                }
+            } catch {
+                if (!cancelledRef.current) {
+                    router.replace(`/auth/signin?next=${nextUrl}`);
+                }
+            } finally {
+                if (!cancelledRef.current) setChecking(false);
+            }
+        };
 
-    return () => {
-      cancelled = true;
-    };
-  }, [apiClient, router]);
+        void verify();
+        return () => {
+            cancelledRef.current = true;
+        };
+    }, [apiClient, requiredRole, nextUrl, router]);
 
-  if (checking) return <Loader isLoading={true} />;
-  if (!allowed) return null;
-  return children;
-} 
+    if (checking) return <Loader isLoading />;
+    if (!allowed) return null;
+    return <>{children}</>;
+}