<%- include('../shared/_head', { title: title, portalCss: '/platform/shared/css/base.css', bodyClass: 'merchant-portal dashboard-page' }) %>

<div class="dashboard-shell">
  <header class="dashboard-header">
    <div class="dashboard-brand">
      <span class="brand-name">BeezifiPay</span>
      <div class="portal-badge portal-badge--admin">Admin</div>
    </div>
    <nav class="dashboard-nav">
      <a href="/admin" class="nav-link">Dashboard</a>
      <a href="/admin/merchants" class="nav-link nav-link--active">Merchants</a>
      <a href="/admin/payers" class="nav-link">Payers</a>
      <a href="/admin/notifications" class="nav-link">Notifications</a>
      <a href="/admin/checkouts" class="nav-link">Checkouts</a>
      <a href="/admin/audit" class="nav-link">Audit log</a>
      <span class="nav-divider">·</span>
      <form method="POST" action="/admin/logout" style="display:inline">
        <input type="hidden" name="_csrf" value="<%= csrfToken %>">
        <button type="submit" class="btn-link">Sign out</button>
      </form>
    </nav>
  </header>

  <main class="dashboard-main">
    <%- include('../shared/_flash') %>

    <div class="page-header">
      <h1>Merchant users</h1>
      <p class="text-muted"><%= merchants.length %> total</p>
    </div>

    <% if (merchants.length) { %>
    <table class="data-table">
      <thead>
        <tr>
          <th>Name</th>
          <th>Email</th>
          <th>Email verified</th>
          <th>Status</th>
          <th>Joined</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        <% for (const m of merchants) { %>
        <tr class="<%= m.isActive ? '' : 'row--inactive' %>">
          <td><strong><%= m.fullName %></strong></td>
          <td><%= m.email %></td>
          <td><%= m.emailVerifiedAt ? new Date(m.emailVerifiedAt).toLocaleDateString() : '<span class="text-muted">Unverified</span>' %></td>
          <td><span class="status-pill <%= m.isActive ? '' : 'status-pill--inactive' %>"><%= m.isActive ? 'active' : 'inactive' %></span></td>
          <td class="text-muted" style="font-size:0.8rem"><%= new Date(m.createdAt).toLocaleDateString() %></td>
          <td>
            <% if (m.isActive) { %>
            <form method="POST" action="/admin/merchants/<%= m.id %>/deactivate" style="display:inline"
                  onsubmit="return confirm('Deactivate this merchant user?')">
              <input type="hidden" name="_csrf" value="<%= csrfToken %>">
              <button type="submit" class="btn-link btn-link--warn">Deactivate</button>
            </form>
            <% } else { %>
            <form method="POST" action="/admin/merchants/<%= m.id %>/reactivate" style="display:inline">
              <input type="hidden" name="_csrf" value="<%= csrfToken %>">
              <button type="submit" class="btn-link">Reactivate</button>
            </form>
            <% } %>
          </td>
        </tr>
        <% } %>
      </tbody>
    </table>
    <% } else { %>
    <div class="empty-state"><p>No merchant users yet.</p></div>
    <% } %>
  </main>
</div>

<%- include('../shared/_foot') %>
