feat(WEB): API 인프라 리팩토링, CEO 대시보드 현황판 개선 및 문서 시스템 강화

- API: fetch-wrapper/proxy/refresh-token 리팩토링, authenticated-fetch 신규 추가
- CEO 대시보드: EnhancedSections 현황판 기능 개선, dashboard transformers/types 확장
- 문서 시스템: ApprovalLine/DocumentHeader/DocumentToolbar/DocumentViewer 개선
- 작업지시서: 검사보고서/작업일지 문서 컴포넌트 개선 (벤딩/스크린/슬랫)
- 레이아웃: Sidebar/AuthenticatedLayout 수정
- 작업자화면: WorkerScreen 수정

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/app/api/proxy/[...path]/route.ts

@@ -1,5 +1,5 @@
 import { NextRequest, NextResponse } from 'next/server';
-import { refreshAccessToken } from '@/lib/api/refresh-token';
+import { authenticatedFetch } from '@/lib/api/authenticated-fetch';
 
 /**
  * 🔵 Catch-All API Proxy (HttpOnly Cookie Pattern)
@@ -25,44 +25,11 @@ import { refreshAccessToken } from '@/lib/api/refresh-token';
  * - Frontend: fetch('/api/proxy/item-master/init')
  * - Backend: GET https://api.codebridge-x.com/api/v1/item-master/init
  *
- * ⚠️ 주의:
- * - 로그아웃 API(/api/auth/logout)와 동일한 패턴
- * - 모든 HTTP 메서드 지원 (GET, POST, PUT, DELETE)
- * - 쿼리 파라미터와 요청 바디 모두 전달
+ * 🔄 인증 처리:
+ * - 401 감지 → refresh → retry 는 authenticatedFetch 게이트웨이에 위임
+ * - PROXY는 쿠키 읽기/설정/삭제만 담당
  */
 
-/**
- * 백엔드 API 요청 실행 함수
- *
- * @param isFormData - true인 경우 Content-Type 헤더를 생략 (브라우저가 boundary 자동 설정)
- */
-async function executeBackendRequest(
-  url: URL,
-  method: string,
-  token: string | undefined,
-  body: string | FormData | undefined,
-  contentType: string,
-  isFormData: boolean = false
-): Promise<Response> {
-  // FormData인 경우 Content-Type을 생략해야 브라우저가 boundary를 자동 설정
-  const headers: Record<string, string> = {
-    'Accept': 'application/json',
-    'X-API-KEY': process.env.API_KEY || '',
-    'Authorization': token ? `Bearer ${token}` : '',
-  };
-
-  // FormData가 아닌 경우에만 Content-Type 설정
-  if (!isFormData) {
-    headers['Content-Type'] = contentType;
-  }
-
-  return fetch(url.toString(), {
-    method,
-    headers,
-    body,
-  });
-}
-
 /**
  * 쿠키 생성 헬퍼 함수
  */
@@ -74,13 +41,13 @@ function createTokenCookies(tokens: { accessToken?: string; refreshToken?: strin
     cookies.push([
       `access_token=${tokens.accessToken}`,
       'HttpOnly',
-      ...(isProduction ? ['Secure'] : []), // HTTPS only in production
-      'SameSite=Lax', // Lax for better compatibility (matches login route)
+      ...(isProduction ? ['Secure'] : []),
+      'SameSite=Lax',
       'Path=/',
       `Max-Age=${tokens.expiresIn || 7200}`,
     ].join('; '));
 
-    // ✅ FCM 등에서 인증 상태 확인용 (non-HttpOnly)
+    // FCM 등에서 인증 상태 확인용 (non-HttpOnly)
     cookies.push([
       'is_authenticated=true',
       ...(isProduction ? ['Secure'] : []),
@@ -94,8 +61,8 @@ function createTokenCookies(tokens: { accessToken?: string; refreshToken?: strin
     cookies.push([
       `refresh_token=${tokens.refreshToken}`,
       'HttpOnly',
-      ...(isProduction ? ['Secure'] : []), // HTTPS only in production
-      'SameSite=Lax', // Lax for better compatibility (matches login route)
+      ...(isProduction ? ['Secure'] : []),
+      'SameSite=Lax',
       'Path=/',
       'Max-Age=604800', // 7 days
     ].join('; '));
@@ -119,12 +86,6 @@ function createClearTokenCookies(): string[] {
 
 /**
  * Catch-all proxy handler for all HTTP methods
- *
- * 🔄 토큰 갱신 로직:
- * 1. 현재 access_token으로 백엔드 요청
- * 2. 401 응답 시 → refresh_token으로 새 토큰 발급
- * 3. 새 토큰으로 원래 요청 재시도
- * 4. 재시도도 실패하면 → 쿠키 삭제 후 401 반환
  */
 async function proxyRequest(
   request: NextRequest,
@@ -132,20 +93,9 @@ async function proxyRequest(
   method: string
 ) {
   try {
-    // 1. 🆕 미들웨어에서 전달한 새 토큰 먼저 확인
-    // Set-Cookie는 응답 헤더에만 설정되어 같은 요청 내 cookies()로 읽을 수 없음
-    // 따라서 request headers로 전달된 새 토큰을 먼저 사용
-    const refreshedAccessToken = request.headers.get('x-refreshed-access-token');
-    const refreshedRefreshToken = request.headers.get('x-refreshed-refresh-token');
-
-    // 2. HttpOnly 쿠키에서 토큰 읽기 (서버에서만 가능!)
-    let token = refreshedAccessToken || request.cookies.get('access_token')?.value;
-    const refreshToken = refreshedRefreshToken || request.cookies.get('refresh_token')?.value;
-
-    // 디버깅: 어떤 토큰을 사용하는지 로그
-    if (refreshedAccessToken) {
-      console.log('🔵 [PROXY] Using refreshed token from middleware headers');
-    }
+    // 1. HttpOnly 쿠키에서 토큰 읽기
+    const token = request.cookies.get('access_token')?.value;
+    const refreshToken = request.cookies.get('refresh_token')?.value;
 
     // 2. 백엔드 URL 구성
     const backendUrl = `${process.env.NEXT_PUBLIC_API_URL}/api/v1/${params.path.join('/')}`;
@@ -163,26 +113,19 @@ async function proxyRequest(
       if (contentType.includes('application/json')) {
         body = await request.text();
         console.log('🔵 [PROXY] Request:', method, url.toString());
-        console.log('🔵 [PROXY] Request Body:', body); // 디버깅용
+        console.log('🔵 [PROXY] Request Body:', body);
       } else if (contentType.includes('multipart/form-data')) {
-        // multipart/form-data 처리: FormData를 그대로 전달
         console.log('📎 [PROXY] Processing multipart/form-data request');
         isFormData = true;
 
-        // 원본 요청의 FormData 읽기
         const originalFormData = await request.formData();
-
-        // 새 FormData 생성 (백엔드 전송용)
         const newFormData = new FormData();
 
-        // 모든 필드 복사
         for (const [key, value] of originalFormData.entries()) {
           if (value instanceof File) {
-            // File 객체는 그대로 추가
             newFormData.append(key, value, value.name);
             console.log(`📎 [PROXY] File field: ${key} = ${value.name} (${value.size} bytes)`);
           } else {
-            // 일반 필드
             newFormData.append(key, value);
             console.log(`📎 [PROXY] Form field: ${key} = ${value}`);
           }
@@ -195,69 +138,42 @@ async function proxyRequest(
       console.log('🔵 [PROXY] Request:', method, url.toString());
     }
 
-    // 4. 백엔드로 프록시 요청
-    let backendResponse = await executeBackendRequest(url, method, token, body, contentType, isFormData);
-    let newTokens: { accessToken?: string; refreshToken?: string; expiresIn?: number } | null = null;
-
-    // 5. 🔄 401 응답 시 토큰 갱신 후 재시도
-    if (backendResponse.status === 401 && refreshToken) {
-      console.log('🔄 [PROXY] Got 401, attempting token refresh...');
-
-      const refreshResult = await refreshAccessToken(refreshToken, 'PROXY');
-
-      if (refreshResult.success && refreshResult.accessToken) {
-        console.log('✅ [PROXY] Token refreshed, retrying original request...');
-
-        // 새 토큰으로 원래 요청 재시도
-        token = refreshResult.accessToken;
-        newTokens = refreshResult;
-        backendResponse = await executeBackendRequest(url, method, token, body, contentType, isFormData);
-
-        console.log('🔵 [PROXY] Retry response status:', backendResponse.status);
-      } else {
-        // 🔄 리프레시 실패 → 다른 요청이 동시에 refresh 중일 수 있음
-        // 짧은 딜레이 후 한 번 더 refresh 시도
-        console.log('🔄 [PROXY] Refresh failed, waiting and retrying...');
-        await new Promise(resolve => setTimeout(resolve, 500)); // 500ms 대기
-
-        // 다시 refresh 시도 (다른 요청이 새 refresh_token을 발급받았을 수 있음)
-        const latestRefreshToken = request.cookies.get('refresh_token')?.value;
-        if (latestRefreshToken) {
-          const retryResult = await refreshAccessToken(latestRefreshToken, 'PROXY');
-
-          if (retryResult.success && retryResult.accessToken) {
-            console.log('✅ [PROXY] Retry refresh succeeded!');
-            token = retryResult.accessToken;
-            newTokens = retryResult;
-            backendResponse = await executeBackendRequest(url, method, token, body, contentType, isFormData);
-            console.log('🔵 [PROXY] Retry response status:', backendResponse.status);
-          }
-        }
-
-        // 여전히 401이면 쿠키 삭제하고 401 반환
-        if (backendResponse.status === 401) {
-          console.warn('🔴 [PROXY] Token refresh failed after retry, clearing cookies...');
-
-          const clearResponse = NextResponse.json(
-            { error: 'Authentication failed', needsReauth: true },
-            { status: 401 }
-          );
-
-          createClearTokenCookies().forEach(cookie => {
-            clearResponse.headers.append('Set-Cookie', cookie);
-          });
-
-          return clearResponse;
-        }
-      }
+    // 4. 헤더 구성
+    const headers: Record<string, string> = {
+      'Accept': 'application/json',
+      'X-API-KEY': process.env.API_KEY || '',
+      'Authorization': token ? `Bearer ${token}` : '',
+    };
+    if (!isFormData) {
+      headers['Content-Type'] = contentType;
     }
 
-    // 6. 응답 데이터 읽기
+    // 5. authenticatedFetch 게이트웨이로 요청 실행
+    //    401 감지 → refresh → retry 모두 게이트웨이가 처리
+    const { response: backendResponse, newTokens, authFailed } = await authenticatedFetch(
+      url.toString(),
+      { method, headers, body },
+      refreshToken,
+      'PROXY'
+    );
+
+    // 6. 인증 실패 → 쿠키 삭제 + 401 반환
+    if (authFailed) {
+      console.warn('🔴 [PROXY] Auth failed, clearing cookies...');
+      const clearResponse = NextResponse.json(
+        { error: 'Authentication failed', needsReauth: true },
+        { status: 401 }
+      );
+      createClearTokenCookies().forEach(cookie => {
+        clearResponse.headers.append('Set-Cookie', cookie);
+      });
+      return clearResponse;
+    }
+
+    // 7. 응답 처리 (바이너리 vs 텍스트/JSON)
     console.log('🔵 [PROXY] Response status:', backendResponse.status);
     const responseContentType = backendResponse.headers.get('content-type') || 'application/json';
 
-    // 7. 바이너리 파일 vs 텍스트/JSON 구분
-    // 파일 다운로드 (PDF, 이미지, 등)는 바이너리로 처리해야 손상되지 않음
     const isBinaryResponse =
       responseContentType.includes('application/pdf') ||
       responseContentType.includes('application/octet-stream') ||
@@ -270,7 +186,6 @@ async function proxyRequest(
     let clientResponse: NextResponse;
 
     if (isBinaryResponse) {
-      // 바이너리 파일: arrayBuffer로 읽어서 그대로 전달
       console.log('📄 [PROXY] Binary response detected:', responseContentType);
       const binaryData = await backendResponse.arrayBuffer();
 
@@ -283,7 +198,6 @@ async function proxyRequest(
         },
       });
     } else {
-      // JSON/텍스트: text로 읽어서 전달
       const responseData = await backendResponse.text();
 
       clientResponse = new NextResponse(responseData, {
@@ -295,7 +209,7 @@ async function proxyRequest(
     }
 
     // 8. 토큰이 갱신되었으면 새 쿠키 설정
-    if (newTokens && newTokens.accessToken) {
+    if (newTokens?.accessToken) {
       createTokenCookies(newTokens).forEach(cookie => {
         clientResponse.headers.append('Set-Cookie', cookie);
       });