LLeMbas/src/lembas/web/templates/admin/users.html

{% extends "admin/_layout.html" %}
{% from "_macros.html" import icon %}
{% set section = "users" %}

{% block title %}Users - {{ brand.name }}{% endblock %}
{% block heading %}Users{% endblock %}

{% block admin_content %}
<p class="admin-lede">
  Everyone with an account on this instance. Administrators bypass every
  permission; ordinary users get the baseline permissions plus whatever their
  groups add.
</p>

{% if saved %}
<div class="alert alert--success">{{ icon("check", "icon--sm") }} <span>{{ saved }}</span></div>
{% endif %}

<form method="get" action="/admin/users" class="btn-row" style="margin-bottom: var(--sp-5)">
  <input class="input" type="search" name="q" value="{{ q }}"
         placeholder="Search by name or email" aria-label="Search users">
  <button class="btn" type="submit">{{ icon("search", "icon--sm") }} Search</button>
  {% if q %}<a class="btn btn--ghost" href="/admin/users">Clear</a>{% endif %}
</form>

<details class="card">
  <summary class="card__title" style="cursor: pointer">Add a user</summary>
  <form method="post" action="/admin/users" style="margin-top: var(--sp-4)">
    <div class="field">
      <label class="field__label" for="nu-name">Name</label>
      <input class="input" id="nu-name" name="name" required>
    </div>
    <div class="field">
      <label class="field__label" for="nu-email">Email</label>
      <input class="input" id="nu-email" name="email" type="email" required>
    </div>
    <div class="field">
      <label class="field__label" for="nu-password">Password</label>
      <input class="input" id="nu-password" name="password" type="password"
             required minlength="8" autocomplete="new-password">
      <p class="field__hint">
        At least 8 characters. Tell them to change it — you will know it otherwise.
      </p>
    </div>
    <div class="field">
      <label class="field__label" for="nu-role">Role</label>
      <select class="select" id="nu-role" name="role">
        {% for role in roles %}
        <option value="{{ role }}" {{ 'selected' if role == 'user' }}>{{ role }}</option>
        {% endfor %}
      </select>
    </div>
    <div class="btn-row">
      <button class="btn btn--primary" type="submit">{{ icon("plus", "icon--sm") }} Create</button>
    </div>
  </form>
</details>

<h2 class="admin-section-title">
  Accounts <span class="badge">{{ users|length }}</span>
</h2>

{% for account in users %}
<section class="card">
  <form method="post" action="/admin/users/{{ account.id }}">
    <div class="card__header">
      <div class="row" style="gap: var(--sp-2); min-width: 0">
        <span class="status-dot {{ 'is-ok' if account.active else 'is-off' }}"></span>
        <strong class="truncate">{{ account.name }}</strong>
        <code class="text-xs faint">{{ account.email }}</code>
        {% if account.is_admin %}<span class="badge badge--leaf">admin</span>{% endif %}
        {% if not account.active %}<span class="badge badge--danger">deactivated</span>{% endif %}
        {% if account.id == user.id %}<span class="badge">you</span>{% endif %}
      </div>
      <span class="text-xs faint">
        {% if account.last_login_at %}
          last seen {{ account.last_login_at.strftime("%Y-%m-%d %H:%M") }}
        {% else %}
          never signed in
        {% endif %}
      </span>
    </div>

    <div class="field">
      <label class="field__label" for="un-{{ account.id }}">Name</label>
      <input class="input" id="un-{{ account.id }}" name="name" value="{{ account.name }}" required>
    </div>

    <div class="field">
      <label class="field__label" for="ur-{{ account.id }}">Role</label>
      <select class="select" id="ur-{{ account.id }}" name="role">
        {% for role in roles %}
        <option value="{{ role }}" {{ 'selected' if role == account.role }}>{{ role }}</option>
        {% endfor %}
      </select>
      <p class="field__hint">
        <strong>admin</strong> can do everything, including this page.
        <strong>user</strong> is an ordinary account.
        <strong>pending</strong> cannot sign in until promoted.
      </p>
    </div>

    <div class="field">
      <label class="checkbox">
        <input type="checkbox" name="active" value="true" {{ 'checked' if account.active }}>
        <span>Active — may sign in</span>
      </label>
      <p class="field__hint">
        Deactivating signs them out everywhere immediately, rather than waiting
        for their session to expire.
      </p>
    </div>

    {% if groups %}
    <div class="field">
      <span class="field__label">Groups</span>
      <div class="checkbox-row">
        {% for group in groups %}
        <label class="checkbox">
          <input type="checkbox" name="group_ids" value="{{ group.id }}"
                 {{ 'checked' if group in account.groups }}>
          <span>{{ group.name }}</span>
        </label>
        {% endfor %}
      </div>
    </div>
    {% endif %}

    {% if account.is_admin and admin_count <= 1 %}
    <div class="alert alert--warning">
      {{ icon("warning", "alert__icon") }}
      <span>
        The only administrator. Promote someone else before demoting or
        deactivating this account — an instance with no admin can only be
        recovered with <code>lembas create-admin</code>.
      </span>
    </div>
    {% endif %}

    <div class="btn-row"><button class="btn btn--primary" type="submit">Save</button></div>
  </form>

  <div class="card__footer">
    <form method="post" action="/admin/users/{{ account.id }}/password" class="btn-row">
      <input class="input" type="password" name="password" minlength="8"
             placeholder="Set a new password" autocomplete="new-password" required
             aria-label="New password for {{ account.email }}">
      <button class="btn btn--sm" type="submit">{{ icon("key", "icon--sm") }} Reset</button>
    </form>

    {% if account.id != user.id %}
    <form method="post" action="/admin/users/{{ account.id }}/delete"
          data-confirm="Delete {{ account.email }} and all their chats? This cannot be undone."
          data-confirm-title="Delete account">
      <button class="btn btn--sm btn--danger" type="submit">
        {{ icon("trash", "icon--sm") }} Delete
      </button>
    </form>
    {% endif %}
  </div>
</section>
{% endfor %}
{% endblock %}