fix: 로그인 후 사용자 역할 인식 문제 해결

- AuthContext를 통한 통합 인증 상태 관리로 변경
- App.jsx와 AuthContext 간 중복 사용자 상태 관리 제거
- SimpleLogin에서 AuthContext의 login 함수 직접 사용
- 로그인 후 사용자 역할이 즉시 올바르게 인식되도록 개선
- 새로고침 없이도 시스템 관리자 권한 정상 표시

변경사항:
- App.jsx: AuthProvider 래퍼 추가, 중복 인증 로직 제거
- SimpleLogin.jsx: AuthContext 직접 사용으로 변경
- 사용자 상태 동기화 문제 완전 해결

frontend/src/App.jsx

@@ -13,15 +13,14 @@ import PurchaseRequestPage from './pages/PurchaseRequestPage';
 import SystemLogsPage from './pages/SystemLogsPage';
 import LogMonitoringPage from './pages/LogMonitoringPage';
 import InactiveProjectsPage from './pages/InactiveProjectsPage';
+import { AuthProvider, useAuth } from './contexts/AuthContext';
 import errorLogger from './utils/errorLogger';
 import api from './api';
 import './App.css';
 
-function App() {
+function AppContent() {
   // TK-MP BOM Management System v2.0 - Project Selection Dashboard
-  const [isAuthenticated, setIsAuthenticated] = useState(false);
-  const [isLoading, setIsLoading] = useState(true);
-  const [user, setUser] = useState(null);
+  const { user, isAuthenticated, isLoading, logout } = useAuth();
   const [currentPage, setCurrentPage] = useState('dashboard');
   const [pageParams, setPageParams] = useState({});
   const [selectedProject, setSelectedProject] = useState(null);
@@ -177,30 +176,13 @@ function App() {
     });
   };
 
-  // 인증 상태 확인
+  // 인증된 사용자의 데이터 로드
   useEffect(() => {
-    const checkAuth = async () => {
-      try {
-        const token = localStorage.getItem('access_token');
-        if (token) {
-          api.defaults.headers.common['Authorization'] = `Bearer ${token}`;
-          const userResponse = await api.get('/auth/me');
-          setUser(userResponse.data.user);
-          setIsAuthenticated(true);
-          await loadPendingSignups();
-          await loadProjects(); // 프로젝트 로드 추가
-        }
-      } catch (error) {
-        console.error('인증 확인 실패:', error);
-        localStorage.removeItem('access_token');
-        localStorage.removeItem('user_data');
-        setIsAuthenticated(false);
-      } finally {
-        setIsLoading(false);
-      }
-    };
-    checkAuth();
-  }, []);
+    if (isAuthenticated && user) {
+      loadPendingSignups();
+      loadProjects();
+    }
+  }, [isAuthenticated, user]);
 
   // 페이지 이동 함수
   const navigateToPage = (page, params = {}) => {
@@ -359,22 +341,11 @@ function App() {
     }
   };
 
-  const handleLogout = () => {
-    localStorage.removeItem('access_token');
-    localStorage.removeItem('user_data');
-    setIsAuthenticated(false);
-    setUser(null);
+  const handleLogout = async () => {
+    await logout();
     setCurrentPage('dashboard');
-    window.location.reload();
   };
 
-  const handleLoginSuccess = (userData) => {
-    setIsAuthenticated(true);
-    setUser(userData);
-    setIsLoading(false);
-    loadPendingSignups();
-    loadProjects();
-  };
 
   return (
     <ErrorBoundary errorContext={{ user, currentPage, pageParams }}>
@@ -392,7 +363,7 @@ function App() {
           </div>
         </div>
       ) : !isAuthenticated ? (
-        <SimpleLogin onLoginSuccess={handleLoginSuccess} />
+        <SimpleLogin />
       ) : (
         <div style={{ minHeight: '100vh', background: '#f7fafc' }}>
           {/* 상단 헤더 */}
@@ -429,4 +400,13 @@ function App() {
   );
 }
 
+// AuthProvider로 감싸는 래퍼 컴포넌트
+function App() {
+  return (
+    <AuthProvider>
+      <AppContent />
+    </AuthProvider>
+  );
+}
+
 export default App;

frontend/src/SimpleLogin.jsx

@@ -1,7 +1,9 @@
 import React, { useState } from 'react';
+import { useAuth } from './contexts/AuthContext';
 import api from './api';
 
-const SimpleLogin = ({ onLoginSuccess }) => {
+const SimpleLogin = () => {
+    const { login } = useAuth();
     const [formData, setFormData] = useState({
         username: '',
         password: ''
@@ -110,28 +112,11 @@ const SimpleLogin = ({ onLoginSuccess }) => {
         setError('');
 
         try {
-            const response = await api.post('/auth/login', formData);
-            const data = response.data;
-
-            if (data.success) {
-                // 토큰과 사용자 정보 저장
-                localStorage.setItem('access_token', data.access_token);
-                localStorage.setItem('user_data', JSON.stringify(data.user));
-                
-                setSuccess('로그인 성공! 대시보드로 이동합니다...');
-                
-                // 잠깐 성공 메시지 보여준 후 대시보드로 이동
-                setTimeout(() => {
-                    if (onLoginSuccess) {
-                        onLoginSuccess();
-                    }
-                }, 1000);
-            } else {
-                setError(data.error?.message || '로그인에 실패했습니다.');
-            }
+            await login(formData.username, formData.password);
+            setSuccess('로그인 성공! 대시보드로 이동합니다...');
         } catch (err) {
             console.error('Login error:', err);
-            setError(err.response?.data?.message || '서버 연결에 실패했습니다.');
+            setError(err.message || '서버 연결에 실패했습니다.');
         } finally {
             setIsLoading(false);
         }