// Main app entry point — wires together router, auth, state, and nav badges

import * as router from './router.js';
import { refreshAuth, renderAuthChips } from './auth.js';
import { state, subscribe } from './state.js';
import { getActive, initProject } from './project.js';

// ── Route registrations (lazy-loaded views) ───────────────────────────────

router.register('#/templates', async (param) => {
  const { renderTemplates, renderTemplateDetail } = await import('./templates.js');
  if (param) {
    await renderTemplateDetail(param);
  } else {
    await renderTemplates();
  }
});

router.register('#/results', async () => {
  const { renderResults } = await import('./migration.js');
  renderResults();
});

router.register('#/issues', async () => {
  const { renderIssues } = await import('./issues.js');
  renderIssues();
});

router.register('#/verify', async () => {
  const { renderVerification } = await import('./verification.js');
  await renderVerification();
});

router.register('#/history', async () => {
  const { renderHistory } = await import('./history.js');
  await renderHistory();
});

router.register('#/activity', async () => {
  const { renderActivity } = await import('./activity.js');
  await renderActivity();
});

router.register('#/settings', async () => {
  const { renderSettings } = await import('./settings.js');
  renderSettings();
});

router.register('#/help', async () => {
  const { renderHelp } = await import('./help.js');
  renderHelp();
});

// ── Nav badge subscriptions ───────────────────────────────────────────────

subscribe('issueCount', count => {
  const badge = document.getElementById('nav-badge-issues');
  if (badge) {
    badge.dataset.count = count;
    badge.textContent   = count;
  }
});

subscribe('templates', templates => {
  const caveats = (templates || []).filter(t =>
    (!t.blockers || t.blockers.length === 0) &&
    t.warnings && t.warnings.length > 0
  ).length;
  const badge = document.getElementById('nav-badge-caveats');
  if (badge) {
    badge.dataset.count = caveats;
    badge.textContent   = caveats;
  }
});

// ── Project switcher wiring ───────────────────────────────────────────────

function syncProjectDisplay() {
  const project = getActive();
  const iconEl    = document.getElementById('nav-project-icon');
  const nameEl    = document.getElementById('nav-project-name');
  const custName  = document.getElementById('nav-customer-name');
  const custSub   = document.getElementById('nav-customer-sub');

  if (project) {
    const initials = project.name.slice(0, 2).toUpperCase();
    if (iconEl)   { iconEl.textContent = initials; }
    if (nameEl)   { nameEl.textContent = project.name; nameEl.classList.remove('no-project'); }
    if (custName) { custName.textContent = project.name; }
    if (custSub)  { custSub.textContent = `Created ${new Date(project.createdAt).toLocaleDateString()}`; }
  } else {
    if (iconEl)   { iconEl.textContent = '?'; }
    if (nameEl)   { nameEl.textContent = 'New Project'; nameEl.classList.add('no-project'); }
    if (custName) { custName.textContent = '—'; }
    if (custSub)  { custSub.textContent = ''; }
  }
}

// ── Init ─────────────────────────────────────────────────────────────────

document.addEventListener('DOMContentLoaded', async () => {
  // Init project context
  initProject(syncProjectDisplay);

  // Wire project switcher button
  const switcher = document.getElementById('nav-project-switcher');
  if (switcher) {
    switcher.addEventListener('click', async () => {
      const { showProjectModal } = await import('./project.js');
      showProjectModal(syncProjectDisplay);
    });
  }

  // Auth chips
  await refreshAuth();

  // Start router
  router.init();
});