{% extends "pages/api_keys/base.html" %}
{% from "components.html" import button %}
{% set settings_title = "API key created" %}
{% block settings_content %}
<section class="card" aria-labelledby="secret-warning" data-one-time-secret>
  <h2 id="secret-warning" tabindex="-1" data-error-focus>Copy your secret now</h2>
  <p id="secret-help">This is the only time this secret will be shown. Store it securely. If you lose it, revoke this key and create a replacement.</p>
  <p>Key: <strong>{{ created.key.name }}</strong></p>
  <div class="form-field">
    <label for="api-key-secret">API key secret</label>
    <textarea id="api-key-secret" readonly autocomplete="off" spellcheck="false" aria-describedby="secret-help">{{ created.secret }}</textarea>
  </div>
  <button type="button" class="button button-secondary" data-copy-secret hidden>Copy secret</button>
  <p role="status" aria-live="polite" data-copy-status></p>
  <noscript><p>Select the secret above and copy it manually before leaving this page.</p></noscript>
  {{ button("Done", url_for("api_key_list")) }}
</section>
{% endblock %}
{% block scripts %}<script src="{{ url_for('static', filename='js/api-key-secret.js') }}" defer></script>{% endblock %}