feat(audit): clickable column headers with asc/desc sort

web/templates/pages/audit.html

@@ -26,7 +26,7 @@
       {{/* Export carries the current filter querystring so the
            download is exactly what the operator sees on screen
            (up to a higher row cap of 5000 vs 500 in the table). */}}
-      <a href="/audit.csv?range={{$rng}}{{if $filter.UserID}}&user_id={{$filter.UserID}}{{end}}{{if $filter.Actor}}&actor={{$filter.Actor}}{{end}}{{if $filter.ActionLike}}&action={{$filter.ActionLike}}{{end}}{{if $filter.TargetKind}}&target_kind={{$filter.TargetKind}}{{end}}"
+      <a href="{{$page.CSVHref}}"
          class="btn"
          title="Download the current filter as CSV (up to 5000 rows, UTF-8, RFC 4180)">
         Export CSV ↓
@@ -109,12 +109,31 @@
   {{/* table */}}
   <div class="panel mt-3.5 rounded-[7px] overflow-hidden">
 
+    {{/* Header — every column except the payload one is a clickable
+         sort link. Hrefs are pre-built server-side ($page.SortHrefs)
+         so the URL escaping rules don't trip on the '=' chars when
+         html/template encodes <a href> attributes. */}}
     <div class="audit-row head">
-      <div>When</div>
-      <div>Actor</div>
-      <div>User</div>
-      <div>Action</div>
-      <div>Target</div>
+      <div>
+        <a href="{{index $page.SortHrefs "ts"}}"
+           class="sort-header">When <span class="sort-glyph">{{sortGlyph "ts" $page.Sort $page.Dir}}</span></a>
+      </div>
+      <div>
+        <a href="{{index $page.SortHrefs "actor"}}"
+           class="sort-header">Actor <span class="sort-glyph">{{sortGlyph "actor" $page.Sort $page.Dir}}</span></a>
+      </div>
+      <div>
+        <a href="{{index $page.SortHrefs "user_id"}}"
+           class="sort-header">User <span class="sort-glyph">{{sortGlyph "user_id" $page.Sort $page.Dir}}</span></a>
+      </div>
+      <div>
+        <a href="{{index $page.SortHrefs "action"}}"
+           class="sort-header">Action <span class="sort-glyph">{{sortGlyph "action" $page.Sort $page.Dir}}</span></a>
+      </div>
+      <div>
+        <a href="{{index $page.SortHrefs "target_kind"}}"
+           class="sort-header">Target <span class="sort-glyph">{{sortGlyph "target_kind" $page.Sort $page.Dir}}</span></a>
+      </div>
       <div></div>
     </div>