{% extends "cacsremoteservice/views/layouts/master.html" %}

{% block site-nav %}
{% include "cacsremoteservice/views/partials/site-nav.html" with active="configuration" %}
{% endblock %}

{% block main %}
<div id="page-body" class="configuration-view">
  <div class="text-content">
    <h1>Personal Access Tokens</h1>
    <h3 class="lead text-muted">
      Administer {% if is-admin %}all users'{% else %}your{% endif %} Personal tokens
    </h3>
    {% if validation-errors|not-empty %}
    <section>
      <h2 class="validation-errors-heading alert-warning">
        Error
      </h2>
      <ul class="validation-errors">
        {% for error in validation-errors %}
        <li>
          <i class="fa fa-exclamation-triangle"></i>
          {{error}}
        </li>
        {% endfor %}
      </ul>
    </section>
    {% endif %}
    {% if created-token %}
    <div class="row">
      <div class="col-xs-11 col-sm-11 col-md-11 col-lg-11">
        <h1>Token Created</h1>
        <p><span class="text-muted">Label:</span> {{created-token.label}}</p>
        <p><span class="text-muted">Expiration Date:</span> {{created-token.expires-at|date:"yyyy-MM-dd HH:mm:ss zzz"|default:"never"}}</p>
        <p class="text-muted">Make sure to copy your token now. You will not see it again!</p>
        <div class="alert alert-warning row">
          <span class="col-xs-11 col-sm-11 col-md-11 col-lg-11 text-monospace text-nowrap">{{created-token.secret}}</span>
          <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1 text-right">
            <button title="Copy token to clipboard" onclick="navigator.clipboard.writeText('{{created-token.secret}}');"><i
              class="fa fa-copy"></i></button>
          </div>
        </div>
        <p class="text-muted">If using for CLI tool copy the token and set it in your CS_ACCESS_TOKEN environment variable.</p>
      </div>
    </div>
    {% endif %}
    {% if not license-key-admin? %}
    <p class="text-muted">
      To create a token for yourself, click the <strong>Generate token</strong> button below.
    </p>
    {% endif %}
    <p class="text-muted">These tokens can be used to access REST API and other programmatic endpoints.</p>
    <table class="table table-striped" id="all-tokens">
      <colgroup>
        {% if is-admin %}<col style="width: 250px"> {% endif %}
        <col>
        <col style="width: 200px">
        <col style="width: 120px">
        <col style="width: min-content">
      </colgroup>
      <thead>
      <tr>
        {% if is-admin %}<th title="User">User</th>{% endif %}
        <th title="Label">Label</th>
        <th title="Expiration">Expiration</th>
        <th title="Last Used Date">Last Used Date</th>
        <th class="column-actions"></th>
      </tr>
      </thead>
      <tbody>
      {% for token in tokens %}
      <tr>
        {% if is-admin %}<td>{{token.name}} ({{ token.provider}})</td>{% endif %}
        <td>{{token.label}}</td>
        <td>{{token.expires-at|date:"yyyy-MM-dd HH:mm:ss zzz"}}</td>
        <td>{{token.used-at|date:"yyyy-MM-dd"|default:"never"}}</td>
        <td class="column-actions">
          <form action="{{view-context}}/configuration/user/token/delete"
                method="POST" onsubmit="return confirm('Any applications or scripts using this token will no longer be able to access the CodeScene API. You cannot undo this action!');">
            <input class="btn btn-danger" type="submit" value="Remove"
                   title="Remove Token"/>
            <input name="id" value="{{token.id}}" type="hidden">
            {% if vscode %}<input value="true" name="vscode" type="hidden">{% endif %}
          </form>
        </td>
      </tr>
      {% endfor %}
      </tbody>
    </table>
    <div class="row">
      <div class="col-xs-12" style="display: flex; justify-content: flex-end">
        {% if page > 0 %}
        <a id="prev-page" class="default-button primary" type="submit" href="?page={{ page|add:-1 }}">
          Prev
        </a>
        {% endif %}
        {% if next-page %}
        <a id="next-page" class="default-button primary" type="submit" href="?page={{ page|add:1 }}">
          Next
        </a>
        {% endif %}
      </div>
    </div>
    <form method="POST" id="user-token-form">
      <div class="row" style="display: flex; align-content: flex-end">
        <div class="col-xs-10">
          <label for="description">Description</label>
          {% if license-key-admin? %}
          <p id="license-key-admin-help">
            You are currently logged in as the super-administrator
            using the license key. This account should be restricted
            to administrative tasks. To support services requiring
            personal authentication tokens (PAT), please create a
            separate user account specifically for those purposes.
          </p>
          {% endif %}
          <input class="form-control"
                 id="description"
                 type="text"
                 name="label"
                 placeholder="my CLI token"
                 maxlength="255"
                 {% if vscode %}value="vscode extension token"{% endif %}
                 {% if license-key-admin? %}disabled{% endif %}
                 required />
          {% if vscode %}<input id="vscode" value="true" name="vscode" type="hidden">{% endif %}
        </div>
        <div class="text-right col-xs-2" style="align-content: end">
          <button id="generate-token" class="default-button primary {% if license-key-admin? %}disabled{% endif %}" type="submit" {% if license-key-admin? %}disabled{% endif %}>
            Generate token
          </button>
        </div>
      </div>
    </form>
  </div>
</div>

{% if all vscode validation-errors|empty? %}
<script>
  document.getElementById("user-token-form").submit();
</script>
{% endif %}
{% endblock %}