{% from "components.html" import pill %}
{% for row in audit_rows %}
    <tr class="runs-table__row audit-table__row{{ " audit-table__row--refused" if row.refused }}"
        tabindex="0"
        data-event="{{ row.id }}"
        hx-get="/audit/{{ row.id }}"
        hx-target="#overlay"
        hx-swap="innerHTML"
        hx-include="unset"
        hx-trigger="click, keyup[key=='Enter']">
        <td>
            <div class="audit-table__time">{{ row.time }}</div>
            <div class="audit-table__note">{{ row.age }}</div>
        </td>
        <td>
            <div class="audit-table__event{{ " audit-table__event--error" if row.error }}">{{ row.event }}</div>
            <div class="audit-table__note">{{ row.kind }}</div>
        </td>
        <td class="audit-table__actor">{{ row.actor }}</td>
        <td>{{ pill(row.source, "blue" if row.source == "runner" else "grey") }}</td>
        <td>
            <div class="audit-table__run{{ " audit-table__none" if not row.run_id }}">{{ row.run }}</div>
            <div class="audit-table__id">{{ row.run_note }}</div>
        </td>
        <td>
            <div class="audit-table__runner{{ " audit-table__none" if not row.runner_id }}">{{ row.runner }}</div>
            <div class="audit-table__id">{{ row.runner_note }}</div>
        </td>
        <td class="audit-table__data{{ " audit-table__data--error" if row.error }}">{{ row.data }}</td>
    </tr>
{% endfor %}