{% extends "base.html" %}
{% block title %}Network Join Requests — {{ config.BBS_NAME }}{% endblock %}

{% block content %}
<div class="bbs-header">
    <h1><i class="bi bi-file-earmark-person"></i> Network Join Requests</h1>
    <p>Applications submitted through the public "apply to join" web form.</p>
</div>

<div class="mb-3 d-flex align-items-center gap-2">
    <a href="{{ url_for('hub_admin.index', gen_tab='join') }}" class="btn btn-primary btn-sm">
        <i class="bi bi-arrow-left"></i> Hub Admin
    </a>
    {% if identities|length > 1 %}
    <form method="GET" class="d-inline-flex align-items-center gap-2 ms-2">
        <label class="form-label mb-0 small">Hub Identity:</label>
        <select name="identity" class="form-select form-select-sm" style="width:auto" onchange="this.form.submit()">
            <option value="">All</option>
            {% for i in identities %}
            <option value="{{ i.id }}" {% if identity_filter == i.id %}selected{% endif %}>{{ i.name }}</option>
            {% endfor %}
        </select>
    </form>
    {% endif %}
</div>

{% with messages = get_flashed_messages(with_categories=true) %}
  {% for cat, msg in messages %}
    <div class="alert alert-{{ cat }} alert-dismissible fade show">
      {{ msg }}<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
  {% endfor %}
{% endwith %}

{# ── Pending ─────────────────────────────────────────────────── #}
<h5 class="mt-3">
  Pending
  {% if pending %}
    <span class="badge bg-danger ms-1">{{ pending|length }}</span>
  {% endif %}
</h5>

{% if pending %}
<div class="table-responsive">
<table class="table table-sm table-hover align-middle">
  <thead class="table-dark">
    <tr>
      <th>BBS Name</th>
      {% if identities|length > 1 %}<th>Identity</th>{% endif %}
      <th>Applicant</th>
      <th>Email</th>
      <th>BinkP</th>
      <th>QWK</th>
      <th>Notes</th>
      <th>Applied</th>
      <th class="text-end">Actions</th>
    </tr>
  </thead>
  <tbody>
    {% for r in pending %}
    <tr>
      <td class="fw-bold">
        <a href="{{ url_for('hub_admin.join_request_detail', req_id=r.id) }}">{{ r.bbs_name }}</a>
      </td>
      {% if identities|length > 1 %}<td class="small">{{ r.hub_identity.name if r.hub_identity else '—' }}</td>{% endif %}
      <td>{{ r.name }}{% if r.location %}<br><span class="small text-muted">{{ r.location }}</span>{% endif %}</td>
      <td class="small">{{ r.email }}</td>
      <td class="small font-monospace">{{ r.binkp_ftn_address or '—' }}</td>
      <td class="small font-monospace">{{ r.qwk_packet_id or '—' }}</td>
      <td class="small text-muted">{{ (r.notes or '')[:60] }}</td>
      <td class="small text-muted text-nowrap">
        {{ r.created_at|eastern('%Y-%m-%d', '?') }}
      </td>
      <td class="text-end text-nowrap">
        <a href="{{ url_for('hub_admin.join_request_detail', req_id=r.id) }}"
           class="btn btn-sm btn-outline-primary">
          <i class="bi bi-eye"></i> View
        </a>

        <form method="POST"
              action="{{ url_for('hub_admin.approve_join_request', req_id=r.id) }}"
              class="d-inline"
              onsubmit="return confirm('Approve {{ r.bbs_name }} and create their node account(s)?')">
          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
          <button class="btn btn-sm btn-success ms-1">
            <i class="bi bi-check-circle"></i> Approve
          </button>
        </form>

        <button class="btn btn-sm btn-outline-danger ms-1"
                data-bs-toggle="modal"
                data-bs-target="#denyModal{{ r.id }}">
          <i class="bi bi-x-circle"></i> Deny
        </button>

        {# Deny modal #}
        <div class="modal fade" id="denyModal{{ r.id }}" tabindex="-1">
          <div class="modal-dialog">
            <div class="modal-content">
              <form method="POST"
                    action="{{ url_for('hub_admin.deny_join_request', req_id=r.id) }}">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                <div class="modal-header">
                  <h5 class="modal-title">Deny {{ r.bbs_name }}</h5>
                  <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                  <label class="form-label">Reason (emailed to applicant if SMTP is set up, optional)</label>
                  <input type="text" name="reason" class="form-control"
                    placeholder="e.g. Address already taken, try a different one">
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                  <button type="submit" class="btn btn-danger">Deny Request</button>
                </div>
              </form>
            </div>
          </div>
        </div>
      </td>
    </tr>
    {% endfor %}
  </tbody>
</table>
</div>
{% else %}
<p class="text-muted">No pending requests.</p>
{% endif %}

{# ── Recently reviewed ────────────────────────────────────────── #}
{% if reviewed %}
<h5 class="mt-4">Recently Reviewed</h5>
<div class="table-responsive">
<table class="table table-sm table-hover align-middle">
  <thead class="table-secondary">
    <tr>
      <th>BBS Name</th>
      {% if identities|length > 1 %}<th>Identity</th>{% endif %}
      <th>Status</th>
      <th>Reviewed</th>
      <th>Reviewed by</th>
      <th>Reason / Credentials</th>
      <th>Email</th>
    </tr>
  </thead>
  <tbody>
    {% for r in reviewed %}
    <tr>
      <td><a href="{{ url_for('hub_admin.join_request_detail', req_id=r.id) }}">{{ r.bbs_name }}</a></td>
      {% if identities|length > 1 %}<td class="small">{{ r.hub_identity.name if r.hub_identity else '—' }}</td>{% endif %}
      <td>
        {% if r.status == 'approved' %}
          <span class="badge bg-success">Approved</span>
        {% else %}
          <span class="badge bg-danger">Denied</span>
        {% endif %}
      </td>
      <td class="small text-muted">
        {{ r.reviewed_at|eastern('%Y-%m-%d', '?') }}
      </td>
      <td class="small">{{ r.reviewed_by or '—' }}</td>
      <td class="small text-muted">
        {% if r.status == 'approved' %}
          {% if r.binkp_node_id %}
            BinkP: <a href="{{ url_for('hub_admin.binkp_node_detail', node_id=r.binkp_node_id) }}">view node</a>
            (<code>{{ r.generated_binkp_password }}</code>)
          {% endif %}
          {% if r.qwk_node_id %}
            {% if r.binkp_node_id %}·{% endif %}
            QWK: <a href="{{ url_for('hub_admin.qwk_node_detail', node_id=r.qwk_node_id) }}">view node</a>
            (<code>{{ r.generated_qwk_password }}</code>)
          {% endif %}
        {% else %}
          {{ r.deny_reason or '—' }}
        {% endif %}
      </td>
      <td class="small text-nowrap">
        {% if r.status == 'approved' %}
          {% if r.email_error %}
            {# email_error holds the MOST RECENT failure, even if an
               earlier attempt (email_sent_at) succeeded -- a later
               failed resend must not read as "Sent". #}
            <span class="badge bg-danger" title="{{ r.email_error }}">
              <i class="bi bi-envelope-exclamation"></i> Failed
            </span>
          {% elif r.email_sent_at %}
            <span class="badge bg-success" title="Last sent {{ r.email_sent_at|eastern('%Y-%m-%d %H:%M') }}">
              <i class="bi bi-envelope-check"></i> Sent
            </span>
          {% else %}
            <span class="badge bg-secondary">Not sent</span>
          {% endif %}
          <form method="POST"
                action="{{ url_for('hub_admin.resend_join_request_email', req_id=r.id) }}"
                class="d-inline">
            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
            <button class="btn btn-sm btn-outline-secondary ms-1" title="Resend credentials email">
              <i class="bi bi-arrow-repeat"></i>
            </button>
          </form>
        {% else %}
          —
        {% endif %}
      </td>
    </tr>
    {% endfor %}
  </tbody>
</table>
</div>
{% endif %}
{% endblock %}