vexplor_dev/frontend/hooks/usePageMultiLang.ts

import { useState, useEffect, useCallback } from "react";
import { apiClient } from "@/lib/api/client";
import { useMultiLang } from "@/hooks/useMultiLang";
import { setTranslationCache } from "@/lib/utils/multilang";

interface UsePageMultiLangOptions {
  keys: readonly string[];
  defaults: Record<string, string>;
  menuCode: string;
}

/**
 * 페이지별 다국어 텍스트 관리 훅
 * - keys: 다국어 키 배열
 * - defaults: 한국어 기본 텍스트 매핑
 * - menuCode: 배치 API에 전달할 메뉴 코드
 */
export function usePageMultiLang({ keys, defaults, menuCode }: UsePageMultiLangOptions) {
  const { userLang } = useMultiLang();
  const [uiTexts, setUiTexts] = useState<Record<string, string>>(() => ({ ...defaults }));
  const [loading, setLoading] = useState(false);

  // 배치 번역 로드
  useEffect(() => {
    if (!userLang || loading) return;

    let cancelled = false;
    const load = async () => {
      setLoading(true);
      try {
        const response = await apiClient.post(
          "/multilang/batch",
          {
            langKeys: keys,
            companyCode: "*",
            menuCode,
            userLang,
          },
          { params: {} },
        );

        if (!cancelled && response.data.success && response.data.data) {
          const merged = { ...defaults, ...response.data.data };
          setUiTexts(merged);
          setTranslationCache(userLang, merged);
        }
      } catch {
        // API 실패 시 기본 텍스트 유지
      } finally {
        if (!cancelled) setLoading(false);
      }
    };

    load();
    return () => { cancelled = true; };
  }, [userLang]);

  // 동기 텍스트 조회 함수
  const t = useCallback(
    (key: string, params?: Record<string, string | number>): string => {
      let text = uiTexts[key] || defaults[key] || key;

      if (params) {
        Object.entries(params).forEach(([k, v]) => {
          text = text.replace(`{${k}}`, String(v));
        });
      }

      return text;
    },
    [uiTexts, defaults],
  );

  return { t, userLang, loading };
}