feat: PocketVeto v1.0.0 — initial public release

Self-hosted US Congress monitoring platform with AI policy briefs,
bill/member/topic follows, ntfy + RSS + email notifications,
alignment scoring, collections, and draft-letter generator.

Authored by: Jack Levy

frontend/components/bills/ActionTimeline.tsx

@@ -0,0 +1,68 @@
+import { Clock } from "lucide-react";
+import { BillAction } from "@/lib/types";
+import { formatDate } from "@/lib/utils";
+
+interface ActionTimelineProps {
+  actions: BillAction[];
+  latestActionDate?: string;
+  latestActionText?: string;
+}
+
+export function ActionTimeline({ actions, latestActionDate, latestActionText }: ActionTimelineProps) {
+  const hasActions = actions && actions.length > 0;
+  const hasFallback = !hasActions && latestActionText;
+
+  if (!hasActions && !hasFallback) {
+    return (
+      <div className="bg-card border border-border rounded-lg p-6">
+        <h2 className="font-semibold mb-3 flex items-center gap-2">
+          <Clock className="w-4 h-4" />
+          Action History
+        </h2>
+        <p className="text-sm text-muted-foreground italic">No actions recorded yet.</p>
+      </div>
+    );
+  }
+
+  return (
+    <div className="bg-card border border-border rounded-lg p-6">
+      <h2 className="font-semibold mb-4 flex items-center gap-2">
+        <Clock className="w-4 h-4" />
+        Action History
+        {hasActions && (
+          <span className="text-xs text-muted-foreground font-normal">({actions.length})</span>
+        )}
+      </h2>
+
+      <div className="relative">
+        <div className="absolute left-2 top-0 bottom-0 w-px bg-border" />
+        <ul className="space-y-4 pl-7">
+          {hasActions ? (
+            actions.map((action) => (
+              <li key={action.id} className="relative">
+                <div className="absolute -left-5 top-1.5 w-2 h-2 rounded-full bg-primary/60 border-2 border-background" />
+                <div className="text-xs text-muted-foreground mb-0.5">
+                  {formatDate(action.action_date)}
+                  {action.chamber && ` · ${action.chamber}`}
+                </div>
+                <p className="text-sm leading-snug">{action.action_text}</p>
+              </li>
+            ))
+          ) : (
+            <li className="relative">
+              <div className="absolute -left-5 top-1.5 w-2 h-2 rounded-full bg-muted-foreground/40 border-2 border-background" />
+              <div className="text-xs text-muted-foreground mb-0.5">
+                {formatDate(latestActionDate)}
+                <span className="ml-1.5 italic">· latest known action</span>
+              </div>
+              <p className="text-sm leading-snug">{latestActionText}</p>
+              <p className="text-xs text-muted-foreground mt-1 italic">
+                Full history loads in the background — refresh to see all actions.
+              </p>
+            </li>
+          )}
+        </ul>
+      </div>
+    </div>
+  );
+}