/* =============================================================================
 * main.ts
 * 프론트엔드 애플리케이션 진입점
 *
 * - 공통 컴포넌트/셸 스타일 주입
 * - 테마/언어 복원
 * - 앱 셸(헤더/푸터) 렌더 후 라우터 시작
 * - hashchange 1회 구독: 셸 chrome 갱신 + 현재 라우트 렌더
 * ========================================================================== */

import { injectBaseStyles } from "@ui/ui_template_elements";
import { initThemeAndLang, injectShellStyles, renderShell } from "./app_shell";
import { renderCurrentRoute, ensureInitialHash } from "./router";

function bootstrap(): void {
  const appRoot = document.getElementById("app");
  if (!appRoot) {
    throw new Error("[main] #app 루트 요소를 찾을 수 없습니다.");
  }

  // 1. 스타일 주입 (공통 컴포넌트 + 셸)
  injectBaseStyles();
  injectShellStyles();

  // 2. 테마/언어 복원
  initThemeAndLang();

  // 3. 셸 렌더 + 현재 라우트 렌더를 함께 수행하는 헬퍼
  const renderAll = (): void => {
    const outlet = renderShell(appRoot); // 헤더/푸터(로그인·언어 반영) 갱신
    void renderCurrentRoute(outlet); // 아울렛에 페이지 렌더
  };

  // 4. hashchange 1회 구독 (리스너 누적 방지)
  window.addEventListener("hashchange", renderAll);

  // 5. 최초 진입
  ensureInitialHash();
  renderAll();
}

bootstrap();