feat(ui): display names in activities + refactor feeds to tables/timelines on datum-ui

[mattdjenkinson]

Summary

Two large pieces of work landed on this branch:

1. Backend display-name enrichment — ActivityActor and ActivityLink carry a server-resolved DisplayName (and Email for links) so the UI can render human-readable user names instead of raw emails / UIDs.
2. UI refactor onto datum-ui — the activity, events, and audit-log feeds are now table/timeline-shaped, route every primitive through @datum-cloud/datum-ui, and share a single set of detail-panel primitives.

Backend changes (Go)

• pkg/apis/activity/v1alpha1/types_activity.go — added ActivityActor.DisplayName and ActivityLink.DisplayName / ActivityLink.Email (all omitempty). Marker fields preserved for backwards compatibility.
• internal/processor/userlookup.go (new) — UserResolver interface + NoopUserResolver + CachedUserResolver with TTL cache, single-flight collapse, and negative caching for misses.
• internal/processor/classifier.go — ResolveActorWithResolver(ctx, user, resolver) populates DisplayName from the iam User's givenName + familyName. Resolver errors are silently ignored; the activity is still emitted with whatever data is available.
• internal/processor/activity.go — ActivityBuilder gains a UserResolver. New enrichSummaryWithDisplayNames rewrites the summary to substitute actor.Name (typically email) with actor.DisplayName, upgrades existing actor link() entries in place (or appends a synthetic actor link for templates that didn't wrap the actor), and hydrates User-typed link targets via the resolver.
• internal/processor/evaluate.go + internal/activityprocessor/policycache.go — added *WithResolver overloads alongside the existing functions so callers can opt into enrichment without changing the public API.
• internal/activityprocessor/userresolver.go (new) — IAMUserResolver queries iam.miloapis.com/v1alpha1/User resources via a controller-runtime client, exposed as Unstructured so we don't pull in milo's Go types as a dependency.
• internal/activityprocessor/processor.go — wires NewCachedUserResolver(NewIAMUserResolver(k8sClient), 0, 0) into the Processor at startup.
• Tests — internal/processor/userlookup_test.go (cache hit, neg-cache, TTL expiry, single-flight, error-not-cached, empty-key short-circuit) and internal/processor/enrichment_test.go (actor replacement, link upgrade in place, actor-not-in-summary, user link hydration, non-user link untouched, ResolveActorWithResolver paths). Full Go test suite green; go vet + go build clean.

UI refactor (ui/)

Datum-ui adoption + primitive sweep

• Added @datum-cloud/datum-ui ^0.8.0 as a peer dep (and devDep so the rollup build resolves locally). Externalised @datum-cloud/datum-ui/* in rollup.config.mjs — consumers bring their own pinned copy.
• Bulk-migrated 11 drop-in primitives across all 42 consumer files to direct imports (alert, card, checkbox, input, label, select, separator, sheet, skeleton, tabs, textarea).
• Adapter shims kept in src/components/ui/ for the four datum-ui APIs that don't match the legacy shadcn shape:
  • badge — variant=… → type=… + theme=….
  • dialog — flat Dialog{Header,Title,…} over datum-ui's compound Dialog.Header/.Title/….
  • tooltip — re-built directly on @radix-ui/react-tooltip (datum-ui's <Tooltip message=…> wraps the trigger in relative inline-flex which broke truncation downstream); styling mirrors datum-ui's secondary popover with arrow.
• Button shim deleted entirely. All ~60 <Button variant=… size=…> call sites rewritten to use datum-ui's type=… theme=… size=… props (Python script that walked each opening tag); native HTML type="button|submit|reset" renamed to htmlType.
• Hardcoded brand-pink CTAs (#BF9595/#0C1D31/#A88080/#E6F59F) across policy + reindex views replaced by theme tokens (bg-primary, text-primary-foreground, etc.).
• Dropped the local rollup PostCSS / Tailwind pipeline (no CSS shipped — host app's Tailwind compiles utility classes from dist/). Removed tailwindcss, @tailwindcss/postcss, autoprefixer, rollup-plugin-postcss, tailwindcss-animate from deps.
• Removed unused VerbToggle.tsx and EventFeedItemSkeleton.tsx.

Feed refactor (table + timeline variants)

• ActivityFeed — Card-row list → <Table> with columns Actor (avatar w/ tooltip) | Summary (truncated, full on hover) | Tenant (TenantBadge) | When (<Timestamp>) | expand. Row click toggles expansion; expanded panel spans all columns. Manual "Load more" pagination footer (count + button); IntersectionObserver path retained behind infiniteScroll={true}.
• AuditLogQueryComponent + AuditLogFeedItem — same treatment with columns Verb (badge) | Summary | Status (✓/✗ + code) | When | expand.
• EventsFeed + EventFeedItem — Type (Normal/Warning) | Reason | Note | Object | When | expand.
• All three feeds also accept variant: 'feed' | 'timeline'. The 'timeline' variant renders a flat icon-list (action-keyed icon square + summary + status/object + timestamp + expand) matching the existing ActivityFeedItem timeline shape so all three activity-hub tabs can present consistently.

Timestamp component

• New <Timestamp> (uses Intl.DateTimeFormat — no extra deps). Three visible variants: relative (default), utc, iso-utc, local. Hover always reveals a four-row tooltip (UTC / browser-tz / Relative / microsecond timestamp), matching staff-portal's <DateTime variant="detailed"> pattern. Used everywhere a time is shown — feed rows, expanded panels, timeline variants.

Detail panels

• New shared primitives in src/components/details.tsx: Section, Field, CopyButton, DetailGrid, DetailPanelShell. Each Field renders label-above-value; values truncate with a hover tooltip (disableTooltip opt-out for cells whose value already provides its own, e.g. <Timestamp>); copy button fades in on row hover.
• Activity / AuditLog / Event expanded panels rebuilt onto these primitives. Sections grouped by responsibility (e.g. When / Actor / Resource / Origin for activity).

Pause/Resume + pagination correctness

• Added userPaused to useActivityFeed and useEventsFeed. The auto-restart effects that previously re-opened the watch immediately after stopStreaming now skip while userPaused is true. Clicking Pause stays paused; tab switching while paused fetches but doesn't silently resume the stream.
• Manual pagination is the new default in staff-portal's feed.tsx. The IntersectionObserver dependency cycle (re-creating on every isLoading toggle, refiring loadMore() until items filled the viewport) is fixed by mirroring hasMore / isLoading into refs.

TenantBadge / toolbars

• ChangeSourceToggle / EventTypeToggle / ActionToggle now use datum-ui's type=primary theme=solid for the active state (so Button picks up the matching foreground colour) and force borderRadius: 0 + border: 0 inline on the active button so the segmented control fills its wrapper edge-to-edge with no internal seam.
• All three filter toolbars share the same wrapper (border-b border-border py-4); search inputs match (Search icon + Input + clear-X button).
• Streaming header (Pause/Resume) standardised across activity + events: same outlined Button, same icon sizes, same tooltipped streaming-dot.

Notable verification

• pnpm run type-check ✓
• pnpm run build (rollup) ✓ (no warnings)
• Backend: go build ./..., go vet ./..., go test ./... — all green; new tests cover cache + enrichment paths.

[scotwells]

@mattdjenkinson thoughts on separating the user enrichment stuff into a separate PR? I have some concerns around the pressure this could put on the control plane that I need to think through and don't want to hold up the UI improvements.

[mattdjenkinson]

@scotwells yeah i probs should have done that to begin with. Will sort.

[mattdjenkinson]

Splitting this into two focused PRs for easier review:

• Backend (display name enrichment): feat(activity): enrich activities with iam User display names #193
• UI (datum-ui refactor + table/timeline): refactor(ui): rebuild activity UI on @datum-cloud/datum-ui #194

The UI PR can merge independently — the new displayName/email fields are optional and will simply stay undefined until the backend PR lands.