// app.ts
// L’ordre est important
import 'bootstrap/dist/css/bootstrap.css';              // Est déjà compilé. On ne peut plus overrider des variables de Bootstrap.
import '../scss/app.scss';                              // Tes variables, overrides et composants hors Bootstrap.
import 'bootstrap-icons/font/bootstrap-icons.css';
import 'bootstrap';                                     // JS de Bootstrap

import { createInertiaApp } from '@inertiajs/vue3';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { createApp, DefineComponent, h } from 'vue';
import { createHead } from '@vueuse/head';
import { ZiggyVue } from '../../vendor/tightenco/ziggy';
import { createI18n } from 'vue-i18n'

const appName = import.meta.env.VITE_APP_NAME || 'amedya';
const head = createHead();  // Pour gérer les titres des pages.

import fr from './lang/fr';
import en from './lang/en';

const i18n = createI18n({
  legacy: false,
  locale: localStorage.getItem('lang') || 'fr-FR', 
  fallbackLocale: 'fr-FR',                        
  messages: {
    'fr-FR': fr,
    'en-US': en,
  },
});

createInertiaApp({
  title: (title) => `${title}`,
  resolve: (name) =>
    resolvePageComponent(
      `./pages/${name}.vue`,
      import.meta.glob<DefineComponent>('./pages/**/*.vue'),
    ),
  setup({ el, App, props, plugin }) {
    createApp({ render: () => h(App, props) })
      .use(plugin)
      // On passe les routes reçues via les props
      .use(ZiggyVue, props.initialPage.props.ziggy as any)
      .use(head)
      .use(i18n)
      .mount(el);
  },
  progress: {
    color: '#6b7280',
  },
});