{% extends "admin/_base.html" %}
{% block content %}
<header class="rio-page-header">
<nav class="rio-breadcrumbs">
<a href="/admin">Home</a> ·
<a href="/admin/{{ admin_name }}">{{ display_name }}</a> ·
<a href="/admin/{{ admin_name }}/{{ object_id }}/edit">{{ object_label }}</a> ·
<span>History</span>
</nav>
<h1>{{ page_title }}</h1>
<p class="rio-page-header__lead">Every recorded mutation to this row, newest first.</p>
</header>
<section class="rio-card rio-card--quiet rio-list">
{% if history_entries %}
<table class="rio-table rio-table--striped">
<thead><tr><th>When</th><th>Action</th><th>By</th><th>Summary</th><th>IP</th></tr></thead>
<tbody>
{% for e in history_entries %}
{% if e.is_new_day %}
<tr class="rio-history-date-divider"><th colspan="5" scope="rowgroup">{{ e.date_iso }}</th></tr>
{% endif %}
<tr>
<td title="{{ e.timestamp_iso }}">{{ e.when_relative }}</td>
<td><span class="rio-pill rio-pill--{{ e.pill_class }}">{{ e.label }}</span></td>
<td>{{ e.user_email }}</td>
<td>
{{ e.summary }}
{% if e.changes %}
<dl class="rio-history-diff" aria-label="Changed fields">
{% for c in e.changes %}
<div class="rio-history-diff__row" data-field="{{ c.field }}">
<dt class="rio-history-diff__label">{{ c.label }}</dt>
<dd class="rio-history-diff__value rio-history-diff__value--from">
{% if c.from %}<span class="rio-history-diff__old">{{ c.from }}</span>{% else %}<span class="rio-meta">—</span>{% endif %}
</dd>
<dd class="rio-history-diff__arrow" aria-hidden="true">→</dd>
<dd class="rio-history-diff__value rio-history-diff__value--to">
{% if c.to %}<span class="rio-history-diff__new">{{ c.to }}</span>{% else %}<span class="rio-meta">—</span>{% endif %}
</dd>
</div>
{% endfor %}
</dl>
{% endif %}
</td>
<td>{{ e.ip_address }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<div class="rio-empty-state">
<div class="rio-empty-state__icon">{{ icon("clock", class="rio-icon") }}</div>
<h3 class="rio-empty-state__title">No history yet for this row</h3>
<p class="rio-empty-state__lead">
Edits and deletes appear here automatically as they happen.
</p>
</div>
{% endif %}
</section>
{% endblock %}