{% extends "layouts/dashboard.html" %}
{% load ui_tags %}
{% block breadcrumbs %}
  {% url 'core:dashboard' as dashboard_url %}
  {% crumb_trail "Dashboard" dashboard_url "Audit log" "" as breadcrumbs %}
  {% include "components/breadcrumbs.html" %}
{% endblock %}
{% block content %}
{% include "components/page_header.html" with title="Audit log" subtitle="Read-only audit trail across grants, finance, projects and operations (PRD NFRFA011)." eyebrow="Governance" description_heading="Trace who did what across the platform without leaving RIMS." description="Every status transition, approval, edit, and export across grants, finance, projects, and operations is recorded here. Use the filters below to scope by actor, action, model, or date range when investigating a specific incident." %}

{% if ai_audit_watchdog %}
<div class="mb-5">
  {% include "components/ai_callout.html" with label=ai_audit_watchdog.label summary=ai_audit_watchdog.summary footnote=ai_audit_watchdog.footnote available=ai_audit_watchdog.available %}
</div>
{% endif %}

<form method="get" class="card mb-5 p-4">
  <div class="filter-form">
    <div class="filter-field">
      <label for="audit-actor" class="filter-field__label">Actor email</label>
      <input id="audit-actor" name="actor" value="{{ filter_values.actor }}" placeholder="user@example.com" class="filter-field__input">
    </div>
    <div class="filter-field">
      <label for="audit-action" class="filter-field__label">Action</label>
      <input id="audit-action" name="action" value="{{ filter_values.action }}" placeholder="approve, reject…" class="filter-field__input">
    </div>
    <div class="filter-field">
      <label for="audit-app" class="filter-field__label">App</label>
      <input id="audit-app" name="target_app" value="{{ filter_values.target_app }}" placeholder="rims_grants" class="filter-field__input">
    </div>
    <div class="filter-field">
      <label for="audit-model" class="filter-field__label">Model</label>
      <input id="audit-model" name="target_model" value="{{ filter_values.target_model }}" placeholder="Application" class="filter-field__input">
    </div>
    <div class="filter-field">
      <label for="audit-from" class="filter-field__label">From</label>
      <input id="audit-from" type="date" name="date_from" value="{{ filter_values.date_from }}" class="filter-field__input">
    </div>
    <div class="filter-field">
      <label for="audit-to" class="filter-field__label">To</label>
      <input id="audit-to" type="date" name="date_to" value="{{ filter_values.date_to }}" class="filter-field__input">
    </div>
    <div class="filter-form__actions gap-2">
      {% include "components/export_button.html" %}
      <a href="{% url 'rims_operations:audit_log' %}" class="btn-secondary btn--sm">Reset</a>
      <button type="submit" class="btn-primary btn--sm">Filter</button>
    </div>
  </div>
</form>

<div class="card">
  <div class="hidden md:block overflow-x-auto">
    <table class="data-table">
      <thead>
        <tr>
          {% include "components/sortable_th.html" with key="when" label="When" %}
          {% include "components/sortable_th.html" with key="actor" label="Actor" %}
          {% include "components/sortable_th.html" with key="action" label="Action" %}
          {% include "components/sortable_th.html" with key="target" label="Target" %}
          <th>Object</th>
          <th>Changes</th>
        </tr>
      </thead>
      <tbody>
        {% for r in rows %}
        <tr class="align-top">
          <td class="whitespace-nowrap text-xs text-ruforum-text-muted">{{ r.timestamp|date:"j M Y H:i" }}</td>
          <td class="text-xs">{{ r.actor.email|default:"—" }}</td>
          <td class="text-xs"><span class="badge badge-neutral">{{ r.action }}</span></td>
          <td class="text-xs">{{ r.target_app }}.{{ r.target_model }}</td>
          <td class="text-xs">{{ r.object_repr|truncatechars:60 }}</td>
          <td class="text-xs"><pre class="text-[11px] whitespace-pre-wrap text-ruforum-text-muted max-w-md">{{ r.changes|default_if_none:""|stringformat:"s"|truncatechars:200 }}</pre></td>
        </tr>
        {% empty %}
        <tr>
          <td colspan="6" class="p-6">
            {% include "components/empty_state.html" with heading="No audit rows match these filters" subtext="Widen the date range or clear the actor and model filters to surface more activity. The audit log captures every state change to RIMS records and is retained for the full statutory window." %}
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  <ol class="md:hidden timeline px-4 py-4">
    {% for r in rows %}
    <li class="timeline-node">
      <p class="font-meta text-[10px] uppercase tracking-widest text-ruforum-text-muted">{{ r.timestamp|date:"j M Y H:i" }}</p>
      <p class="mt-1 font-display text-sm font-semibold text-ruforum-text">{{ r.action }}</p>
      <p class="mt-0.5 text-xs text-ruforum-text-muted">{{ r.actor.email|default:"system" }} · {{ r.target_app }}.{{ r.target_model }}</p>
      {% if r.object_repr %}<p class="mt-0.5 text-xs text-ruforum-text break-all">{{ r.object_repr|truncatechars:80 }}</p>{% endif %}
      {% if r.changes %}<pre class="mt-1 whitespace-pre-wrap text-[10px] text-ruforum-text-muted">{{ r.changes|default_if_none:""|stringformat:"s"|truncatechars:140 }}</pre>{% endif %}
    </li>
    {% empty %}
    <li class="px-1 py-2">
      {% include "components/empty_state.html" with heading="No audit rows match these filters" subtext="Widen the date range or clear the actor and model filters to surface more activity. The audit log captures every state change to RIMS records and is retained for the full statutory window." %}
    </li>
    {% endfor %}
  </ol>
</div>

{% include "components/pagination.html" %}
{% endblock %}