import { createI18n } from 'vue-i18n';

import { localST_Locale } from './base/storage';

import { LANGUAGE_ENGLISH, LANGUAGE_CHINESE } from './base/variables';

import { useLocaleStore } from './base/store/use-locale';

import ajax from './base/ajax';

/**
 * 多语言解决方案
 * @see https://vue-i18n.intlify.dev/
 *
 * 此项目中的多语言配置有如下几处：
 * 位置1. public/i18n/lang-*.json
 * 位置2. src/modules/answer-refference/i18n-message/*.json
 *
 * 位置 1 是项目整体的多语言配置，项目中主要的多语言皆在此配置
 * 位置 2 是对话过程中，针对智能体的回答内容部分，有些是动态生成的组件
 *    例如：pdf预览，下载链接的展示，文档引用的展示等场景，其中多语言内容是 复制 于位置1中的配置项，是重复项
 *          使用复制而非像主APP一样动态加载的原因是：多语言配置项较少，且组件是动态创建，在动态创建时加载多语言会造成资源浪费
 */

let i18n = null;

// 创建一个函数来加载语言文件
async function loadLocaleMessages() {
  const messages = {};
  const locales = [LANGUAGE_ENGLISH, LANGUAGE_CHINESE]; // 根据你的需求添加语言代码

  for (const locale of locales) {
    const url = `/i18n/lang-${locale}.json`;
    const response = await ajax.get(url);
    messages[locale] = response;
  }

  return messages;
}

/**
 * 检查一个字符串是否是合法的语言名称
 * @param {string} lang
 * @returns
 */
function isValidLanguage(lang) {
  return lang === LANGUAGE_ENGLISH || lang === LANGUAGE_CHINESE;
}

/**
 * 设置当前的语言
 * @param {string} locale - en/zh
 */
export function setI18nLanguage(locale) {
  const is_valid = isValidLanguage(locale);

  if (!is_valid) {
    return;
  }

  if (!i18n) {
    return;
  }

  i18n.global.locale = locale;

  localST_Locale.setItem(locale);

  /**
   * NOTE:
   * If you need to specify the language setting for headers, such as the `fetch` API, set it here.
   * The following is an example for axios.
   *
   * axios.defaults.headers.common['Accept-Language'] = locale
   */
  document.querySelector('html').setAttribute('lang', locale);

  const store = useLocaleStore();
  store.updateLanguage(locale);
}

export async function setupI18n() {
  const messages = await loadLocaleMessages();

  i18n = createI18n({
    locale: LANGUAGE_CHINESE,
    fallbackLocale: LANGUAGE_ENGLISH,
    messages
  });

  return i18n;
}