{% extends "base.html" %}
{% block title %}Dashboard · frp-jump{% endblock %}
{% block content %}
<h1>Devices &amp; tunnels</h1>
<p class="muted">Wire up who can reach what. Changes apply next time each device's agent polls.</p>

<section class="card">
  <h2>Devices</h2>
  {% if devices %}
  <table>
    <thead><tr><th>Name</th><th>Owner</th><th>Status</th><th>Enrolled</th><th>Last seen</th><th>Agent</th><th></th></tr></thead>
    <tbody>
      {% for d in devices %}
      <tr>
        <td class="mono">{{ d.name }}</td>
        <td class="muted">{{ d.owner_email }}</td>
        <td>
          {% if d.revoked %}<span class="pill revoked">revoked</span>
          {% elif online[d.id] %}<span class="pill active">online</span>
          {% else %}<span class="pill">offline</span>{% endif %}
        </td>
        <td class="muted">{{ d.enrolled_at.strftime("%Y-%m-%d") }}</td>
        <td class="muted">{{ d.last_seen_at.strftime("%Y-%m-%d %H:%M") if d.last_seen_at else "never" }}</td>
        <td class="muted">{{ d.agent_version or "—" }}</td>
        <td style="white-space:nowrap">
          {% if not d.revoked %}
          <form action="/devices/{{ d.id }}/revoke" method="post" style="margin:0; display:inline">
            <button type="submit" class="danger small">Revoke</button>
          </form>
          {% endif %}
          <form action="/devices/{{ d.id }}/delete" method="post" style="margin:0; display:inline"
                onsubmit="return confirm('Delete {{ d.name }} permanently? This frees the name for reuse but cannot be undone.');">
            <button type="submit" class="danger small">Delete</button>
          </form>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  {% else %}
  <p class="empty">No devices enrolled yet.</p>
  {% endif %}

  <h2 style="margin-top:22px">Add device</h2>
  <p class="muted">Leave name blank to let whoever redeems the token pick their own; set owner email to onboard a friend's first device under their own account instead of yours.</p>
  <form class="inline" action="/devices/enroll-token" method="post">
    <div>
      <label for="device_name">Name (optional)</label>
      <input id="device_name" name="device_name" placeholder="wb01" pattern="[a-zA-Z0-9_-]{1,63}">
    </div>
    <div>
      <label for="owner_email">Owner email (optional, default: you)</label>
      <input id="owner_email" name="owner_email" type="email" placeholder="friend@example.com">
    </div>
    <button type="submit">Create enroll command</button>
  </form>
</section>

<section class="card">
  <h2>Pending enroll tokens</h2>
  {% if pending_tokens %}
  <table>
    <thead><tr><th>Name</th><th>Owner</th><th>Created</th><th>Expires</th><th></th></tr></thead>
    <tbody>
      {% for t in pending_tokens %}
      <tr>
        <td class="mono">{{ t.device_name_hint or "(picked at enroll time)" }}</td>
        <td class="muted">{{ t.owner_email }}</td>
        <td class="muted">{{ t.created_at.strftime("%Y-%m-%d %H:%M") }}</td>
        <td class="muted">{{ t.expires_at.strftime("%Y-%m-%d %H:%M") }}</td>
        <td>
          <form action="/enroll-tokens/{{ t.id }}/revoke" method="post" style="margin:0">
            <button type="submit" class="danger small">Revoke</button>
          </form>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  {% else %}
  <p class="empty">No unredeemed tokens.</p>
  {% endif %}
</section>

<section class="card">
  <h2>Services exposed</h2>
  {% if services %}
  <table>
    <thead><tr><th>Name</th><th>Device</th><th>Protocol</th><th>Port</th></tr></thead>
    <tbody>
      {% for s in services %}
      <tr>
        <td class="mono">{{ s.name }}</td>
        <td class="mono">{{ s.device_name }}</td>
        <td><span class="pill {{ s.protocol.value }}">{{ s.protocol.value }}</span></td>
        <td class="mono">{{ s.target_port }}</td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  {% else %}
  <p class="empty">No services yet.</p>
  {% endif %}

  {% if devices %}
  <h2 style="margin-top:22px">Add service</h2>
  <form class="inline" action="/services" method="post">
    <div>
      <label for="svc_device">Device</label>
      <select id="svc_device" name="device_id" required>
        {% for d in devices if not d.revoked %}<option value="{{ d.id }}">{{ d.name }}</option>{% endfor %}
      </select>
    </div>
    <div>
      <label for="svc_name">Name</label>
      <input id="svc_name" name="name" placeholder="wb01-ssh" required pattern="[a-zA-Z0-9_-]{1,63}">
    </div>
    <div>
      <label for="svc_protocol">Protocol</label>
      <select id="svc_protocol" name="protocol" required>
        {% for p in service_protocols %}<option value="{{ p.value }}">{{ p.value }}</option>{% endfor %}
      </select>
    </div>
    <div>
      <label for="svc_port">Local port</label>
      <input id="svc_port" name="target_port" type="number" min="1" max="65535" placeholder="22" required>
    </div>
    <button type="submit">Add</button>
  </form>
  {% else %}
  <p class="muted">Add a device first.</p>
  {% endif %}
</section>

<section class="card">
  <h2>Access grants</h2>
  {% if grants %}
  <table>
    <thead><tr><th>Service</th><th>Exposed by</th><th>Granted to</th><th>Status</th><th></th></tr></thead>
    <tbody>
      {% for g in grants %}
      <tr>
        <td class="mono">{{ g.service_name }}</td>
        <td class="mono">{{ g.exposer_device_name }}</td>
        <td class="mono">{{ g.consumer_device_name }}</td>
        <td>
          {% if g.revoked %}<span class="pill revoked">revoked</span>
          {% else %}<span class="pill active">active</span>{% endif %}
        </td>
        <td>
          {% if not g.revoked %}
          <form action="/grants/{{ g.id }}/revoke" method="post" style="margin:0">
            <button type="submit" class="danger small">Revoke</button>
          </form>
          {% endif %}
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  {% else %}
  <p class="empty">No grants yet &mdash; nobody can reach anybody.</p>
  {% endif %}

  {% if services and devices %}
  <h2 style="margin-top:22px">Grant access</h2>
  <form class="inline" action="/grants" method="post">
    <div>
      <label for="grant_service">Service</label>
      <select id="grant_service" name="service_id" required>
        {% for s in services %}<option value="{{ s.id }}">{{ s.name }} ({{ s.device_name }})</option>{% endfor %}
      </select>
    </div>
    <div>
      <label for="grant_consumer">Consumer device</label>
      <select id="grant_consumer" name="consumer_device_id" required>
        {% for d in devices if not d.revoked %}<option value="{{ d.id }}">{{ d.name }}</option>{% endfor %}
      </select>
    </div>
    <button type="submit">Grant</button>
  </form>
  {% else %}
  <p class="muted">Add a device and a service first.</p>
  {% endif %}
</section>

<section class="card">
  <h2>Users</h2>
  <table>
    <thead><tr><th>Email</th><th>Role</th><th>Devices</th><th></th></tr></thead>
    <tbody>
      {% for u in users %}
      <tr>
        <td class="mono">{{ u.email }}</td>
        <td class="muted">{{ "admin" if u.is_admin else "user" }}</td>
        <td class="mono">{{ u.device_count }}</td>
        <td>
          <form action="/users/{{ u.id }}/delete" method="post" style="margin:0"
                onsubmit="return confirm('Delete {{ u.email }} and all {{ u.device_count }} of their device(s) permanently?');">
            <button type="submit" class="danger small">Delete</button>
          </form>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</section>
{% endblock %}