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