bvandeusenandClaude Opus 5.5
477b05b9d0
#5094 "Status and layout macros, and form classes". - formatting.STATES: one state -> (tone, label) map for up, down, stale, firing, pending, acknowledged, no_data, ok, warn, crit, resolved and inactive; status_info() reads it (an unmapped state is drawn dim under its own name). required() lets a macro refuse a missing argument. - _macros.html: status_badge and status_dot (a dot always carries its label, sr-only unless shown), stat_tile, empty_state, page_header (actions via a call block) and icon_button, which raises without a label. - steward.css: tone classes (badge-/dot-/stat- ok, warn, crit, info, dim), .sr-only, .page-header, .stat-tile, .empty-state, .btn-icon and the form classes .field, .field-label, .field-hint and .input. Info text is a 40% mix (--blue): the house --fs-info-fg falls to 4.18:1 on its tint over a hovered row, 40% holds 5.09:1. - First users: the Alerts list, history and maintenance pages (headers, state badges, empty states) and the alert forms' hints; the inline inp/lbl style sets on the monitor and host forms become .input / .field-label. - tests/core/test_macros.py renders each macro through the app environment. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
73 lines
3.2 KiB
HTML
73 lines
3.2 KiB
HTML
{# alerts/_history_rows.html — the history table; swapped in on a range or rule change #}
|
|
{% from "_macros.html" import status_badge, empty_state %}
|
|
{% if events %}
|
|
<div class="card-flush" style="overflow-x:auto;">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>When (UTC)</th>
|
|
<th>Rule</th>
|
|
<th>Change</th>
|
|
<th>Value</th>
|
|
<th>Notified</th>
|
|
<th>Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for ev in events %}
|
|
<tr>
|
|
<td style="font-family:ui-monospace,monospace;font-size:0.82rem;white-space:nowrap;">
|
|
{{ ev.at.strftime("%Y-%m-%d %H:%M:%S") }}
|
|
</td>
|
|
<td>
|
|
<a href="/alerts/history?rule={{ ev.rule.id }}&range={{ current_range }}">{{ ev.rule.name }}</a>
|
|
<div style="font-size:0.78rem;color:var(--text-dim);">{{ ev.rule.source_module }}/{{ ev.rule.resource_name }}</div>
|
|
</td>
|
|
<td style="white-space:nowrap;">
|
|
{{ status_badge(ev.from_state) }}
|
|
<span style="color:var(--text-dim);">→</span>
|
|
{{ status_badge(ev.to_state) }}
|
|
{% for n in ev.notes %}
|
|
<div style="font-size:0.78rem;color:var(--text-muted);margin-top:0.25rem;white-space:normal;">{{ n }}</div>
|
|
{% endfor %}
|
|
</td>
|
|
<td style="font-family:ui-monospace,monospace;font-size:0.85rem;white-space:nowrap;">
|
|
{{ ev.rule.metric_name }} = {{ ev.value }}
|
|
<div style="font-size:0.75rem;color:var(--text-dim);">rule: {{ ev.condition }}</div>
|
|
</td>
|
|
<td style="font-size:0.82rem;">
|
|
{% if ev.muted_by %}
|
|
<span class="badge badge-yellow" title="A maintenance window muted this notification">muted · {{ ev.muted_by }}</span>
|
|
{% if ev.released %}<div style="color:var(--text-muted);margin-top:0.25rem;">notified when the window ended</div>{% endif %}
|
|
{% endif %}
|
|
{% for label, sent, error in ev.deliveries %}
|
|
<div style="margin-top:0.15rem;">
|
|
{% if sent %}
|
|
<span class="badge badge-green">{{ label }} sent</span>
|
|
{% else %}
|
|
<span class="badge badge-red">{{ label }} failed</span>
|
|
{% if error %}<div style="color:var(--text-muted);font-size:0.78rem;margin-top:0.15rem;max-width:28rem;word-break:break-word;">{{ error }}</div>{% endif %}
|
|
{% endif %}
|
|
</div>
|
|
{% endfor %}
|
|
{% if not ev.muted_by and not ev.deliveries %}<span style="color:var(--text-dim);" title="No notification was sent for this change">—</span>{% endif %}
|
|
</td>
|
|
<td style="font-size:0.82rem;">
|
|
{% if ev.ansible_run_id %}
|
|
<a href="/ansible/runs/{{ ev.ansible_run_id }}">Ansible run</a>
|
|
{% else %}<span style="color:var(--text-dim);">—</span>{% endif %}
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% if truncated %}
|
|
<p style="color:var(--text-muted);font-size:0.82rem;margin-top:0.75rem;">
|
|
Showing the newest {{ limit }}. Pick a shorter range or one rule to see the rest.
|
|
</p>
|
|
{% endif %}
|
|
{% else %}
|
|
<div class="card">{{ empty_state("No alert changed state in the last " ~ current_range ~ ((" for " ~ chosen.name) if chosen else "") ~ ".") }}</div>
|
|
{% endif %}
|