import { createApp } from 'vue';
import { createPinia } from 'pinia';
import { createI18n } from 'vue-i18n';
import App from './App.vue';
import router from './router/index.ts';
import './styles.css';
import {
  loadLocaleMessages,
  markLocaleLoaded,
  readStoredLocale,
  type PlayerLocale,
} from './i18n/index.ts';

async function bootstrap() {
  const initialLocale = readStoredLocale();
  const initialMessages = await loadLocaleMessages(initialLocale);

const i18n = createI18n({
  legacy: false,
    locale: initialLocale,
  fallbackLocale: ['en-US', 'zh-CN'],
  messages: {
      [initialLocale]: initialMessages as Record<string, string>,
  },
});

  markLocaleLoaded(initialLocale);

createApp(App).use(createPinia()).use(router).use(i18n).mount('#app');

const loader = document.getElementById('app-loading');
if (loader) {
  loader.style.opacity = '0';
  loader.style.transition = 'opacity 0.3s ease';
  setTimeout(() => loader.remove(), 350);
}
}

bootstrap();