feat: fetchWrapper 마이그레이션 및 토큰 리프레시 캐싱 구현

- 40+ actions.ts 파일을 fetchWrapper 패턴으로 마이그레이션
- 토큰 리프레시 캐싱 로직 추가 (refresh-token.ts)
- ApiErrorContext 추가로 전역 에러 처리 개선
- HR EmployeeForm 컴포넌트 개선
- 참조함(ReferenceBox) 기능 수정
- juil 테스트 URL 페이지 추가
- claudedocs 문서 업데이트

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

src/components/approval/ApprovalBox/actions.ts

@@ -10,7 +10,7 @@
 
 'use server';
 
-import { cookies } from 'next/headers';
+import { serverFetch } from '@/lib/api/fetch-wrapper';
 import type { ApprovalRecord, ApprovalType, ApprovalStatus } from './types';
 
 // ============================================
@@ -81,21 +81,6 @@ interface InboxStepApiData {
 // 헬퍼 함수
 // ============================================
 
-/**
- * API 헤더 생성
- */
-async function getApiHeaders(): Promise<HeadersInit> {
-  const cookieStore = await cookies();
-  const token = cookieStore.get('access_token')?.value;
-
-  return {
-    'Accept': 'application/json',
-    'Content-Type': 'application/json',
-    'Authorization': token ? `Bearer ${token}` : '',
-    'X-API-KEY': process.env.API_KEY || '',
-  };
-}
-
 /**
  * API 상태 → 프론트엔드 상태 변환
  */
@@ -108,6 +93,22 @@ function mapApiStatus(apiStatus: string): ApprovalStatus {
   return statusMap[apiStatus] || 'pending';
 }
 
+/**
+ * 프론트엔드 탭 상태 → 백엔드 API 상태 변환
+ * 백엔드 inbox API가 기대하는 값:
+ * - requested: 결재 요청 (현재 내 차례) = 미결재
+ * - completed: 내가 처리 완료 = 결재완료
+ * - rejected: 내가 반려한 문서 = 결재반려
+ */
+function mapTabToApiStatus(tabStatus: string): string | undefined {
+  const statusMap: Record<string, string> = {
+    'pending': 'requested',   // 미결재 → 결재 요청
+    'approved': 'completed',  // 결재완료 → 처리 완료
+    'rejected': 'rejected',   // 반려 (동일)
+  };
+  return statusMap[tabStatus];
+}
+
 /**
  * 양식 카테고리 → 결재 유형 변환
  */
@@ -175,16 +176,19 @@ export async function getInbox(params?: {
   approval_type?: string;
   sort_by?: string;
   sort_dir?: 'asc' | 'desc';
-}): Promise<{ data: ApprovalRecord[]; total: number; lastPage: number }> {
+}): Promise<{ data: ApprovalRecord[]; total: number; lastPage: number; __authError?: boolean }> {
   try {
-    const headers = await getApiHeaders();
     const searchParams = new URLSearchParams();
 
     if (params?.page) searchParams.set('page', String(params.page));
     if (params?.per_page) searchParams.set('per_page', String(params.per_page));
     if (params?.search) searchParams.set('search', params.search);
     if (params?.status && params.status !== 'all') {
-      searchParams.set('status', params.status);
+      // 프론트엔드 탭 상태를 백엔드 API 상태로 변환
+      const apiStatus = mapTabToApiStatus(params.status);
+      if (apiStatus) {
+        searchParams.set('status', apiStatus);
+      }
     }
     if (params?.approval_type && params.approval_type !== 'all') {
       searchParams.set('approval_type', params.approval_type);
@@ -194,20 +198,20 @@ export async function getInbox(params?: {
 
     const url = `${process.env.NEXT_PUBLIC_API_URL}/api/v1/approvals/inbox?${searchParams.toString()}`;
 
-    const response = await fetch(url, {
-      method: 'GET',
-      headers,
-      cache: 'no-store',
-    });
+    const { response, error } = await serverFetch(url, { method: 'GET' });
 
-    if (!response.ok) {
-      console.error('[ApprovalBoxActions] GET inbox error:', response.status);
+    if (error?.__authError) {
+      return { data: [], total: 0, lastPage: 1, __authError: true };
+    }
+
+    if (!response) {
+      console.error('[ApprovalBoxActions] GET inbox error:', error?.message);
       return { data: [], total: 0, lastPage: 1 };
     }
 
     const result: ApiResponse<PaginatedResponse<InboxApiData>> = await response.json();
 
-    if (!result.success || !result.data?.data) {
+    if (!response.ok || !result.success || !result.data?.data) {
       console.warn('[ApprovalBoxActions] No data in response');
       return { data: [], total: 0, lastPage: 1 };
     }
@@ -228,25 +232,19 @@ export async function getInbox(params?: {
  */
 export async function getInboxSummary(): Promise<InboxSummary | null> {
   try {
-    const headers = await getApiHeaders();
-
-    const response = await fetch(
+    const { response, error } = await serverFetch(
       `${process.env.NEXT_PUBLIC_API_URL}/api/v1/approvals/inbox/summary`,
-      {
-        method: 'GET',
-        headers,
-        cache: 'no-store',
-      }
+      { method: 'GET' }
     );
 
-    if (!response.ok) {
-      console.error('[ApprovalBoxActions] GET inbox/summary error:', response.status);
+    if (error?.__authError || !response) {
+      console.error('[ApprovalBoxActions] GET inbox/summary error:', error?.message);
       return null;
     }
 
     const result: ApiResponse<InboxSummary> = await response.json();
 
-    if (!result.success || !result.data) {
+    if (!response.ok || !result.success || !result.data) {
       return null;
     }
 
@@ -260,19 +258,24 @@ export async function getInboxSummary(): Promise<InboxSummary | null> {
 /**
  * 승인 처리
  */
-export async function approveDocument(id: string, comment?: string): Promise<{ success: boolean; error?: string }> {
+export async function approveDocument(id: string, comment?: string): Promise<{ success: boolean; error?: string; __authError?: boolean }> {
   try {
-    const headers = await getApiHeaders();
-
-    const response = await fetch(
+    const { response, error } = await serverFetch(
       `${process.env.NEXT_PUBLIC_API_URL}/api/v1/approvals/${id}/approve`,
       {
         method: 'POST',
-        headers,
         body: JSON.stringify({ comment: comment || '' }),
       }
     );
 
+    if (error?.__authError) {
+      return { success: false, __authError: true };
+    }
+
+    if (!response) {
+      return { success: false, error: error?.message || '승인 처리에 실패했습니다.' };
+    }
+
     const result = await response.json();
 
     if (!response.ok || !result.success) {
@@ -295,7 +298,7 @@ export async function approveDocument(id: string, comment?: string): Promise<{ s
 /**
  * 반려 처리
  */
-export async function rejectDocument(id: string, comment: string): Promise<{ success: boolean; error?: string }> {
+export async function rejectDocument(id: string, comment: string): Promise<{ success: boolean; error?: string; __authError?: boolean }> {
   try {
     if (!comment?.trim()) {
       return {
@@ -304,17 +307,22 @@ export async function rejectDocument(id: string, comment: string): Promise<{ suc
       };
     }
 
-    const headers = await getApiHeaders();
-
-    const response = await fetch(
+    const { response, error } = await serverFetch(
       `${process.env.NEXT_PUBLIC_API_URL}/api/v1/approvals/${id}/reject`,
       {
         method: 'POST',
-        headers,
         body: JSON.stringify({ comment }),
       }
     );
 
+    if (error?.__authError) {
+      return { success: false, __authError: true };
+    }
+
+    if (!response) {
+      return { success: false, error: error?.message || '반려 처리에 실패했습니다.' };
+    }
+
     const result = await response.json();
 
     if (!response.ok || !result.success) {