import { useEffect } from 'react';

import { useParams } from 'react-router';

import { loadAndChangeLanguage, resolveLang } from '@/i18n/frameworkI18n';
import BasicLayout from '@/layouts/BasicLayout';

/**
 * 语言布局路由（/:lang 段）。
 *
 * SSG / 首屏 hydrate 时，i18n 固定为默认语言（en-US，见 frameworkI18n），保证首屏 HTML 与
 * 客户端首次渲染一致，避免 hydration mismatch。hydrate 完成后，此处的 effect 依据 URL 的
 * :lang 段按需加载并切换到目标语言（其它语言懒加载）。
 *
 * 因此非默认语言用户会经历“默认语言首屏 → 切换到本地语言”的短暂过程，这是纯静态预渲染 +
 * 路径前缀方案下 hydration 一致性的必然取舍；当前仅启用 en-US，实际不会发生切换。
 */
export default function LangLayout() {
    const { lang } = useParams();

    useEffect(() => {
        const target = resolveLang(lang);
        loadAndChangeLanguage(target);
    }, [lang]);

    return <BasicLayout />;
}
