import { createApp } from "vue";
import { createPinia } from "pinia";
import { defaultConfig, plugin as formKitPlugin } from "@formkit/vue";
import PrimeVue from "primevue/config";
import ConfirmationService from "primevue/confirmationservice";
import ToastService from "primevue/toastservice";
import vue3GoogleLogin from "vue3-google-login";
import App from "./App.vue";
import router from "./router/router";
import i18n from "@/i18n";
import globalPlugins from "@/plugins/globalPlugins";
import Aura from "@primeuix/themes/aura";

import "@formkit/themes/genesis";
import "@/assets/css/index.scss";
import "@/assets/css/auth.scss";

import "./modules/common/apiConfig";

const app = createApp(App);

app.use(createPinia());
app.use(PrimeVue, {
  theme: {
    preset: Aura,
    options: {
      darkModeSelector: 'light',
    }
  },
});
app.use(ConfirmationService);
app.use(ToastService);
app.use(i18n);
app.use(router);
app.use(globalPlugins);
app.use(formKitPlugin, defaultConfig);

// app.directive('permission', {
//   mounted(el, binding) {
//     const store = usePermissionStore()

//     if (!store.has(binding.value)) {
//       el.remove()
//     }
//   }
// })


// Configure Google Login with your OAuth Client ID
// Replace 'YOUR_GOOGLE_CLIENT_ID' with your actual Google OAuth Client ID
app.use(vue3GoogleLogin, {
  clientId: import.meta.env.VITE_GOOGLE_CLIENT_ID || '470382599826-tac0m9qph19gj8u5bpt45cu9cjhvg5q2.apps.googleusercontent.com'
});

app.mount("#app");