import { createApp } from "vue";
import { createPinia } from "pinia";
import App from "./App.vue";
import { router } from "../router";
import { useGlobalErrorHandler } from "../composables/useGlobalErrorHandler";
import { useAuthStore } from "../stores/auth.js";
import { setAccessToken } from "../api/auth.js";
import "@phosphor-icons/web/regular";
import "@phosphor-icons/web/fill";
import "../styles/main.css";

const app = createApp(App);

useGlobalErrorHandler(app);

const pinia = createPinia();
app.use(pinia).use(router);

// Handle OAuth callback token before auth init so /auth/me can use it
const urlParams = new URLSearchParams(window.location.search);
const tokenFromUrl = urlParams.get("access_token");
if (tokenFromUrl) {
  setAccessToken(tokenFromUrl);
  // Clean token from URL without reload
  const cleanUrl = window.location.pathname + window.location.hash;
  window.history.replaceState({}, "", cleanUrl);
}

// Initialize auth before mounting so router guards have valid state
const authStore = useAuthStore();
authStore.init().finally(() => {
  app.mount("#app");
});