/**
 * Sidebar navigation for the dashboard.
 * Manages the active nav item and visible page section, and wires up click listeners.
 * Depends on: core/utils.js ($)
 */

const PAGE_TITLES = {
  dashboard: 'Overview',
  connections: 'Virtual Hosts',
  swarms: 'Server Tunnels',
  'service-tunnels': 'Service Tunnels',
  tabs: 'Proxy & CA',
  ssh: 'SSH Connections',
  rdp: 'Remote Desktop',
  backups: 'Backups',
  logs: 'Logs',
  settings: 'Settings'
};

/**
 * Switch the dashboard to the specified page.
 * Updates the active nav item, shows the corresponding `.page` section,
 * and sets the topbar title.
 * @param {string} page - Page key (e.g. `'dashboard'`, `'connections'`, `'ssh'`).
 */
function navigateTo(page) {
  document.querySelectorAll('.nav-item').forEach(i => i.classList.remove('active'));
  document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
  const navItem = document.querySelector(`.nav-item[data-page="${page}"]`);
  if (navItem) navItem.classList.add('active');
  const pageEl = $(`page-${page}`);
  if (pageEl) pageEl.classList.add('active');
  const titleEl = $('topbarTitle');
  if (titleEl) titleEl.textContent = PAGE_TITLES[page] || page;
}

/**
 * Attach click and keyboard listeners to all `.nav-item` elements.
 * Called once during dashboard initialisation.
 */
function setupNavigation() {
  document.querySelectorAll('.nav-item').forEach(item => {
    item.setAttribute('role', 'button');
    item.setAttribute('tabindex', '0');
    item.addEventListener('click', () => navigateTo(item.dataset.page));
    item.addEventListener('keydown', (e) => {
      if (e.key === 'Enter' || e.key === ' ') {
        e.preventDefault();
        navigateTo(item.dataset.page);
      }
    });
  });
}