import { createApp } from "vue";
import { createPinia } from "pinia";
import App from "./App.vue";
import router from "./router";
import i18n, { initI18n } from "./i18n";
import { useAppStore } from "@/stores/app";
import { installWebRum } from "@/utils/rum";
import "./style.css";
import "./styles/workbench.css";

function initThemeClass(): void {
  const savedTheme = localStorage.getItem("theme");
  const shouldUseDark = savedTheme === "dark" || (!savedTheme && window.matchMedia("(prefers-color-scheme: dark)").matches);
  document.documentElement.classList.toggle("dark", shouldUseDark);
}

async function bootstrap(): Promise<void> {
  initThemeClass();
  const app = createApp(App);
  const pinia = createPinia();
  app.use(pinia);
  useAppStore().initFromInjectedConfig();
  await initI18n();
  app.use(router);
  app.use(i18n);
  await router.isReady();
  installWebRum();
  app.mount("#app");
}

void bootstrap();
