import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router'
import './styles/main.css'
import { isTauri } from './lib/tauri'

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

app.use(pinia)
app.use(router)

// Exponer contexto global para componentes dinámicos
;(window as any).__vueApp = app
;(window as any).__pinia = pinia

async function bootstrap() {
  // In Tauri mode, load server config before anything else
  if (isTauri) {
    const { useServerConfig } = await import('./stores/server-config')
    const serverConfig = useServerConfig(pinia)
    await serverConfig.loadConfig()
  }

  // Inicializar tema antes de montar la app
  const { useThemeStore } = await import('./stores/theme')
  const themeStore = useThemeStore(pinia)
  await themeStore.fetchThemes().catch(() => {
    // In Tauri without server configured, themes will fail — mount anyway
    console.warn('[Main] Failed to fetch themes, mounting app anyway')
  })

  app.mount('#app')
}

bootstrap()
