[feat]: Shadcn UI 모달 Select 레이아웃 시프트 방지 및 코드 정리

주요 변경사항:
- 테마/언어 선택을 모달 스타일로 변경 (native={false})
  - LoginPage, SignupPage, DashboardLayout 적용
- CSS 2줄로 레이아웃 시프트 완전 제거
  - body { overflow: visible !important }
  - body[data-scroll-locked] { margin-right: 0 !important }
- 미사용 business 컴포넌트 대량 삭제 (코드 정리)
- CEODashboard → MainDashboard 이름 변경
- 구현 문서 작성: [IMPL-2025-11-12] modal-select-layout-shift-fix.md

🤖 Generated with Claude Code

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

src/app/api/auth/check/route.ts

@@ -2,12 +2,28 @@ import { NextResponse } from 'next/server';
 import type { NextRequest } from 'next/server';
 
 /**
- * Auth Check Route Handler
+ * 🔵 Next.js 내부 API - 인증 상태 확인 (PHP 백엔드 X)
  *
- * Purpose:
- * - Check if user is authenticated (HttpOnly cookie validation)
- * - Prevent browser back button cache issues
- * - Real-time authentication validation
+ * ⚡ 설계 목적:
+ * - 성능 최적화: 매번 PHP 백엔드 호출 대신 로컬 쿠키만 확인
+ * - 백엔드 부하 감소: 간단한 인증 확인은 Next.js에서 처리
+ * - 사용자 경험: 즉시 응답으로 빠른 페이지 전환
+ *
+ * 📍 사용 위치:
+ * - LoginPage.tsx: 이미 로그인된 사용자를 대시보드로 리다이렉트
+ * - SignupPage.tsx: 이미 로그인된 사용자를 대시보드로 리다이렉트
+ * - 뒤로가기 시 캐시 문제 방지
+ *
+ * 🔄 동작 방식:
+ * 1. HttpOnly 쿠키에서 access_token, refresh_token 확인
+ * 2. access_token 있음 → { authenticated: true } 즉시 응답
+ * 3. refresh_token만 있음 → PHP /api/v1/refresh 호출하여 토큰 갱신
+ * 4. 둘 다 없음 → { authenticated: false } 응답
+ *
+ * ⚠️ 주의:
+ * - 이 API는 PHP 백엔드에 존재하지 않습니다
+ * - Next.js 프론트엔드 자체 유틸리티 API입니다
+ * - 실제 인증 로직은 여전히 PHP 백엔드가 담당합니다
  */
 export async function GET(request: NextRequest) {
   try {
@@ -18,7 +34,7 @@ export async function GET(request: NextRequest) {
     // No tokens at all - not authenticated
     if (!accessToken && !refreshToken) {
       return NextResponse.json(
-        { error: 'Not authenticated', authenticated: false },
+        { error: 'Not authenticated' },
         { status: 401 }
       );
     }
@@ -34,6 +50,8 @@ export async function GET(request: NextRequest) {
     // Only has refresh token - try to refresh
     if (refreshToken && !accessToken) {
       console.log('🔄 Access token missing, attempting refresh...');
+      console.log('🔍 Refresh token exists:', refreshToken.substring(0, 20) + '...');
+      console.log('🔍 Backend URL:', process.env.NEXT_PUBLIC_API_URL);
 
       // Attempt token refresh
       try {
@@ -42,11 +60,15 @@ export async function GET(request: NextRequest) {
           headers: {
             'Content-Type': 'application/json',
             'Accept': 'application/json',
-            'Authorization': `Bearer ${refreshToken}`,
             'X-API-KEY': process.env.NEXT_PUBLIC_API_KEY || '',
           },
+          body: JSON.stringify({
+            refresh_token: refreshToken,
+          }),
         });
 
+        console.log('🔍 Refresh API response status:', refreshResponse.status);
+
         if (refreshResponse.ok) {
           const data = await refreshResponse.json();
 
@@ -80,21 +102,25 @@ export async function GET(request: NextRequest) {
           response.headers.append('Set-Cookie', refreshTokenCookie);
 
           return response;
+        } else {
+          const errorData = await refreshResponse.text();
+          console.error('❌ Refresh API failed:', refreshResponse.status, errorData);
         }
       } catch (error) {
-        console.error('Token refresh failed in auth check:', error);
+        console.error('❌ Token refresh failed in auth check:', error);
       }
 
       // Refresh failed - not authenticated
+      console.log('⚠️ Returning 401 due to refresh failure');
       return NextResponse.json(
-        { error: 'Token refresh failed', authenticated: false },
+        { error: 'Token refresh failed' },
         { status: 401 }
       );
     }
 
     // Fallback - not authenticated
     return NextResponse.json(
-      { error: 'Not authenticated', authenticated: false },
+      { error: 'Not authenticated' },
       { status: 401 }
     );
 

src/app/api/auth/login/route.ts

@@ -1,6 +1,32 @@
 import { NextResponse } from 'next/server';
 import type { NextRequest } from 'next/server';
 
+/**
+ * 🔵 Next.js 내부 API - 로그인 프록시 (PHP 백엔드로 전달)
+ *
+ * ⚡ 설계 목적:
+ * - 보안: HttpOnly 쿠키로 토큰 저장 (JavaScript 접근 불가)
+ * - 프록시 패턴: PHP 백엔드 API 호출 후 토큰을 안전하게 쿠키로 설정
+ * - 클라이언트 보호: 토큰을 절대 클라이언트 JavaScript에 노출하지 않음
+ *
+ * 🔄 동작 흐름:
+ * 1. 클라이언트 → Next.js /api/auth/login (user_id, user_pwd)
+ * 2. Next.js → PHP /api/v1/login (인증 요청)
+ * 3. PHP → Next.js (access_token, refresh_token, 사용자 정보)
+ * 4. Next.js: 토큰을 HttpOnly 쿠키로 설정
+ * 5. Next.js → 클라이언트 (토큰 제외한 사용자 정보만 전달)
+ *
+ * 🔐 보안 특징:
+ * - 토큰은 클라이언트에 절대 노출되지 않음
+ * - HttpOnly: XSS 공격 방지
+ * - Secure: HTTPS만 전송
+ * - SameSite=Strict: CSRF 공격 방지
+ *
+ * ⚠️ 주의:
+ * - 이 API는 PHP /api/v1/login의 프록시입니다
+ * - 실제 인증 로직은 PHP 백엔드에서 처리됩니다
+ */
+
 /**
  * 백엔드 API 로그인 응답 타입
  */
@@ -23,7 +49,7 @@ interface BackendLoginResponse {
     company_name: string;
     business_num: string;
     tenant_st_code: string;
-    other_tenants: any[];
+    other_tenants: unknown[];
   };
   menus: Array<{
     id: number;

src/app/api/auth/logout/route.ts

@@ -2,12 +2,28 @@ import { NextResponse } from 'next/server';
 import type { NextRequest } from 'next/server';
 
 /**
- * Logout Proxy Route Handler
+ * 🔵 Next.js 내부 API - 로그아웃 프록시 (PHP 백엔드로 전달)
  *
- * Purpose:
- * - Call PHP backend logout API
- * - Clear HttpOnly cookie
- * - Ensure complete session cleanup
+ * ⚡ 설계 목적:
+ * - 완전한 로그아웃: PHP 백엔드 토큰 무효화 + 쿠키 삭제
+ * - 보안: HttpOnly 쿠키에서 토큰을 읽어 백엔드로 전달
+ * - 세션 정리: 클라이언트와 서버 양쪽 모두 세션 종료
+ *
+ * 🔄 동작 흐름:
+ * 1. 클라이언트 → Next.js /api/auth/logout
+ * 2. Next.js: HttpOnly 쿠키에서 access_token 읽기
+ * 3. Next.js → PHP /api/v1/logout (토큰 무효화 요청)
+ * 4. Next.js: access_token, refresh_token 쿠키 삭제
+ * 5. Next.js → 클라이언트 (로그아웃 성공 응답)
+ *
+ * 🔐 보안 특징:
+ * - 백엔드에서 토큰 블랙리스트 처리 (재사용 방지)
+ * - 쿠키 완전 삭제 (Max-Age=0)
+ * - 로그아웃 실패해도 쿠키는 삭제 (클라이언트 보호)
+ *
+ * ⚠️ 주의:
+ * - 이 API는 PHP /api/v1/logout의 프록시입니다
+ * - 백엔드 호출 실패해도 쿠키는 삭제됩니다 (안전 우선)
  */
 export async function POST(request: NextRequest) {
   try {

src/app/api/auth/refresh/route.ts

@@ -2,12 +2,34 @@ import { NextResponse } from 'next/server';
 import type { NextRequest } from 'next/server';
 
 /**
- * Token Refresh Route Handler
+ * 🔵 Next.js 내부 API - 토큰 갱신 프록시 (PHP 백엔드로 전달)
  *
- * Purpose:
- * - Refresh expired access_token using refresh_token
- * - Update HttpOnly cookies with new tokens
- * - Maintain user session without re-login
+ * ⚡ 설계 목적:
+ * - 자동 토큰 갱신: access_token 만료 시 재로그인 없이 세션 유지
+ * - 보안: refresh_token을 HttpOnly 쿠키에서 읽어 백엔드로 전달
+ * - 사용자 경험: 끊김없는 사용 (2시간마다 자동 갱신)
+ *
+ * 🔄 동작 흐름:
+ * 1. 클라이언트 → Next.js /api/auth/refresh
+ * 2. Next.js: HttpOnly 쿠키에서 refresh_token 읽기
+ * 3. Next.js → PHP /api/v1/refresh (새 토큰 요청)
+ * 4. PHP → Next.js (새 access_token, refresh_token)
+ * 5. Next.js: 새 토큰을 HttpOnly 쿠키로 업데이트
+ * 6. Next.js → 클라이언트 (갱신 성공 응답)
+ *
+ * 📍 호출 시점:
+ * - /api/auth/check에서 access_token 없을 때 자동 호출
+ * - API 호출 시 401 응답 받을 때 (withTokenRefresh 헬퍼)
+ * - 미들웨어에서 토큰 만료 감지 시
+ *
+ * 🔐 보안 특징:
+ * - Token Rotation: 갱신 시 새로운 refresh_token도 발급
+ * - HttpOnly: 토큰이 JavaScript에 노출되지 않음
+ * - 자동 만료: access_token 2시간, refresh_token 7일
+ *
+ * ⚠️ 주의:
+ * - 이 API는 PHP /api/v1/refresh의 프록시입니다
+ * - refresh_token 만료 시 재로그인 필요 (401 응답)
  */
 export async function POST(request: NextRequest) {
   try {
@@ -27,9 +49,11 @@ export async function POST(request: NextRequest) {
       headers: {
         'Content-Type': 'application/json',
         'Accept': 'application/json',
-        'Authorization': `Bearer ${refreshToken}`,
         'X-API-KEY': process.env.NEXT_PUBLIC_API_KEY || '',
       },
+      body: JSON.stringify({
+        refresh_token: refreshToken,
+      }),
     });
 
     if (!response.ok) {

src/app/api/auth/signup/route.ts

@@ -2,12 +2,34 @@ import { NextResponse } from 'next/server';
 import type { NextRequest } from 'next/server';
 
 /**
- * Signup Proxy Route Handler
+ * 🔵 Next.js 내부 API - 회원가입 프록시 (PHP 백엔드로 전달)
  *
- * Purpose:
- * - Proxy signup requests to PHP backend
- * - Handle registration errors gracefully
- * - Return user-friendly error messages
+ * ⚡ 설계 목적:
+ * - 입력 검증: 클라이언트에서 받은 데이터 유효성 확인
+ * - 에러 처리: 백엔드 에러를 사용자 친화적인 메시지로 변환
+ * - 보안: 백엔드 상세 에러 메시지 노출 방지
+ *
+ * 🔄 동작 흐름:
+ * 1. 클라이언트 → Next.js /api/auth/signup (회원가입 정보)
+ * 2. Next.js: 필수 필드 유효성 검증
+ * 3. Next.js → PHP /api/v1/register (회원가입 요청)
+ * 4. PHP → Next.js (성공/실패 응답)
+ * 5. Next.js → 클라이언트 (사용자 친화적 메시지)
+ *
+ * 📋 필수 필드:
+ * - user_id, name, email, phone
+ * - password, password_confirmation
+ * - company_name, business_num, company_scale, industry
+ * - position (선택)
+ *
+ * 🔐 보안 특징:
+ * - 백엔드 상세 에러 숨김 (정보 유출 방지)
+ * - 일반화된 에러 메시지 제공
+ * - 입력 데이터 사전 검증
+ *
+ * ⚠️ 주의:
+ * - 이 API는 PHP /api/v1/register의 프록시입니다
+ * - 회원가입 시 토큰은 발급하지 않음 (로그인 페이지로 리다이렉트)
  */
 export async function POST(request: NextRequest) {
   try {