{% extends "base.html" %}
{% block title %}User settings - specflo{% endblock %}
{% block content %}
<h1>User settings for {{ user }}</h1>
<section id="theme">
  <h2>Theme</h2>
  <p>The theme this browser shows the daemon in. Auto follows the browser's colour scheme.</p>
  <form class="theme" method="post" action="{{ theme_path }}" aria-label="Theme">
    <input type="hidden" name="next" value="{{ user_path }}">
    {% for value in themes %}
    <button name="theme" value="{{ value }}" aria-pressed="{{ 'true' if value == theme else 'false' }}">{{ value | capitalize }}</button>
    {% endfor %}
  </form>
</section>
<section id="tokens">
  <h2>My tokens</h2>
  <p>A personal token lets a remote client, such as the CLI on another machine, act as <strong>{{ user }}</strong> through this daemon's API. Send it as a bearer token. Revoke a token you no longer use.</p>
  {% if minted %}
  <section id="minted">
    <h3>New token {{ minted[0] }}</h3>
    <p><code>{{ minted[1] }}</code></p>
    <p class="error">{{ shown_once }}</p>
  </section>
  {% endif %}
  <section id="create">
    <h3>Create a token</h3>
    <form method="post" action="{{ user_path }}">
      <input type="hidden" name="session" value="{{ session }}">
      <input type="hidden" name="op" value="{{ add_token_op }}">
      <label>Name
        <input type="text" name="name" required autocomplete="off">
      </label>
      <button type="submit">Create token</button>
    </form>
  </section>
  <section id="token-list">
    <h3>Your tokens</h3>
    {% if tokens %}
    <table>
      <thead>
        <tr>
          <th scope="col">Name</th>
          <th scope="col">Created</th>
          <th scope="col">Last used</th>
          <th scope="col">Ends in</th>
          <th scope="col"></th>
        </tr>
      </thead>
      <tbody>
        {% for token in tokens %}
        <tr data-token="{{ token.name }}">
          <td>{{ token.name }}</td>
          <td>{{ token.created }}</td>
          <td>{{ token.last_used or "never" }}</td>
          <td><code>{{ token.last4 }}</code></td>
          <td>
            <form method="post" action="{{ user_path }}">
              <input type="hidden" name="session" value="{{ session }}">
              <input type="hidden" name="op" value="{{ revoke_token_op }}">
              <input type="hidden" name="name" value="{{ token.name }}">
              <button type="submit">Revoke</button>
            </form>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
    {% else %}
    <p class="empty">{{ no_tokens }}</p>
    {% endif %}
  </section>
</section>
{% if password_session %}
<section id="password">
  <h2>Password</h2>
  <p>Change the password <strong>{{ user }}</strong> signs in with. This session stays signed in; every other session of yours ends.</p>
  {% if refused %}
  <p class="error" role="alert">{{ refused }}</p>
  {% endif %}
  {% if changed %}
  <p role="status">{{ changed }}</p>
  {% endif %}
  <form method="post" action="{{ user_path }}">
    <input type="hidden" name="session" value="{{ session }}">
    <input type="hidden" name="op" value="{{ change_password_op }}">
    <label>Current password
      <input type="password" name="current" required autocomplete="current-password">
    </label>
    <label>New password
      <input type="password" name="new" required autocomplete="new-password">
    </label>
    <label>New password again
      <input type="password" name="again" required autocomplete="new-password">
    </label>
    <button type="submit">Change password</button>
  </form>
</section>
{% endif %}
{% endblock %}