{% import "macros/alerts.html" as alerts %}
{% import "macros/buttons.html" as buttons %}
{% import "macros/modal.html" as modal %}
{% import "macros/icons.html" as icons %}

{% extends "admin/api_keys/list.html" %}

{% block head_title_content %}{{ api_key.name }} · {{ super() }}{% endblock %}

{% set open_modal = true %}

{% block modal %}
<div _="on fief:closeModal go to url '{{ url_for('dashboard.api_keys:list') }}'">
  {% call modal.header() %}
    {% call modal.title() %}Save your API Key token{% endcall %}
  {% endcall %}
  {% call modal.body() %}
    {% call alerts.warning() %}
    The token below will be shown only once. Be sure to store it somewhere safe.
    {% endcall %}
    <div class="flex justify-end my-2">
    {{ buttons.clipboard(token | trim) }}
    </div>
    <pre class="relative overflow-scroll p-1 bg-slate-100 rounded border border-slate-300">{{ token | trim }}</pre>
  {% endcall %}
  {% call modal.footer() %}
    <button
    type="button"
    class="btn-sm border-slate-200 hover:border-slate-300 text-slate-600"
    _="install CloseModalButton()"
    >
    Close
    </button>
  {% endcall %}
</div>
{% endblock %}
