import { createApp } from 'vue'
import App from './App.vue'
import { createAdminRouter } from './app/router'
import { onUnauthorized } from './api/client'
import { loadFieldTypes } from './app/fieldTypes'
import { loadStrings } from './app/i18n'
import { applyColorScheme } from './app/theme'
import { expireSession, me } from './state/useAuth'
import { loadNavigation } from './state/useNavigation'
import { loadSettings } from './state/useSettings'
import './styles/main.css'

async function boot(): Promise<void> {
  // Dark mode follows the system preference before anything renders (A6).
  applyColorScheme()
  // Boot order (research Pattern 7): the public strings bundle first, so the
  // login screen is translated, then the session, then navigation and the
  // plugin field types.
  await loadStrings().catch(() => undefined)
  // A 401 here only means "not signed in"; the router guard sends the
  // visitor to the login route with the requested path as redirect.
  const user = await me().catch(() => null)
  if (user) {
    // Plugin field types load once per session: their scripts define the
    // elements any controller's form may use, their styles stay enabled.
    await Promise.all([loadNavigation().catch(() => []), loadSettings().catch(() => []), loadFieldTypes()])
  }
  const router = createAdminRouter()
  // A session that cannot be recovered ends here: the profile and every
  // stored list query are cleared before the login screen shows (T-16.1-03).
  onUnauthorized(() => expireSession(router))
  const app = createApp(App)
  app.use(router)
  await router.isReady()
  app.mount('#app')
}

void boot()