{% extends "ui/base.html" %}

{% block title %}Roles and permissions{% endblock %}

{% block content %}
<main>
  <section class="heading">
    <div>
      <p class="eyebrow">Authorization</p>
      <h1>Roles and permissions</h1>
      <p>Manage data roles, their direct grants, inheritance, and user assignments.</p>
    </div>
    <div class="actions"><a href="/admin">← Admin panel</a></div>
  </section>

  {% if page.can_manage_roles %}
  <section class="panel">
    <h2>Data roles</h2>
    <form method="get" action="/admin/permissions" class="form-grid">
      <label>Role
        <select name="role" onchange="this.form.submit()">
          {% for role in page.editable_roles() %}
          <option value="{{ role.name }}" {% if page.selected(role.name.as_str()) %}selected{% endif %}>{{ role.name }}{% if !role.parent.is_empty() %} → {{ role.parent }}{% endif %}</option>
          {% endfor %}
        </select>
      </label>
    </form>
    <form hx-post="/admin/permissions/roles" hx-target="#permission-status" class="form-grid">
      <label>New role<input name="name" required maxlength="50" placeholder="sales"></label>
      <label>Inherits from
        <select name="parent"><option value="">No parent</option>{% for role in page.editable_roles() %}<option value="{{ role.name }}">{{ role.name }}</option>{% endfor %}</select>
      </label>
      <button type="submit">Create role</button>
    </form>
    {% if page.selected_role_is_removable() %}
    <form hx-post="/admin/permissions/roles/remove" hx-target="#permission-status">
      <input type="hidden" name="role" value="{{ page.selected_role }}">
      <button type="submit" class="danger">Remove {{ page.selected_role }}</button>
    </form>
    {% endif %}
  </section>

  <section class="panel">
    <h2>Grants for {{ page.selected_role }}</h2>
    <p class="hint">Direct grants can be revoked here. “Inherited” permissions come from the role’s parent.</p>
    <div class="table-scroll">
      <table class="builder-table">
        <thead><tr><th>Object</th><th>Scope</th><th>Actions</th></tr></thead>
        <tbody>
        {% for object in page.grantable_objects %}
          <tr>
            <td><code>{{ object.object }}</code></td>
            <td>{{ object.kind }}{% if !object.profile.is_empty() %} · {{ object.profile }}{% endif %}{% if !object.table.is_empty() %} / {{ object.table }}{% endif %}</td>
            <td>
              <div class="actions">
              {% for action in object.allowed_actions %}
                {% if page.direct(object.object.as_str(), action.as_str()) %}
                <form hx-post="/admin/permissions/revoke" hx-target="#permission-status">
                  <input type="hidden" name="role" value="{{ page.selected_role }}"><input type="hidden" name="object" value="{{ object.object }}"><input type="hidden" name="action" value="{{ action }}">
                  <button type="submit" class="danger">{{ action }} ✓</button>
                </form>
                {% else if page.effective(object.object.as_str(), action.as_str()) %}
                  <span class="tag">{{ action }} · inherited</span>
                {% else %}
                <form hx-post="/admin/permissions/grant" hx-target="#permission-status">
                  <input type="hidden" name="role" value="{{ page.selected_role }}"><input type="hidden" name="object" value="{{ object.object }}"><input type="hidden" name="action" value="{{ action }}">
                  <button type="submit" class="secondary">Grant {{ action }}</button>
                </form>
                {% endif %}
              {% endfor %}
              </div>
            </td>
          </tr>
        {% endfor %}
        </tbody>
      </table>
    </div>
  </section>
  {% endif %}

  {% if page.can_manage_users %}
  <section class="panel">
    <h2>Users</h2>
    <table class="builder-table">
      <thead><tr><th>Username</th><th>Email</th><th>Current role</th><th>Assign role</th></tr></thead>
      <tbody>{% for user in page.users %}<tr>
        <td>{{ user.username }}</td><td>{{ user.email }}</td><td>{{ user.role }}</td>
        <td><form hx-post="/admin/permissions/users/role" hx-target="#permission-status" class="actions">
          <input type="hidden" name="username" value="{{ user.username }}">
          <select name="role">{% for role in page.assignable_roles() %}<option value="{{ role.name }}" {% if user.role == role.name %}selected{% endif %}>{{ role.name }}</option>{% endfor %}</select>
          <button type="submit">Assign</button>
        </form></td>
      </tr>{% endfor %}</tbody>
    </table>
  </section>
  {% endif %}
  <div id="permission-status" aria-live="polite"></div>
</main>
{% endblock %}