import { createApp, defineAsyncComponent } from "vue";
import App from "./App.vue";
import router from "./router";
import { Dialog, Notify, Quasar, Loading } from "quasar";
import "./quasar-user-options";

import qDraggableTable from "quasar-ui-q-draggable-table";
import "quasar-ui-q-draggable-table/dist/index.css";

import "quasar/src/css/index.sass";
import th from "quasar/lang/th";

import "@vuepic/vue-datepicker/dist/main.css";
import http from "./plugins/http";
import { createPinia } from "pinia";

import CodeDiff from "v-code-diff";
import json from "highlight.js/lib/languages/json";

CodeDiff.hljs.registerLanguage("json", json);
// organization
// position
// positionEmployee
//calendar
// insignia

// import './assets/main.css'

// Import GlobalFilters
import filters from "./plugins/filters";

const app = createApp(App);
const pinia = createPinia();

// เพิ่ม Global Filters ลงใน App
app.config.globalProperties.$filters = filters;

app.use(CodeDiff);
app.use(router);
app.use(pinia);
app.use(qDraggableTable);

app.use(
  Quasar,
  {
    plugins: {
      Notify,
      Dialog,
      Loading,
    }, // import Quasar plugins and add here
    config: {
      notify: {
        /* look at QuasarConfOptions from the API card */
      },
      loading: {
        /* look at QuasarConfOptions from the API card */
      },
    },
    lang: th,
  }
  //   quasarUserOptions // build ไม่ผ่านหลัง install code org&structure chart เลยต้องคอมเม้นไว้ก่อน เทสแล้วยังรันได้หลังคอมเม้น
);

//** Global Components */
app.component(
  "data-table",
  defineAsyncComponent(() => import("@/components/TableView.vue"))
);
app.component(
  "datepicker",
  defineAsyncComponent(() => import("@vuepic/vue-datepicker"))
);
app.component(
  "full-loader",
  defineAsyncComponent(() => import("@/components/FullLoader.vue"))
);

app.component(
  "selector",
  defineAsyncComponent(() => import("@/components/Selector.vue"))
);

app.component(
  "d-table",
  defineAsyncComponent(() => import("@/components/Table.vue"))
);

app.config.globalProperties.$http = http;

// authen with keycloak client
// function getCookie(name: string) {
//   const nameEQ = name + "=";
//   const ca = document.cookie.split(";");
//   for (let i = 0; i < ca.length; i++) {
//     let c = ca[i];
//     while (c.charAt(0) == " ") c = c.substring(1, c.length);
//     if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
//   }
//   return null;
// }

// const auth = await getToken();

// if (auth.token && auth.refresh_token) {
//   keycloak.init({
//     checkLoginIframe: false,
//     token: auth.token,
//     refreshToken: auth.refresh_token,
//   });
// }

app.mount("#app");