import { createI18n } from 'vue-i18n';
import yaml from 'js-yaml';

export const lang = [];

const systemLocale = navigator.language || 'en-US';
const savedLang = localStorage.getItem('lang');

const messages = {};
const modules = import.meta.glob('src/assets/lang/*.yaml', {
  eager: true,
  import: 'default',
  query: '?raw',
});

for (const path in modules) {
  const raw = modules[path];
  const parsed = yaml.load(raw);

  // Extract the file name (e.g., "en.yaml" → "en")
  const locale = path.split('/').pop().replace('.yaml', '');

  lang.push(locale);
  messages[locale] = parsed;
}

function resolveLocale(desiredLocale) {
  if (messages[desiredLocale]) return desiredLocale;

  const baseLang = desiredLocale.split('-')[0];
  // exact base match (e.g. en)
  if (messages[baseLang]) return baseLang;

  // first locale starting with that base (e.g. en-US, en-GB)
  const partialMatch = Object.keys(messages).find((l) => l.startsWith(baseLang));
  if (partialMatch) return partialMatch;

  // fallback to English or the first available
  return messages['en'] ? 'en' : Object.keys(messages)[0];
}

const selectedLocale = resolveLocale(savedLang || systemLocale);

const i18n = createI18n({
  legacy: false, // Composition API mode
  locale: selectedLocale,
  fallbackLocale: resolveLocale(selectedLocale),
  messages,
});

export default ({ app }) => {
  app.use(i18n);
};

export { i18n };