import '@/lib/bootstrap'
import { createApp, h } from 'vue';
import {createInertiaApp, usePage} from '@inertiajs/vue3';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { ZiggyVue } from '../../vendor/tightenco/ziggy';
import { initializeApp } from 'firebase/app';
import { getAnalytics } from 'firebase/analytics';
import { createPinia } from "pinia";
import VueApexCharts from 'vue3-apexcharts'

import 'preline/preline'
import 'lucide'
import 'swiper/css/effect-coverflow'
import 'swiper/css/thumbs'
import 'swiper/css/autoplay'
import 'swiper/css/scrollbar'
import 'swiper/css/mousewheel'
import 'swiper/css/effect-fade'
import 'swiper/css/navigation'
import 'swiper/css/pagination'
import 'swiper/css'
import '@aero-page/app.css';
import '@aero-page/assets/css/icons.css'
import '@aero-page/assets/css/style.css'

// bootstrap
window.axios = axios;
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

// Firebase configuration
const firebaseConfig = {
    apiKey: import.meta.env.VITE_FIREBASE_API_KEY ?? null,
    authDomain: import.meta.env.VITE_FIREBASE_AUTH_DOMAIN ?? null,
    projectId: import.meta.env.VITE_FIREBASE_PROJECT_ID ?? null,
    storageBucket: import.meta.env.VITE_FIREBASE_STORAGE_BUCKET ?? null,
    messagingSenderId: import.meta.env.VITE_FIREBASE_MESSAGING_SENDER_ID ?? null,
    appId: import.meta.env.VITE_FIREBASE_APP_ID ?? null,
    measurementId: import.meta.env.VITE_FIREBASE_MEASUREMENT_ID ?? null
};

// Initialize Firebase
if(firebaseConfig.apiKey !== null && firebaseConfig.apiKey !== '') {
    const firebaseApp = initializeApp(firebaseConfig);
    const analytics = getAnalytics(firebaseApp);
}
createInertiaApp({
    title: () => usePage().props.pageName ? `${usePage().props.pageName} - ${usePage().props.siteName}` : usePage().props.siteName,
    resolve: (name) => resolvePageComponent(`./Pages/${name}.vue`, import.meta.glob('./**/**/**/*.vue')),
    setup({el, App, props, plugin}) {
        const app = createApp({render: () => h(App, props)})
        app.use(plugin)
            .use(createPinia())
            .use(VueApexCharts)
            .use(ZiggyVue)

        return app.mount(el);
    },
    progress: {
        color: '#4B5563',
    },
}).then(r => { console.log(r); });