import '@fontsource-variable/nunito-sans';
import './styles.css';
import { mountAccountMenu } from './account/account-menu';
import { getCurrentUser } from './account/auth';
import { startRouter } from './pages/router';
import { mountCardsPage } from './pages/cards-page';
import { mountResetPage } from './pages/reset-page';
import { mountEditor } from './editor/editor-page';
import { bindEditorToAuth } from './editor/auth-reset';
import { createStore, initialEditorState } from './editor/state';

// Der Editor-Zustand lebt außerhalb der Seiten und überlebt Seitenwechsel.
const editorStore = createStore(initialEditorState());
// … und gehört zum angemeldeten Konto: beim Abmelden oder Kontowechsel wird er geleert bzw. entkoppelt.
bindEditorToAuth(editorStore);

// Konto-Menü im Seitenkopf. Der Anmeldestatus wird einmal beim Start geholt; schlägt das fehl
// (außer 401, das getCurrentUser selbst als „abgemeldet“ meldet), gilt der Nutzer als abgemeldet.
const accountSlot = document.getElementById('account-slot');
if (accountSlot) {
  const menu = mountAccountMenu(accountSlot);
  getCurrentUser()
    .catch((error: unknown) => {
      console.error('Anmeldestatus konnte nicht geprüft werden', error);
    })
    .finally(() => menu.ready());
}

startRouter((route, root) => {
  if (route === 'editor') {
    return mountEditor(root, editorStore);
  }
  if (route === 'reset') {
    return mountResetPage(root);
  }
  return mountCardsPage(root, editorStore);
});