{% from "components.html" import closer, pill, scrim with context %}
{{ scrim("/runners") }}
<section class="panel panel--run panel--runner"
         role="dialog"
         aria-label="Runner {{ runner.name }}">
    <header class="panel__header run__header">
        <div class="panel__title">
            <span class="dot dot--lg tone-{{ runner.tone }}"
                  title="{{ runner.status }}"></span>
            <h2 class="panel__name">{{ runner.name }}</h2>
            <span class="table__id">{{ runner.id }}</span>
            <div class="run__actions">
                {% if runner.drainable %}
                    <a class="button button--outline"
                       href="/runners/{{ runner.id }}/drain"
                       hx-get="/runners/{{ runner.id }}/drain"
                       hx-target="#overlay">Drain</a>
                {% endif %}
                {% if runner.revocable %}
                    <a class="button button--outline-danger"
                       href="/runners/{{ runner.id }}/revoke"
                       hx-get="/runners/{{ runner.id }}/revoke"
                       hx-target="#overlay">Revoke</a>
                {% endif %}
                {{ closer("/runners") }}
            </div>
        </div>
        <p class="panel__facts">
            {% for part in runner.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", ""), ("runs", "Runs", "/runs"), ("audit", "Audit", "/audit")) %}
            <a class="run__tab{{ " run__tab--active" if tab == key }}"
               href="/runners/{{ runner.id }}{{ href }}"
               hx-get="/runners/{{ runner.id }}{{ href }}"
               hx-target="#overlay">{{ label }}</a>
        {% endfor %}
    </nav>
    {% if tab == "runs" %}
        {% include "partials/runner_runs.html" %}
    {% elif tab == "audit" %}
        {% include "partials/runner_audit.html" %}
    {% else %}
        {% include "partials/runner_overview.html" %}
    {% endif %}
</section>