superlocalmemory 3.8.13 → 4.0.0

package/src/superlocalmemory/ui/js/od-compliance-ext.js

@@ -0,0 +1,301 @@
+// od-compliance-ext.js — Compliance tab extensions v1.0
+// Extends the OD Operations compliance pane with:
+//   Task A: Entity-level GDPR erasure (POST /api/compliance/gdpr/erase-entity)
+//   Task B: Erasure Receipts panel (GET /api/compliance/receipts + verify)
+//
+// This module hooks into odRenderOperations by patching window.odRenderOperations
+// to inject the new panels into the compliance tab after the base render.
+//
+// Security: all user-supplied strings go through esc() before innerHTML insertion.
+//           Confirm guard on entity erase (typed confirmation + confirmDestructive).
+//
+// Copyright (c) 2026 Varun Pratap Bhardwaj / Qualixar — AGPL-3.0
+
+/* global window, document, fetch, Promise */
+(function () {
+  'use strict';
+
+  // ─── Helpers ──────────────────────────────────────────────────────────────
+
+  function esc(s) {
+    return String(s == null ? '' : s)
+      .replace(/&/g, '&')
+      .replace(/</g, '&lt;')
+      .replace(/>/g, '&gt;')
+      .replace(/"/g, '&quot;')
+      .replace(/'/g, '&#39;');
+  }
+
+  function fmtTime(ts) {
+    if (!ts) return '—';
+    try {
+      var d = typeof ts === 'number' ? new Date(ts * 1000) : new Date(ts);
+      return d.toLocaleString();
+    } catch (e) { return String(ts); }
+  }
+
+  // ─── Task A: Entity Erase Card ────────────────────────────────────────────
+
+  var ENTITY_ERASE_ID = 'od-entity-erase-card';
+
+  function buildEntityEraseCard() {
+    var card = document.createElement('div');
+    card.id = ENTITY_ERASE_ID;
+    card.className = 'card';
+    card.style.marginTop = '16px';
+    // Using textContent / controlled HTML (only static strings + esc'd values below)
+    card.innerHTML =
+      '<div class="card-head">' +
+        '<h3>Entity-level GDPR erasure</h3>' +
+      '</div>' +
+      '<div class="card-pad">' +
+        '<p class="muted" style="font-size:13px" id="od-entity-erase-summary">' +
+          'Erase all facts mentioning a specific named entity (GDPR Art. 17). ' +
+          'Enter the entity name exactly; you will need to confirm it. This is IRREVERSIBLE.' +
+        '</p>' +
+        '<div style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px">' +
+          '<input id="od-entity-erase-input" type="text" maxlength="200" ' +
+            'placeholder="Entity name…" ' +
+            'style="flex:1;min-width:180px;padding:7px 10px;border-radius:8px;' +
+              'border:1px solid var(--border);background:var(--card);color:var(--fg);font-size:13px">' +
+          '<button id="od-entity-erase-btn" class="btn sm" ' +
+            'style="border-color:#ff6b6b;color:#ff6b6b">Erase entity…</button>' +
+        '</div>' +
+      '</div>';
+    return card;
+  }
+
+  function wireEntityEraseCard() {
+    var btn     = document.getElementById('od-entity-erase-btn');
+    var input   = document.getElementById('od-entity-erase-input');
+    var summary = document.getElementById('od-entity-erase-summary');
+    if (!btn || !input) return;
+
+    btn.addEventListener('click', function () {
+      var entityName = (input.value || '').trim();
+      if (!entityName) {
+        if (summary) summary.textContent = 'Enter an entity name first.';
+        return;
+      }
+      // Step 1: typed-confirmation prompt (same guard as profile erase)
+      var typed = window.prompt(
+        'This PERMANENTLY erases all facts mentioning entity "' + entityName + '".\n' +
+        'This cannot be undone.\n\nType the entity name to confirm:'
+      );
+      if (typed === null) return; // cancelled
+      if (typed !== entityName) {
+        if (summary) summary.textContent = 'Erase cancelled — name did not match.';
+        return;
+      }
+      // Step 2: confirmDestructive modal
+      window.confirmDestructive({
+        title: 'Erase entity',
+        target: entityName,
+        consequence: 'All facts mentioning this entity will be permanently erased.',
+        confirmLabel: 'Erase entity',
+      }).then(function (confirmed) {
+        if (!confirmed) return;
+        btn.disabled = true;
+        btn.textContent = 'Erasing…';
+        if (summary) summary.textContent = 'Erasing entity "' + esc(entityName) + '"…';
+        fetch('/api/compliance/gdpr/erase-entity', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ entity_name: entityName, confirm: entityName }),
+        })
+          .then(function (r) { return r.json(); })
+          .then(function (d) {
+            if (!summary) return;
+            if (d && d.success) {
+              var parts = [];
+              if (d.facts != null)   parts.push('facts erased: ' + d.facts);
+              if (d.entity != null)  parts.push('entity: ' + esc(String(d.entity)));
+              summary.textContent = 'Entity erased — ' + (parts.join(', ') || 'done') + '.';
+              input.value = '';
+              // Reload receipts panel to reflect new receipt
+              loadReceiptsPanel();
+            } else {
+              summary.textContent = 'Erase failed: ' + esc(String((d && d.error) || 'unknown'));
+            }
+          })
+          .catch(function () {
+            if (summary) summary.textContent = 'Erase request failed. Check console.';
+          })
+          .finally(function () {
+            btn.disabled = false;
+            btn.textContent = 'Erase entity…';
+          });
+      });
+    });
+  }
+
+  // ─── Task B: Erasure Receipts Panel ───────────────────────────────────────
+
+  var RECEIPTS_ID = 'od-receipts-card';
+
+  function buildReceiptsCard() {
+    var card = document.createElement('div');
+    card.id = RECEIPTS_ID;
+    card.className = 'card';
+    card.style.marginTop = '16px';
+    card.innerHTML =
+      '<div class="card-head">' +
+        '<h3>Erasure receipts</h3>' +
+        '<div class="spacer"></div>' +
+        '<button class="btn sm" id="od-receipts-refresh-btn">Refresh</button>' +
+      '</div>' +
+      '<div class="card-pad">' +
+        '<table class="tbl" id="od-receipts-tbl">' +
+          '<thead><tr>' +
+            '<th>ID</th>' +
+            '<th>Type</th>' +
+            '<th>Subject</th>' +
+            '<th>State</th>' +
+            '<th>Facts</th>' +
+            '<th>Requested</th>' +
+            '<th></th>' +
+          '</tr></thead>' +
+          '<tbody id="od-receipts-body">' +
+            '<tr><td colspan="7" class="dim" style="text-align:center;padding:20px">Loading…</td></tr>' +
+          '</tbody>' +
+        '</table>' +
+      '</div>';
+    return card;
+  }
+
+  function loadReceiptsPanel() {
+    var tbody = document.getElementById('od-receipts-body');
+    if (!tbody) return;
+    tbody.innerHTML = '<tr><td colspan="7" class="dim" style="text-align:center;padding:16px">Loading…</td></tr>';
+    fetch('/api/compliance/receipts?limit=50')
+      .then(function (r) { return r.ok ? r.json() : null; })
+      .then(function (d) {
+        if (!d || !d.available) {
+          tbody.innerHTML = '<tr><td colspan="7" class="dim" style="text-align:center;padding:16px">Receipts unavailable.</td></tr>';
+          return;
+        }
+        var receipts = d.receipts || [];
+        if (receipts.length === 0) {
+          tbody.innerHTML = '<tr><td colspan="7" class="dim" style="text-align:center;padding:16px">No erasure receipts yet.</td></tr>';
+          return;
+        }
+        tbody.innerHTML = receipts.map(function (r) {
+          var shortId = esc(String(r.erasure_id || '').slice(0, 8)) + '…';
+          var stateClass = r.state === 'COMPLETE' ? 'ok' : 'danger';
+          var allOk = r.all_erased ? '<span class="badge ok">all erased</span>' : '<span class="badge warn">partial</span>';
+          return (
+            '<tr>' +
+              '<td class="mono dim" style="font-size:11px" title="' + esc(r.erasure_id || '') + '">' + shortId + '</td>' +
+              '<td><span class="badge neutral">' + esc(r.subject_type || '') + '</span></td>' +
+              '<td class="dim" style="font-size:12px;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' +
+                esc(r.subject_id || '') +
+              '</td>' +
+              '<td><span class="badge ' + stateClass + '">' + esc(r.state || '') + '</span></td>' +
+              '<td class="num dim">' + esc(String(r.fact_count || 0)) + '</td>' +
+              '<td class="dim" style="font-size:11px">' + esc(fmtTime(r.requested_at)) + '</td>' +
+              '<td><button class="btn sm ghost" data-verify-id="' + esc(r.erasure_id || '') + '">Verify</button></td>' +
+            '</tr>'
+          );
+        }).join('');
+        // Wire verify buttons
+        tbody.querySelectorAll('[data-verify-id]').forEach(function (btn) {
+          btn.addEventListener('click', function () {
+            var eid = btn.getAttribute('data-verify-id');
+            btn.disabled = true;
+            btn.textContent = '…';
+            fetch('/api/compliance/receipts/' + encodeURIComponent(eid) + '/verify')
+              .then(function (r) { return r.ok ? r.json() : null; })
+              .then(function (d) {
+                if (d && d.verified === true) {
+                  btn.textContent = 'Verified ✓';
+                  btn.style.color = 'var(--ok)';
+                } else if (d && d.verified === false) {
+                  btn.textContent = 'Tampered!';
+                  btn.style.color = 'var(--danger)';
+                } else {
+                  btn.textContent = 'Error';
+                }
+                btn.disabled = false;
+              })
+              .catch(function () { btn.textContent = 'Error'; btn.disabled = false; });
+          });
+        });
+      })
+      .catch(function () {
+        var tb = document.getElementById('od-receipts-body');
+        if (tb) tb.innerHTML = '<tr><td colspan="7" class="dim" style="text-align:center;padding:16px">Failed to load receipts.</td></tr>';
+      });
+  }
+
+  function wireReceiptsPanel() {
+    var refreshBtn = document.getElementById('od-receipts-refresh-btn');
+    if (refreshBtn) {
+      refreshBtn.addEventListener('click', loadReceiptsPanel);
+    }
+    loadReceiptsPanel();
+  }
+
+  // ─── Injection Hook ───────────────────────────────────────────────────────
+
+  /**
+   * Inject the two new panels into the compliance tab section.
+   * Called after odRenderOperations() has built and populated the DOM.
+   */
+  function injectCompliancePanels(container) {
+    // Find the compliance tabpane
+    var pane = container && container.querySelector('[data-od-pane="compliance"]');
+    if (!pane) return;
+
+    // Remove any stale injected panels from a previous render
+    var oldErase = pane.querySelector('#' + ENTITY_ERASE_ID);
+    if (oldErase) oldErase.remove();
+    var oldReceipts = pane.querySelector('#' + RECEIPTS_ID);
+    if (oldReceipts) oldReceipts.remove();
+
+    // Append the two new cards at the bottom of the compliance tab
+    pane.appendChild(buildEntityEraseCard());
+    pane.appendChild(buildReceiptsCard());
+
+    // Wire interactions
+    wireEntityEraseCard();
+    wireReceiptsPanel();
+  }
+
+  // ─── Patch odRenderOperations ─────────────────────────────────────────────
+
+  /**
+   * Wait for od-operations.js to define window.odRenderOperations, then wrap it
+   * so our panels are injected after every render. Uses polling with a cap —
+   * no unbounded loops.
+   */
+  function patchOdRenderOperations() {
+    var base = window.odRenderOperations;
+    if (typeof base !== 'function') return false;
+    window.odRenderOperations = function (container) {
+      base(container);
+      // od-operations.js renders asynchronously (Promise.all inside).
+      // Give it time to populate the DOM before injecting our panels.
+      setTimeout(function () { injectCompliancePanels(container); }, 600);
+    };
+    return true;
+  }
+
+  // Retry for up to 3s in case od-operations.js hasn't defined the function yet.
+  var _attempts = 0;
+  function tryPatch() {
+    if (patchOdRenderOperations()) return;
+    _attempts += 1;
+    if (_attempts < 30) setTimeout(tryPatch, 100);
+  }
+
+  // Also inject into the currently active operations pane on DOMContentLoaded
+  document.addEventListener('DOMContentLoaded', function () {
+    tryPatch();
+    // If the operations pane is already in the DOM and populated, inject now
+    var pane = document.getElementById('operations-pane');
+    if (pane && pane.querySelector('[data-od-pane="compliance"]')) {
+      injectCompliancePanels(pane);
+    }
+  });
+
+}());

package/src/superlocalmemory/ui/js/od-operations.js

@@ -403,11 +403,24 @@
           '</div>' +
         '</div>' +
 
-        // Audit trail with All/Denied segment filter
+        // Audit trail with All/Denied segment filter + event-type API filter
         '<div class="card" style="margin-top:16px">' +
           '<div class="card-head">' +
             '<h3>Audit trail</h3>' +
+            // Task C: chain-integrity badge
+            '<span id="od-audit-chain-status"></span>' +
             '<div class="spacer"></div>' +
+            // Task C: event-type filter select (calls API)
+            '<select id="od-audit-evt-filter" style="padding:4px 8px;border-radius:6px;' +
+              'border:1px solid var(--border);background:var(--card);color:var(--fg);font-size:12px">' +
+              '<option value="">All types</option>' +
+              '<option value="recall">recall</option>' +
+              '<option value="remember">remember</option>' +
+              '<option value="delete">delete</option>' +
+              '<option value="lifecycle_transition">lifecycle</option>' +
+              '<option value="access_denied">access_denied</option>' +
+              '<option value="retention_enforced">retention</option>' +
+            '</select>' +
             '<div class="seg" id="od-audit-filter">' +
               '<button class="active" data-filter="all">All</button>' +
               '<button data-filter="denied">Denied</button>' +
@@ -675,8 +688,14 @@
 
     if (applyBtn) {
       applyBtn.addEventListener('click', function () {
-        if (!window.confirm('This will transition memories to lower lifecycle states. Continue?')) return;
-        applyBtn.disabled = true;
+        window.confirmDestructive({
+          title: 'Apply compaction',
+          target: 'All eligible memories',
+          consequence: 'Transitions memories to lower lifecycle states.',
+          confirmLabel: 'Apply',
+        }).then(function(confirmed) {
+          if (!confirmed) return;
+          applyBtn.disabled = true;
         applyBtn.textContent = 'Running…';
 
         fetch('/api/lifecycle/compact', {
@@ -708,6 +727,7 @@
             applyBtn.disabled = false;
             applyBtn.textContent = 'Apply compaction';
           });
+        });
       });
     }
   }
@@ -722,10 +742,14 @@
     var summary = document.getElementById('od-restart-summary');
     if (!btn) return;
     btn.addEventListener('click', function () {
-      if (!window.confirm(
-        'Restart the memory daemon now? It will be unavailable for a few ' +
-        'seconds. Your memories are not affected.')) return;
-      btn.disabled = true;
+      window.confirmDestructive({
+        title: 'Restart memory daemon',
+        target: 'Memory daemon',
+        consequence: 'Will be unavailable for a few seconds. Your memories are not affected.',
+        confirmLabel: 'Restart',
+      }).then(function(confirmed) {
+        if (!confirmed) return;
+        btn.disabled = true;
       btn.textContent = 'Restarting…';
       if (summary) summary.textContent = 'Restart requested — waiting for the daemon to come back…';
 
@@ -782,6 +806,7 @@
             if (tries > 30) { clearInterval(poll); btn.disabled = false; btn.textContent = 'Restart daemon'; }
           }, 1000);
         });
+      });
     });
   }
 
@@ -903,40 +928,81 @@
 
     var ACTION_CLS = { archive: 'neutral', tombstone: 'danger', notify: 'warn' };
 
+    // Build rows then wire delete buttons post-inject (avoids inline onclick — CSP safe)
     retTbody.innerHTML = policies.map(function (p) {
       var ac = ACTION_CLS[p.action] || 'neutral';
-      // CRIT(c): name, category, action through esc()
       return (
         '<tr>' +
           '<td><b>' + esc(p.name || '') + '</b></td>' +
           '<td class="num">' + esc(String(p.retention_days || '—')) + '</td>' +
           '<td><span class="badge neutral">' + esc(p.category || 'all') + '</span></td>' +
           '<td><span class="badge ' + ac + '">' + esc(p.action || '') + '</span></td>' +
+          // Task E: per-row delete — data-pol-name used by wireRetentionDeleteBtns()
           '<td style="text-align:right">' +
-            '<button class="btn sm ghost" disabled>Edit</button>' +
-            // TODO: wire edit button to /api/compliance/retention-policy PATCH when available
+            '<button class="btn sm danger" data-pol-name="' + esc(p.name || '') + '">' +
+              'Delete' +
+            '</button>' +
           '</td>' +
         '</tr>'
       );
     }).join('');
+
+    // Task E: wire delete buttons (CSP-safe addEventListener after innerHTML set)
+    wireRetentionDeleteBtns(retTbody);
   }
 
   // Cache of all audit rows (for client-side All/Denied filter)
   var _allAuditRows = [];
   /**
-   * Populate the audit trail table.
+   * Task C: Populate the audit trail table.
+   * auditFull: response from /api/compliance/audit (preferred, up to 100 events).
+   * comp: response from /api/compliance/status (fallback, recent_audit_events).
    * CRIT(c): actor, action, target, result all through esc().
    */
-  function populateAuditTrail(comp) {
+  function populateAuditTrail(comp, auditFull) {
     var auditTbody = document.getElementById('od-audit-body');
     if (!auditTbody) return;
 
-    var events = (comp && comp.recent_audit_events) || [];
+    // Prefer full audit endpoint data; fall back to status data
+    var events = (auditFull && auditFull.events) || (comp && comp.recent_audit_events) || [];
     _allAuditRows = events;
 
     renderAuditRows(auditTbody, events);
   }
 
+  /**
+   * Task C: Render the chain-integrity badge inside the audit trail card header.
+   * Appended to #od-audit-chain-status if it exists.
+   */
+  function showAuditChainStatus(auditFull) {
+    var el = document.getElementById('od-audit-chain-status');
+    if (!el || !auditFull) return;
+    var ok = auditFull.chain_verified !== false;
+    el.innerHTML = ok
+      ? '<span class="badge ok" style="margin-left:8px">Chain verified</span>'
+      : '<span class="badge danger" style="margin-left:8px">Chain integrity issue</span>';
+  }
+
+  /** Task C: re-fetch audit trail from API with a specific event_type filter. */
+  function fetchAndRenderAudit(eventType) {
+    var auditTbody = document.getElementById('od-audit-body');
+    if (!auditTbody) return;
+    auditTbody.innerHTML = '<tr><td colspan="6" class="dim" style="text-align:center;padding:16px">Loading…</td></tr>';
+    var url = '/api/compliance/audit?limit=100';
+    if (eventType && eventType !== 'all') url += '&event_type=' + encodeURIComponent(eventType);
+    fetch(url)
+      .then(function (r) { return r.ok ? r.json() : null; })
+      .then(function (d) {
+        if (!d) return;
+        _allAuditRows = d.events || [];
+        renderAuditRows(auditTbody, _allAuditRows);
+        showAuditChainStatus(d);
+      })
+      .catch(function () {
+        if (auditTbody) auditTbody.innerHTML = '<tr><td colspan="6" class="dim" style="text-align:center;padding:16px">Failed to load audit trail.</td></tr>';
+      });
+  }
+
   /** Render audit table rows into tbody, filtering by mode ('all' or 'denied'). */
   function renderAuditRows(tbody, events) {
     if (events.length === 0) {
@@ -974,14 +1040,16 @@
     }).join('');
   }
   /**
-   * Wire the All/Denied segment filter in the audit trail header.
-   * Client-side filter over already-fetched data — no extra network call.
+   * Task C: Wire audit filters.
+   * - All/Denied segment: client-side filter (fast).
+   * - Event-type select (#od-audit-evt-filter): calls API to get filtered results.
    */
-  function wireAuditFilter() {
+  function wireAuditFilter(auditFull) {
     var filterEl = document.getElementById('od-audit-filter');
     var tbody    = document.getElementById('od-audit-body');
     if (!filterEl || !tbody) return;
 
+    // All / Denied segment buttons — client-side
     filterEl.querySelectorAll('button').forEach(function (btn) {
       btn.addEventListener('click', function () {
         var mode = btn.getAttribute('data-filter');
@@ -1000,6 +1068,54 @@
         renderAuditRows(tbody, rows);
       });
     });
+
+    // Task C: Event-type select — re-fetches from API
+    var evtSelect = document.getElementById('od-audit-evt-filter');
+    if (evtSelect) {
+      evtSelect.addEventListener('change', function () {
+        fetchAndRenderAudit(evtSelect.value);
+      });
+    }
+  }
+
+  /**
+   * Task E: Wire delete buttons injected by populateRetentionPolicies.
+   * Data attribute data-pol-name carries the policy name (already esc'd in innerHTML).
+   * Uses confirmDestructive before calling DELETE /api/compliance/retention-policy?name=.
+   */
+  function wireRetentionDeleteBtns(tbody) {
+    tbody.querySelectorAll('[data-pol-name]').forEach(function (btn) {
+      btn.addEventListener('click', function () {
+        var policyName = btn.getAttribute('data-pol-name');
+        window.confirmDestructive({
+          title: 'Delete retention policy',
+          target: policyName,
+          consequence: 'This policy will no longer be enforced on any memory.',
+          confirmLabel: 'Delete',
+        }).then(function (confirmed) {
+          if (!confirmed) return;
+          btn.disabled = true;
+          fetch('/api/compliance/retention-policy?name=' + encodeURIComponent(policyName), {
+            method: 'DELETE',
+          })
+            .then(function (r) { return r.json(); })
+            .then(function (d) {
+              if (d && d.success !== false) {
+                var pane = document.getElementById('operations-pane');
+                if (pane && typeof window.odRenderOperations === 'function') {
+                  window.odRenderOperations(pane);
+                }
+              } else {
+                btn.disabled = false;
+                if (typeof console !== 'undefined') {
+                  console.error('[od-ops] retention delete failed:', d && d.error);
+                }
+              }
+            })
+            .catch(function () { btn.disabled = false; });
+        });
+      });
+    });
   }
 
   /**
@@ -1043,11 +1159,18 @@
         })
           .then(function (r) { return r.json(); })
           .then(function (d) {
-            if (summary) {
-              summary.textContent = d && d.success
-                ? ('Retention applied — archived ' + (d.archived || 0) +
-                   ', tombstoned ' + (d.tombstoned || 0) + ', flagged ' + (d.notified || 0) + '.')
-                : ('Retention failed: ' + ((d && d.error) || 'unknown'));
+            if (!summary) return;
+            // Task E: surface all returned counts from the enforce response
+            if (d && d.success) {
+              var parts = [];
+              if (d.archived != null)    parts.push('archived ' + fmtNum(d.archived));
+              if (d.tombstoned != null)  parts.push('tombstoned ' + fmtNum(d.tombstoned));
+              if (d.notified != null)    parts.push('flagged ' + fmtNum(d.notified));
+              if (d.evaluated != null)   parts.push('evaluated ' + fmtNum(d.evaluated));
+              if (d.policies_run != null) parts.push('policies run: ' + fmtNum(d.policies_run));
+              summary.textContent = 'Retention applied — ' + (parts.join(', ') || 'no changes needed') + '.';
+            } else {
+              summary.textContent = 'Retention failed: ' + ((d && d.error) || 'unknown');
             }
           })
           .catch(function () { if (summary) summary.textContent = 'Retention run failed. Check console.'; })
@@ -1216,10 +1339,13 @@
       fetch('/api/lifecycle/status').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
       fetch('/api/trust/stats').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
       fetch('/api/compliance/status').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
+      // Task C: wire the full audit trail endpoint (up to 100 events, chain_verified)
+      fetch('/api/compliance/audit?limit=100').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
     ]).then(function (results) {
       var lc         = results[0];
       var trustStats = results[1];
       var comp       = results[2];
+      var auditFull  = results[3]; // {available, events, chain_verified, ...}
 
       // Inject .ctl class styles (used by Trust section control rows)
       injectCtlStyle();
@@ -1243,10 +1369,15 @@
       // Populate compliance
       populateComplianceKpi(comp);
       populateRetentionPolicies(comp);
-      populateAuditTrail(comp);
+      // Task C: prefer the full audit trail from the dedicated endpoint;
+      // fall back to the status endpoint's recent_audit_events on failure.
+      populateAuditTrail(comp, auditFull);
+
+      // Task C: show chain-integrity indicator
+      showAuditChainStatus(auditFull);
 
       // Wire audit filter and new-policy button (listeners on injected DOM)
-      wireAuditFilter();
+      wireAuditFilter(auditFull);
       wireNewPolicyBtn();
       wireGdprBtns();