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

{% block content %}
<div class="container is-max-widescreen">
  <section class="section pt-0">
    <div class="is-flex is-justify-content-space-between mb-2">
      <nav class="breadcrumb is-medium mb-1" aria-label="breadcrumbs">
        <ul>
          <li class="is-active"><a href="#" aria-current="page">Profile settings</a></li>
        </ul>
      </nav>
    </div>
    <div class="columns">
      <div class="column is-7">
        <div class="content">
          <div class="mb-2">
            Your personal API key provides access to the
            <a href="{% url 'project-list' %}" target="_blank">REST API</a>
            <div class="has-text-weight-semibold">
              Treat it like a password and keep it secure.
            </div>
          </div>
          {% if request.user.api_token %}
            <div class="notification is-grey mb-4">
              Your API key <strong>{{ request.user.api_token.prefix }}...</strong>
              was generated on {{ request.user.api_token.created }}<br>
              For security reasons, the full key is only shown once at generation time.<br>
              If you lose it, you will need to regenerate a new one.
            </div>
          {% else %}
            <div class="notification is-warning is-light mb-4">
              <strong>No API key created.</strong><br>
              Generate one using the button below to access the REST API.
            </div>
          {% endif %}
        </div>
        <div class="buttons">
          <button type="button" class="button is-success is-outlined modal-button" data-target="modal-generate-api-key" aria-haspopup="true">
            Generate API key
          </button>
          {% if request.user.api_token %}
            <button type="button" class="button is-danger is-outlined modal-button" data-target="modal-revoke-api-key" aria-haspopup="true">
              Revoke API key
            </button>
          {% endif %}
        </div>
      </div>
    </div>
  </section>
  {% include 'scanpipe/modals/profile_generate_api_key_modal.html' %}
  {% if request.user.api_token %}
    {% include 'scanpipe/modals/profile_revoke_api_key_modal.html' %}
  {% endif %}
</div>
{% endblock %}