fix: 관리자 페이지 접근 제어 추가

src/App.tsx

@@ -45,8 +45,16 @@ function App() {
             <Route path="/my-page" element={<MyPage />} />
             <Route path="/chat" element={<ChatPage />} />
             <Route path="/chat-apply" element={<ChatApplyPage />} />
-            <Route path="/admin" element={<Admin />} />
           </Route>
+
+          <Route
+            path="/admin"
+            element={
+              <ProtectedRoute requiredRole={'ADMIN'}>
+                <Admin />
+              </ProtectedRoute>
+            }
+          />
           <Route path="*" element={<NotFound />} />
         </Routes>
 

src/assets/components/ProtectedRoute.tsx

@@ -1,15 +1,38 @@
 import { Navigate } from 'react-router-dom';
 import type { ReactNode } from 'react';
 import { useAuth } from '@/contexts/AuthContext';
+import NotFound from '@/pages/404/NotFoundPage';
 
 interface ProtectedRouteProps {
   children: ReactNode;
+  requiredRole?: string | string[];
 }
 
-export default function ProtectedRoute({ children }: ProtectedRouteProps) {
-  const { isAuthenticated } = useAuth();
+export default function ProtectedRoute({
+  children,
+  requiredRole,
+}: ProtectedRouteProps) {
+  const { isAuthenticated, user } = useAuth();
   if (!isAuthenticated) {
     return <Navigate to="/" replace />;
   }
+
+  if (requiredRole) {
+    const userRoles: string[] = Array.isArray(user?.role)
+      ? (user?.role as string[])
+      : user?.role
+        ? [user.role as string]
+        : [];
+
+    const required = Array.isArray(requiredRole)
+      ? requiredRole
+      : [requiredRole];
+
+    const hasRole = required.some((r) => userRoles.includes(r));
+    if (!hasRole) {
+      return <NotFound />;
+    }
+  }
+
   return <>{children}</>;
 }

vercel.json

@@ -1,5 +1,3 @@
 {
-  "rewrites": [
-    { "source": "/(.*)", "destination": "/index.html" }
-  ]
+  "rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
 }