{% extends "admin/page.html" %}
{% use_elements %}

{# Split a dotted identifier into a muted package prefix and a
   full-strength local part, so the local identifier reads as the
   focal point. Outputs only the inner spans — call sites wrap with
   their own font/color/weight class. #}
{% macro tiered_split(text) -%}
{%- set _parts = text.split('.', 1) -%}
{%- if _parts|length == 2 -%}
<span class="text-admin-muted-foreground">{{ _parts[0] }}.</span>{{ _parts[1] }}
{%- else -%}
{{ text }}
{%- endif -%}
{%- endmacro %}

{% block content %}

{% if checks %}

{# Summary — count + noun pairs. Number gets the visual weight; noun
   is muted when the count is "fine," shares a status color when it
   isn't. Zero counts read as ambient. #}
<div class="flex flex-wrap items-baseline gap-x-3 gap-y-1.5 mb-7 font-mono text-xs tabular-nums">
    <span class="flex items-baseline gap-1">
        <span class="text-admin-foreground">{{ passed_count }}</span>
        <span class="text-admin-muted-foreground">passed</span>
    </span>
    <span class="text-admin-muted-foreground">·</span>
    <span
        data-empty="{{ warning_count == 0 }}"
        class="flex items-baseline gap-1 data-[empty=True]:text-admin-muted-foreground data-[empty=False]:text-admin-warning"
    >
        <span>{{ warning_count }}</span>
        <span>warning{{ "s" if warning_count != 1 else "" }}</span>
    </span>
    <span class="text-admin-muted-foreground">·</span>
    <span
        data-empty="{{ error_count == 0 }}"
        class="flex items-baseline gap-1 data-[empty=True]:text-admin-muted-foreground data-[empty=False]:text-admin-danger"
    >
        <span>{{ error_count }}</span>
        <span>error{{ "s" if error_count != 1 else "" }}</span>
    </span>
    {% if include_deploy %}
    <span class="text-admin-muted-foreground">·</span>
    <span class="text-admin-muted-foreground">including deploy</span>
    {% endif %}
</div>

{# Column header — only structural rule on the page. #}
<div class="grid grid-cols-[1fr_6rem] items-baseline gap-3 pb-2 mb-px border-b border-admin-border font-mono text-xs uppercase tracking-widest text-admin-foreground font-semibold">
    <span>Check</span>
    <span class="text-right">Status</span>
</div>

{# Audit rows. Issues are rare; when present they're always visible —
   no expand/collapse. Continuation marked by indent + left rule. #}
<ul role="list" class="divide-y divide-admin-border">
    {% for check in checks %}
    {% if check.status == "passed" %}
    <li class="grid grid-cols-[1fr_6rem] items-baseline gap-3 py-2.5">
        <span class="font-mono text-sm text-admin-foreground truncate min-w-0">{{ tiered_split(check.name) }}</span>
        <span class="font-mono text-xs text-admin-success tabular-nums text-right">ok</span>
    </li>
    {% else %}
    <li>
        <div class="grid grid-cols-[1fr_6rem] items-baseline gap-3 py-2.5">
            <span class="font-mono text-sm font-medium text-admin-foreground truncate min-w-0">{{ tiered_split(check.name) }}</span>
            <span
                data-status="{{ check.status }}"
                class="font-mono text-xs tabular-nums text-right data-[status=error]:text-admin-danger data-[status=warning]:text-admin-warning"
            >
                {{ check.issues|length }} {{ "error" if check.status == "error" else "warning" }}{{ "s" if check.issues|length != 1 else "" }}
            </span>
        </div>
        <dl class="pt-1 pb-3 pl-4 space-y-2.5 text-sm">
            {% for issue in check.issues %}
            <div class="space-y-1">
                <dt
                    data-warning="{{ issue.warning }}"
                    class="font-mono text-xs tabular-nums data-[warning=True]:text-admin-warning data-[warning=False]:text-admin-danger"
                >{{ tiered_split(issue.id) }}</dt>
                <dd class="max-w-prose text-admin-foreground leading-relaxed">{{ issue.fix }}</dd>
            </div>
            {% endfor %}
        </dl>
    </li>
    {% endif %}
    {% endfor %}
</ul>

{% else %}
<div class="border-t border-admin-border py-10 text-center">
    <p class="text-sm text-admin-muted-foreground">No preflight checks registered</p>
</div>
{% endif %}

{% endblock %}