feat(admin): capture and surface the CSP report sample/detail (#69)

The /admin/stats Reports table showed type, path, directive, blocked, and
disposition but not the one field that names the offending Trusted Types
policy (or the blocked inline snippet): the CSP report's `sample`.

reports.ts only populated blob6 from `message`/`reason`, which CSP violation
bodies never carry — so the detail was being dropped at write time. Pick
`sample` (Reporting API) / `script-sample` (legacy csp-report) as a fallback,
and add a "detail" column to the dashboard's recent-reports table so the
policy name shows up. Privacy policy updated to disclose the new field.

Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: jdevalk

functions/admin/stats.ts

@@ -181,7 +181,7 @@ export const onRequest: PagesFunction<Env> = async (context) => {
       GROUP BY directive ORDER BY count DESC LIMIT 50
     `,
     report_recent: `
-      SELECT timestamp AS time, index1 AS type, blob2 AS path, blob3 AS directive, blob4 AS blocked, blob5 AS disposition
+      SELECT timestamp AS time, index1 AS type, blob2 AS path, blob3 AS directive, blob4 AS blocked, blob5 AS disposition, blob6 AS detail
       FROM ${REPORT}
       WHERE ${REPORT_FIRST_PARTY} AND timestamp > NOW() - INTERVAL '30' DAY
       ORDER BY time DESC LIMIT 100
@@ -853,13 +853,22 @@ function renderDashboard(results: QueryResults, errors: QueryErrors): string {
     </div>
     <div id="report-recent-table">
       ${renderTable(
-        ["time", "type", "path", "directive", "blocked", "disposition"],
+        [
+          "time",
+          "type",
+          "path",
+          "directive",
+          "blocked",
+          "disposition",
+          "detail",
+        ],
         rowsOrEmpty(results.report_recent),
         {
           formatters: {
             time: (v) => esc(String(v).slice(5, 16)),
             path: (v) => `<span class="path">${esc(v)}</span>`,
             blocked: (v) => `<span class="path">${esc(v)}</span>`,
+            detail: (v) => `<span class="path">${esc(v)}</span>`,
           },
         },
       )}

functions/reports.ts

@@ -124,7 +124,14 @@ function writeReport(
     pick(body, "blockedURL", "blocked-uri", "sourceFile", "source-file"),
   );
   const disposition = trunc(pick(body, "disposition"), 16);
-  const message = trunc(pick(body, "message", "reason"));
+  // Deprecation/intervention/crash reports carry a human `message`/`reason`.
+  // CSP violations don't — their detail rides in `sample` (camelCase, Reporting
+  // API) or `script-sample` (kebab, legacy csp-report): the rejected Trusted
+  // Types policy name, or the first ~40 chars of the blocked inline content.
+  // Browsers cap `sample` themselves; keep whichever field is present.
+  const message = trunc(
+    pick(body, "message", "reason", "sample", "script-sample"),
+  );
   const ua = trunc(r.user_agent || reqUA, 200);
 
   dataset.writeDataPoint({
@@ -134,7 +141,7 @@ function writeReport(
       directive, // blob3
       blocked, // blob4
       disposition, // blob5
-      message, // blob6
+      message, // blob6 — message/reason, or CSP sample (policy name / blocked snippet)
       country, // blob7
       ua, // blob8
     ],

src/pages/privacy.astro

@@ -2,7 +2,7 @@
 import BaseLayout from "~/layouts/BaseLayout.astro";
 import Breadcrumbs from "~/components/Breadcrumbs.astro";
 
-const updated = "2026-06-16";
+const updated = "2026-06-29";
 ---
 
 <BaseLayout
@@ -165,10 +165,11 @@ const updated = "2026-06-16";
           >, so your browser may POST a structured report when a page violates a
           security policy (for example a Content Security Policy block) or uses
           a deprecated browser feature. We record the report type, the path it
-          occurred on, the directive or feature involved, and the User-Agent
-          (truncated). This fires only on a policy violation — never on an
-          ordinary page view — and carries no cookie, no identifier, and no IP
-          address.
+          occurred on, the directive or feature involved, a short detail sample
+          the browser provides (such as the rejected policy name or a truncated
+          snippet of the blocked content), and the User-Agent (truncated). This
+          fires only on a policy violation — never on an ordinary page view —
+          and carries no cookie, no identifier, and no IP address.
         </li>
       </ul>
       <p>