import '../css/app.css'
import './bootstrap.js'
import { createApp, h } from 'vue'
import { createInertiaApp } from '@inertiajs/vue3'
import { InertiaProgress } from '@inertiajs/progress'
import Vue3Toastify, { toast } from 'vue3-toastify'
import 'vue3-toastify/dist/index.css'

import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import {
    faUser, faTrash, faCheck, faGear, faHouse,
    faMoneyBillWave, faFolder, faEnvelope, faArrowUpRightFromSquare,
    faStar, faClock, faCircleQuestion, faSliders,
    faBell, faMagnifyingGlass,
    faGraduationCap, faFileInvoice, faHeart, faCertificate,
    faChevronRight, faChevronLeft, faArrowRightFromBracket, faCube,
    faTriangleExclamation, faPlus, faFilePdf, faDownload,
} from '@fortawesome/free-solid-svg-icons'

library.add(
    faUser, faTrash, faCheck, faGear, faHouse,
    faMoneyBillWave, faFolder, faEnvelope, faArrowUpRightFromSquare,
    faStar, faClock, faCircleQuestion, faSliders,
    faBell, faMagnifyingGlass,
    faGraduationCap, faFileInvoice, faHeart, faCertificate,
    faChevronRight, faChevronLeft, faArrowRightFromBracket, faCube,
    faTriangleExclamation, faPlus, faFilePdf, faDownload,
)

InertiaProgress.init()

createInertiaApp({
    resolve: name => {
        const pages = import.meta.glob('@domains/**/*.vue')

        const key = Object.keys(pages).find(k =>
            k.endsWith(`/${name}.vue`) || k.endsWith(`/${name}/index.vue`)
        )

        if (!key) throw new Error(`Page not found: ${name}`)

        return pages[key]()
    },

    setup({ el, App, props, plugin }) {
        const vueApp = createApp({ render: () => h(App, props) })

        vueApp.use(plugin)
        vueApp.component('font-awesome-icon', FontAwesomeIcon)

        vueApp.use(Vue3Toastify, {
            autoClose: 10000,
            position: 'bottom-right',
            pauseOnHover: true,
            hideProgressBar: false,
            toastDefaults: {
                success: {
                    style: { background: '#4caf50', color: '#fff' },
                    progressStyle: { background: '#2e7d32', height: '4px' },
                },
                error: {
                    style: { background: '#f44336', color: '#fff' },
                    progressStyle: { background: '#c62828', height: '4px' },
                },
            },
        })

        vueApp.config.globalProperties.$toast = toast
        vueApp.mount(el)
    },
})