import {createApp} from 'vue'
import App from './App.vue'
import './style.css'
import {VueTelegramPlugin} from 'vue-tg';
import {router} from './router';
import {createPinia} from 'pinia';

import {useCategoriesStore} from "@/stores/CategoriesStore.js";
import {useSettingsStore} from "@/stores/SettingsStore.js";
import ApplicationError from "@/ApplicationError.vue";
import AppMetaInitializer from "@/utils/AppMetaInitializer.ts";
import {injectYaMetrika} from "@/utils/yaMetrika.js";

import { register } from 'swiper/element/bundle';
import 'swiper/element/bundle';
import 'swiper/css/bundle';
import AppLoading from "@/AppLoading.vue";
import {useProductFiltersStore} from "@/stores/ProductFiltersStore.js";
register();

const pinia = createPinia();
const app = createApp(App);
app
    .use(pinia)
    .use(router)
    .use(VueTelegramPlugin);

const settings = useSettingsStore();

const appLoading = createApp(AppLoading);
appLoading.mount('#app');

settings.load()
    .then(async () => {
        console.debug('Load default filters for the main page');
        const filtersStore = useProductFiltersStore();
        filtersStore.applied = await filtersStore.fetchFiltersForMainPage();
    })
    .then(() => {
        if (settings.app_enabled === false) {
            throw new Error('App disabled (maintenance mode)');
        }
    })
    .then(() => {
        console.log('Set theme attributes');
        document.documentElement.setAttribute('data-theme', settings.theme[window.Telegram.WebApp.colorScheme]);
        if (settings.night_auto) {
            window.Telegram.WebApp.onEvent('themeChanged', function () {
                document.documentElement.setAttribute('data-theme', settings.theme[this.colorScheme]);
            });
        }

        for (const key in settings.theme.variables) {
            document.documentElement.style.setProperty(key, settings.theme.variables[key]);
        }
    })
    .then(() => {
        console.log('Load front page categories and products.');
        const categoriesStore = useCategoriesStore();
        categoriesStore.fetchTopCategories();
    })
    .then(() => new AppMetaInitializer(settings).init())
    .then(() => { appLoading.unmount(); app.mount('#app'); })
    .then(() => window.Telegram.WebApp.ready())
    .then(() => settings.ya_metrika_enabled && injectYaMetrika())
    .then(() => window.Telegram.WebApp.lockOrientation())
    .catch(error => {
        console.error(error);
        const errorApp = createApp(ApplicationError, {error});
        errorApp.mount('#app-error');
    });