{% from "components.html" import closer, pill, scrim with context %}
{{ scrim("/secrets") }}
<section class="panel panel--run panel--runner"
         role="dialog"
         aria-label="Secret {{ secret.name }}">
    <header class="panel__header run__header">
        <div class="panel__title">
            {{ closer("/secrets", label="←", klass="panel__close policy__back") }}
            <span class="dot dot--lg tone-{{ secret.tone }}"></span>
            <h2 class="panel__name">{{ secret.name }}</h2>
            {{ pill(secret.pill, secret.pill_tone) }}
            <span class="table__id">{{ secret.id }}</span>
            <div class="run__actions">
                {% for label, act, klass in (("Rotate", "rotate", "button--outline"), ("Expiry", "expiry", "button--outline"), ("Delete", "delete", "button--outline-danger")) %}
                    <a class="button {{ klass }}"
                       href="/secrets/{{ secret.name }}/{{ act }}"
                       hx-get="/secrets/{{ secret.name }}/{{ act }}"
                       hx-target="#overlay">{{ label }}</a>
                {% endfor %}
                {{ closer("/secrets") }}
            </div>
        </div>
        <p class="panel__facts">
            {% for part in secret.meta %}
                {% if not loop.first %}<span class="run__sep">·</span>{% endif %}
                <span>{{ part }}</span>
            {% endfor %}
        </p>
    </header>
    <nav class="run__tabs">
        {% for key, label, href in (("overview", "Overview", ""), ("used", "Used by", "/used"), ("events", "Events", "/events")) %}
            <a class="run__tab{{ " run__tab--active" if tab == key }}"
               href="/secrets/{{ secret.name }}{{ href }}"
               hx-get="/secrets/{{ secret.name }}{{ href }}"
               hx-target="#overlay">{{ label }}</a>
        {% endfor %}
    </nav>
    {% if tab == "used" %}
        {% include "partials/secret_used.html" %}
    {% elif tab == "events" %}
        {% include "partials/secret_events.html" %}
    {% else %}
        {% include "partials/secret_overview.html" %}
    {% endif %}
</section>