/* ============================================================
   MyKollectOr® — Admin sidebar builder
   Include this after auth.js on every admin page
   ============================================================ */

function buildAdminSidebar(activePage) {
  const user = Auth.getUser();
  const isSuperAdmin = Auth.isSuperAdmin();
  const name = user ? `${user.prenom || ''} ${user.nom || ''}`.trim() || user.email : '—';

  const navItems = [
    { href: 'dashboard.html',     icon: '', label: 'Dashboard',      id: 'dashboard' },
    { href: 'commandes.html',     icon: '', label: 'Commandes',      id: 'commandes' },
    { href: 'sportifs.html',      icon: '', label: 'Sportifs',       id: 'sportifs'  },
    { href: 'parcours.html',      icon: '', label: 'Parcours',       id: 'parcours'  },
    { href: 'chat-admin.html',    icon: '💬', label: 'Chat fabricants', id: 'chat'      },
    { href: 'contacts.html',      icon: '', label: 'Contacts',       id: 'contacts'  },
    { href: 'prestashop.html',    icon: '', label: 'PrestaShop',     id: 'prestashop'},
    { href: 'sav-admin.html',     icon: '', label: 'SAV',            id: 'sav'       },
    { href: 'config.html',        icon: '', label: 'Configuration',  id: 'config'    },
  ];

  const superAdminItems = [
    { href: 'users.html',         icon: '', label: 'Utilisateurs',   id: 'users'     },
    { href: 'config-backup.html', icon: '', label: 'Backup',         id: 'backup'    },
  ];

  const sidebar = document.getElementById('admin-sidebar');
  if (!sidebar) return;

  sidebar.innerHTML = `
    <div class="sidebar-logo">
      <div class="brand">MyKollectOr®</div>
      <div class="sub" style="color:var(--accent);font-weight:700;font-size:0.65rem;letter-spacing:0.1em;">ADMINISTRATION</div>
    </div>
    <div class="sidebar-user">
      <div class="name">${escSide(name)}</div>
      <div style="font-size:0.7rem;color:rgba(255,255,255,0.45);margin-top:2px;">
        ${isSuperAdmin ? ' Super Admin' : ' Admin MKO'}
      </div>
    </div>
    <nav class="sidebar-nav">
      ${navItems.map(item => `
        <a href="${item.href}" class="nav-item ${activePage === item.id ? 'active' : ''}">
          ${item.icon} ${item.label}
        </a>`).join('')}
      ${isSuperAdmin ? `
        <div class="nav-section">Super Admin</div>
        ${superAdminItems.map(item => `
          <a href="${item.href}" class="nav-item ${activePage === item.id ? 'active' : ''}">
            ${item.icon} ${item.label}
          </a>`).join('')}
      ` : ''}
    </nav>
    <div class="sidebar-footer" style="border-top:1px solid rgba(255,255,255,0.08);padding:10px 20px 10px;">
      <a href="../index.html" style="display:block;font-size:0.72rem;color:rgba(255,255,255,0.4);margin-bottom:8px;text-decoration:none;">← Espace Fabricant</a>
      <button class="btn-logout" onclick="Auth.logout()">Se déconnecter</button>
    </div>`;
}

function escSide(str) {
  if (!str) return '';
  return String(str).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
}
