import {createBrowserRouter, Navigate} from 'react-router';
import {BuilderPage} from '@/pages/BuilderPage';
import {DevShowcasePage} from '@/pages/DevShowcasePage';
import {LoginPage} from '@/pages/LoginPage';
import {NotFoundPage} from '@/pages/NotFoundPage';

export const router = createBrowserRouter([
  {path: '/login', element: <LoginPage />},

  // ★ 첫 화면은 업종 선택(위저드 1단계)이다.
  //   `?new=1` 을 붙이는 이유: 위저드 상태는 새로고침을 넘기려고 저장돼 있어서(stores/builder persist),
  //   그냥 /builder 로 보내면 지난번에 만들다 만 **에디터**가 복원돼 뜬다. 처음 들어오는 사람에게는
  //   그게 "왜 자꾸 빌더로 튀냐"로 보인다. 그래서 진입 경로에서 한 번 비우고 시작한다.
  {path: '/', element: <Navigate to="/builder?new=1" replace />},

  /**
   * 빌더는 로그인 화면을 앞에 세우지 않는다 — 위저드를 열자마자 로그인부터 만나면
   * 만들어 보기도 전에 막힌다.
   *
   * 대신 세션은 조용히 확보한다 — VITE_AUTO_LOGIN_ID·PW 가 주입돼 있으면 useAutoLogin() 이
   * 그 계정으로 붙고, 없으면 서버가 필요한 순간(2단계 검색)에만 알린다.
   *
   * 에디터(6단계)는 전체 화면이 필요해 AppShell 을 스스로 끄고 켠다 — BuilderPage 참조.
   */
  {path: '/builder', element: <BuilderPage />},

  /**
   * ★ 내부 운영 화면(/places, /local-content, /seo)은 여기 없다 — 최상단 `admin/` 앱으로 나갔다.
   *   라우트 가드는 화면을 가리지 **번들은 못 가린다**: 한 앱이면 내부 라우트 이름과 코드가
   *   사장님 브라우저에 그대로 내려간다. `UserRole.DEVELOPER` 주석의
   *   "고객사에 존재를 노출하지 않는다"를 지키려면 번들 자체가 갈라져야 한다.
   *   (ARCHITECTURE.md 4절)
   */

  // 개발 빌드에서만 열리는 컴포넌트 쇼케이스. 운영 번들에서는 라우트 자체가 없다.
  ...(import.meta.env.DEV ? [{path: '/dev/showcase', element: <DevShowcasePage />}] : []),

  {path: '*', element: <NotFoundPage />},
]);