import { createApp } from 'vue';
import App from './App.vue';
import router from '@/router/router.js';
import { createPinia } from 'pinia';
import 'vuetify/styles';
import { createVuetify } from 'vuetify';
import { aliases, mdi } from 'vuetify/iconsets/mdi-svg';
import {
    VAlert,
    VApp,
    VBtn,
    VDialog,
    VForm,
    VIcon,
    VProgressCircular,
    VProgressLinear,
    VSelect,
    VSnackbar,
    VTextarea,
    VTextField,
} from 'vuetify/components';
import vueGoogleOauth from 'vue3-google-login';
import { useAuthStore } from '@/features/auth/stores/authStore.js';
import { useUserProfileStore } from '@/features/user-profile/stores/userProfileStore.js';
import Toast, { POSITION } from 'vue-toastification';
import 'vue-toastification/dist/index.css';
import './assets/main.css';
import { useWorkspaceStore } from '@/features/workspaces/stores/workspaceStore.js';
import { useReviewQueueStore } from '@/features/reviews/stores/reviewQueueStore.js';
import { useContentItemsStore } from '@/features/content/stores/contentItemsStore.js';
import { useClientsStore } from '@/features/clients/stores/clientsStore.js';
import { useCampaignsStore } from '@/features/campaigns/stores/campaignsStore.js';
import { useNotificationsStore } from '@/features/notifications/stores/notificationsStore.js';
import { useChannelsStore } from '@/features/channels/stores/channelsStore.js';
import { i18n } from '@/plugins/i18n.js';
import config from '@/config.js';
import { createHead } from '@vueuse/head';

const vuetify = createVuetify({
    components: {
        VDialog,
        VApp,
        VBtn,
        VProgressLinear,
        VProgressCircular,
        VIcon,
        VSelect,
        VTextField,
        VSnackbar,
        VForm,
        VTextarea,
        VAlert,
    },
    directives: {},
    icons: {
        defaultSet: 'mdi',
        aliases,
        sets: { mdi },
    },
    theme: {
        defaultTheme: 'socializeLight',
        themes: {
            socializeLight: {
                dark: false,
                colors: {
                    background: '#f4f6f3',
                    surface: '#fbfaf6',
                    primary: '#172033',
                    secondary: '#fff3e2',
                    accent: '#ff8a3d',
                    error: '#bc2f2f',
                    info: '#2563eb',
                    success: '#2fa58d',
                    warning: '#b45309',
                },
            },
        },
    },
});

const pinia = createPinia();
const head = createHead();

const app = createApp(App)
    .use(pinia)
    .use(head)
    .use(vuetify)
    .use(router)
    .use(i18n)
    .use(vueGoogleOauth, {
        clientId: config.googleClientId,
    })
    .use(Toast, {
        position: POSITION.TOP_CENTER,
    });

useAuthStore();
useUserProfileStore();
useWorkspaceStore();
useClientsStore();
useCampaignsStore();
useChannelsStore();
useReviewQueueStore();
useContentItemsStore();
useNotificationsStore();

app.mount('#app');