{% extends "base.html" %}

{% block title %}Accounts · Face Attendance{% endblock %}

{% block content %}
<div class="page-header">
  <div>
    <p class="eyebrow">Administration</p>
    <h1>Accounts</h1>
  </div>
  <a class="btn btn-primary" href="{{ url_for('admin.new_account') }}">Create account</a>
</div>

<section class="content-section">
  {% if accounts %}
  <div class="table-responsive">
    <table class="table align-middle">
      <thead>
        <tr>
          <th>Name</th>
          <th>Username</th>
          <th>Email</th>
          <th>Role</th>
          <th>Status</th>
          <th class="text-end">Actions</th>
        </tr>
      </thead>
      <tbody>
        {% for account in accounts %}
        <tr>
          <td>{{ account.full_name }}</td>
          <td>{{ account.username }}</td>
          <td>{{ account.email }}</td>
          <td>{{ account.role|title }}</td>
          <td><span class="badge text-bg-{{ 'success' if account.active else 'secondary' }}">{{ "Active" if account.active else "Inactive" }}</span></td>
          <td class="text-end">
            {% if account.id != current_user.id %}
            <form method="post" action="{{ url_for('admin.toggle_account', account_id=account.id) }}" class="d-inline">
              <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
              <button class="btn btn-outline-secondary btn-sm" type="submit">{{ "Deactivate" if account.active else "Activate" }}</button>
            </form>
            {% endif %}
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% else %}
  <div class="empty-state">No staff accounts exist yet.</div>
  {% endif %}
</section>
{% endblock %}