@skyhook-io/radar-app 1.13.3 → 1.13.4

package/src/components/diagnose/InvestigationEvidencePane.tsx

@@ -12,6 +12,7 @@ import { clsx } from "clsx";
 import {
   Activity,
   AlertTriangle,
+  BellRing,
   Boxes,
   Bug,
   CheckCircle2,
@@ -20,8 +21,10 @@ import {
   FileClock,
   FileSearch,
   Info,
+  KeyRound,
   ListTree,
   Network,
+  Package,
   ScrollText,
   SearchCheck,
   ShieldAlert,
@@ -79,8 +82,15 @@ export {
 } from "./useDisclosureReveal";
 export const VISIBLE_LOG_EVIDENCE_LINES = 12;
 
+/** The Timeline scope a changes card can open: one resource name in one namespace. */
+export interface InvestigationTimelineScope {
+  namespace?: string;
+  name: string;
+}
+
 const EvidenceNavigationContext = createContext<{
   onOpenResource?: (ref: DiagnosisResourceRef) => void;
+  onOpenTimeline?: (scope: InvestigationTimelineScope) => void;
   revealSourceId?: string;
   revealRequestId?: number;
   expandedGroupIds?: ReadonlySet<string>;
@@ -91,7 +101,7 @@ const EvidenceNavigationContext = createContext<{
 function evidenceTypePrefersFullRow(
   type: InvestigationEvidenceData["type"],
 ): boolean {
-  return type === "logs" || type === "events";
+  return type === "logs" || type === "events" || type === "alerts";
 }
 
 // Supporting evidence becomes a two-column grid when the pane is wide enough.
@@ -134,6 +144,10 @@ export function partitionInvestigationEvidence(
   const collectionByGroup = new Map<string, EvidenceCollection>();
   const adverse = (group: InvestigationEvidenceGroup) =>
     ["error", "alert", "warning"].includes(group.latest.tone);
+  // Broader cards are facts about something other than the target. They are
+  // withheld unless cited, and the pane says how many were withheld so a
+  // reader knows the agent looked at things it did not build its case on.
+  let hiddenBroader = 0;
   for (const group of groups) {
     const broader = group.latest.relevance === "broader";
     // Citations select tool results, not individual rows in a broad search.
@@ -142,22 +156,20 @@ export function partitionInvestigationEvidence(
       const link = resolution?.links.find(
         (item) => item.originalGroupId === group.id,
       );
-      const focused = ["resource", "logs", "crash"].includes(
-        group.latest.data.type,
-      );
+      const focused = FOCUSED_EVIDENCE_TYPES.includes(group.latest.data.type);
       const sourceGroups = link
         ? groups.filter(
             (candidate) =>
-              ["resource", "logs", "crash"].includes(
-                candidate.latest.data.type,
-              ) &&
+              FOCUSED_EVIDENCE_TYPES.includes(candidate.latest.data.type) &&
               candidate.observations.some(
                 (observation) => observation.source.id === link.source.id,
               ),
           )
         : [];
-      if (!selected.has(group.id) || !focused || sourceGroups.length !== 1)
+      if (!selected.has(group.id) || !focused || sourceGroups.length !== 1) {
+        if (!group.historical) hiddenBroader += 1;
         continue;
+      }
     }
     const main =
       !group.historical &&
@@ -180,9 +192,21 @@ export function partitionInvestigationEvidence(
       Number(adverse(right)) - Number(adverse(left)) ||
       left.firstOrder - right.firstOrder,
   );
-  return { ...collections, collectionByGroup };
+  return { ...collections, collectionByGroup, hiddenBroader };
 }
 
+// Kinds whose card is one unambiguous subject, so a citation of their source
+// can promote exactly that fact. A broad search (issues, inventory, events)
+// yields many rows per source; a citation cannot pick one of those.
+const FOCUSED_EVIDENCE_TYPES: readonly InvestigationEvidenceData["type"][] = [
+  "resource",
+  "logs",
+  "crash",
+  "helm",
+  "alerts",
+  "permissions",
+];
+
 export function investigationEvidenceRevealCollection(
   projection: InvestigationEvidenceProjection,
   sourceId: string,
@@ -210,6 +234,7 @@ export function InvestigationEvidencePane({
   onViewSource,
   onViewActivity,
   onOpenResource,
+  onOpenTimeline,
   afterEvidence,
   revealRequest,
   onRevealReady,
@@ -227,6 +252,8 @@ export function InvestigationEvidencePane({
   onViewActivity: () => void;
   /** Opens an evidence subject in Radar when the producer identified it exactly. */
   onOpenResource?: (ref: DiagnosisResourceRef) => void;
+  /** Opens Radar's Timeline filtered to the resource a changes card is about. */
+  onOpenTimeline?: (scope: InvestigationTimelineScope) => void;
   /** Actions follow the complete evidence section, including its disclosures. */
   afterEvidence?: ReactNode;
   /** Explicit Activity → Findings navigation, including repeat clicks. */
@@ -388,6 +415,17 @@ export function InvestigationEvidencePane({
           ))}
         </div>
 
+        {partition.hiddenBroader > 0 ? (
+          <p
+            className="text-xs text-theme-text-tertiary"
+            data-testid="investigation-hidden-evidence"
+          >
+            {partition.hiddenBroader === 1
+              ? "1 result about another resource is not shown; it appears here when the assessment cites it."
+              : `${partition.hiddenBroader} results about other resources are not shown; they appear here when the assessment cites them.`}
+          </p>
+        ) : null}
+
         {!hasCurrentEvidence ? (
           <EmptyCollection
             collecting={collecting}
@@ -426,6 +464,7 @@ export function InvestigationEvidencePane({
     <EvidenceNavigationContext.Provider
       value={{
         onOpenResource,
+        onOpenTimeline,
         expandedGroupIds,
         onGroupOpenChange,
         revealSourceId: revealRequest?.sourceId,
@@ -633,6 +672,7 @@ function CoverageStrip({
 }) {
   const hasError = groups.some((group) => group.hasError);
   const historyOnly = groups.every((group) => group.historyOnly);
+  const quiet = historyOnly;
   const { elementRef, revealAfterToggle } =
     useDisclosureReveal<HTMLDivElement>();
   const regionId = "investigation-evidence-coverage";
@@ -652,7 +692,7 @@ function CoverageStrip({
         }}
         className="flex w-full min-w-0 items-center gap-2 px-3 py-2 text-left hover:bg-theme-hover/50"
       >
-        {historyOnly ? (
+        {quiet ? (
           <Info
             className="h-4 w-4 shrink-0 text-theme-text-tertiary"
             aria-hidden
@@ -669,7 +709,7 @@ function CoverageStrip({
           <span
             className={clsx(
               "block text-xs",
-              historyOnly
+              quiet
                 ? "font-medium text-theme-text-secondary"
                 : "font-semibold text-theme-text-primary",
             )}
@@ -735,6 +775,65 @@ function CoverageGroupRow({
   const regionId = useId();
   const { elementRef, revealAfterToggle } =
     useDisclosureReveal<HTMLDivElement>();
+  // One limitation whose message is the whole summary would repeat itself as
+  // its own detail row; show its source link on the summary row instead.
+  const single =
+    group.limitations.length === 1 &&
+    group.limitations[0].message === group.summary
+      ? group.limitations[0]
+      : undefined;
+  const anchors = sourceIds.map((id) => (
+    <span
+      key={id}
+      id={investigationEvidenceSourceDomId(id)}
+      className="sr-only scroll-mt-14"
+      aria-hidden
+    />
+  ));
+  if (single) {
+    return (
+      <div
+        ref={elementRef}
+        data-evidence-source-container
+        tabIndex={-1}
+        aria-label={`Evidence limitation for ${group.label}: ${group.summary}`}
+        className="flex items-center gap-2 px-3 py-2.5 text-xs outline-none focus:ring-2 focus:ring-accent/40"
+      >
+        {anchors}
+        {group.hasError ? (
+          <CircleAlert
+            className="h-3.5 w-3.5 shrink-0 text-red-400"
+            aria-hidden
+          />
+        ) : single.kind === "truncated" ? (
+          <AlertTriangle
+            className="h-3.5 w-3.5 shrink-0 text-amber-500"
+            aria-hidden
+          />
+        ) : (
+          <Info
+            className="h-3.5 w-3.5 shrink-0 text-theme-text-tertiary"
+            aria-hidden
+          />
+        )}
+        <p className="min-w-0 flex-1 leading-relaxed text-theme-text-secondary">
+          <span className="font-medium text-theme-text-primary">
+            {group.label}:
+          </span>{" "}
+          {group.summary}
+        </p>
+        {single.sources.at(-1) ? (
+          <SourceButton
+            ariaLabel={`View source for ${group.label}`}
+            buttonLabel={
+              single.sources.length > 1 ? "View latest in Activity" : undefined
+            }
+            onClick={() => onViewSource(single.sources.at(-1)!.id)}
+          />
+        ) : null}
+      </div>
+    );
+  }
   return (
     <div
       ref={elementRef}
@@ -743,14 +842,7 @@ function CoverageGroupRow({
       aria-label={`Evidence limitation for ${group.label}: ${group.summary}`}
       className="outline-none focus:ring-2 focus:ring-accent/40"
     >
-      {sourceIds.map((id) => (
-        <span
-          key={id}
-          id={investigationEvidenceSourceDomId(id)}
-          className="sr-only scroll-mt-14"
-          aria-hidden
-        />
-      ))}
+      {anchors}
       <button
         type="button"
         aria-expanded={open}
@@ -891,6 +983,7 @@ function EvidenceCard({
 }) {
   const {
     onOpenResource,
+    onOpenTimeline,
     revealSourceId,
     revealRequestId,
     citedOrderByGroup,
@@ -1072,6 +1165,12 @@ function EvidenceCard({
             onOpenResource={onOpenResource}
             compact
           />
+          {observation.data.type === "changes" && observation.data.subject ? (
+            <OpenTimelineButton
+              scope={observation.data.subject}
+              onOpenTimeline={onOpenTimeline}
+            />
+          ) : null}
         </div>
       </div>
       {canExpand ? (
@@ -1146,6 +1245,36 @@ function OpenResourceButton({
   );
 }
 
+function OpenTimelineButton({
+  scope,
+  onOpenTimeline,
+}: {
+  scope: InvestigationTimelineScope;
+  onOpenTimeline?: (scope: InvestigationTimelineScope) => void;
+}) {
+  if (!onOpenTimeline) return null;
+  const identity = `${scope.namespace ? `${scope.namespace}/` : ""}${scope.name}`;
+  const label = `Open the Timeline for ${identity}`;
+  return (
+    <Tooltip
+      content={label}
+      delay={350}
+      position="left"
+      wrapperClassName="flex shrink-0"
+    >
+      <button
+        type="button"
+        aria-label={label}
+        onClick={() => onOpenTimeline(scope)}
+        className="flex h-7 shrink-0 items-center justify-center gap-1 rounded px-2 text-xs font-medium text-theme-text-tertiary transition-colors hover:bg-theme-hover hover:text-accent-text focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent"
+      >
+        <FileClock className="h-3.5 w-3.5" aria-hidden />
+        <span className="hidden @min-[540px]/card:inline">Timeline</span>
+      </button>
+    </Tooltip>
+  );
+}
+
 function uniquePrimarySources(
   group: InvestigationEvidenceGroup,
 ): InvestigationEvidenceSource[] {
@@ -1197,6 +1326,12 @@ function EvidenceBody({
       return (
         <p className="text-xs text-theme-text-secondary">{data.message}</p>
       );
+    case "alerts":
+      return <AlertsBody data={data} />;
+    case "helm":
+      return <HelmBody data={data} />;
+    case "permissions":
+      return <PermissionsBody data={data} />;
   }
 }
 
@@ -1211,10 +1346,12 @@ function evidenceHasDetails(
       const message = data.issue.message?.trim();
       return Boolean(
         (cause && cause !== summary) ||
-        (message && message !== summary && message !== cause),
+        (message && message !== summary && message !== cause) ||
+        data.pods?.length,
       );
     }
     case "startup":
+      return (data.pods?.length ?? 0) > 1;
     case "receipt":
       return false;
     case "resource": {
@@ -1271,6 +1408,18 @@ function IssueBody({
           {issue.namespace ? `${issue.namespace}/` : ""}
           {issue.name}
         </Badge>
+        {data.pods && data.pods.length > 0 ? (
+          <>
+            <Badge tone="structural" size="sm">
+              {data.pods.length === 1 ? "1 Pod" : `${data.pods.length} Pods`}
+            </Badge>
+            {data.pods.map((pod) => (
+              <Badge key={pod} tone="structural" size="sm">
+                {pod}
+              </Badge>
+            ))}
+          </>
+        ) : null}
       </div>
       {showCause ? (
         <p className="text-sm font-medium leading-relaxed text-theme-text-primary">
@@ -1288,15 +1437,18 @@ function IssueBody({
 
 function StartupBody({ data }: { data: EvidenceDataOf<"startup"> }) {
   const blocker = data.blocker;
+  const pods = data.pods && data.pods.length > 1 ? data.pods : [blocker.name];
   return (
     <div className="space-y-2">
       <div className="flex flex-wrap gap-1.5">
         <Badge tone="structural" size="sm">
-          {blocker.kind}
-        </Badge>
-        <Badge tone="structural" size="sm">
-          {blocker.name}
+          {pods.length > 1 ? `${pods.length} ${blocker.kind}s` : blocker.kind}
         </Badge>
+        {pods.map((pod) => (
+          <Badge key={pod} tone="structural" size="sm">
+            {pod}
+          </Badge>
+        ))}
         <Badge severity={severityBadge(blocker.severity)} size="sm">
           {blocker.severity}
         </Badge>
@@ -1585,7 +1737,11 @@ function EventsBody({ data }: { data: EvidenceDataOf<"events"> }) {
               <div className="flex flex-wrap items-baseline justify-between gap-x-3 gap-y-0.5">
                 <span className="text-xs font-semibold text-theme-text-primary">
                   {event.reason}
-                  {event.count > 1 ? ` ×${event.count}` : ""}
+                  {event.count > 1 ? (
+                    <span className="ml-1.5 font-mono text-[11px] font-normal text-theme-text-tertiary">
+                      ×{event.count}
+                    </span>
+                  ) : null}
                 </span>
                 <Tooltip
                   content={new Date(event.lastTimestamp).toLocaleString()}
@@ -2003,6 +2159,444 @@ function InventoryBody({ data }: { data: EvidenceDataOf<"inventory"> }) {
   );
 }
 
+const VISIBLE_ALERT_LABELS = 6;
+
+function alertStateSeverity(state: string | undefined) {
+  switch ((state ?? "").toLowerCase()) {
+    case "firing":
+      return "error" as const;
+    case "pending":
+      return "warning" as const;
+    case "inactive":
+      return "success" as const;
+    default:
+      return "neutral" as const;
+  }
+}
+
+function AlertsBody({ data }: { data: EvidenceDataOf<"alerts"> }) {
+  const { rule, instances, annotations } = data;
+  const health = rule.health?.toLowerCase();
+  // Target instances lead; the rest stay visible in producer order.
+  const ordered = [...instances].sort(
+    (left, right) => Number(right.namesTarget) - Number(left.namesTarget),
+  );
+  const annotationEntries = Object.entries(annotations);
+  return (
+    <div className="space-y-2.5">
+      <div className="flex flex-wrap items-center gap-1.5">
+        {rule.state ? (
+          <Badge severity={alertStateSeverity(rule.state)} size="sm">
+            {rule.state}
+          </Badge>
+        ) : null}
+        {rule.labels.severity ? (
+          <Badge severity={severityBadge(rule.labels.severity)} size="sm">
+            severity {rule.labels.severity}
+          </Badge>
+        ) : null}
+        <Badge tone="structural" size="sm">
+          {rule.group}
+        </Badge>
+        {health && health !== "ok" ? (
+          <Badge severity={health === "err" ? "error" : "neutral"} size="sm">
+            health {health}
+          </Badge>
+        ) : null}
+      </div>
+      {ordered.length > 0 ? (
+        <ol className="max-h-64 space-y-1.5 overflow-y-auto pr-1">
+          {ordered.map((instance, index) => {
+            const labels = Object.entries(instance.labels).filter(
+              ([key]) => key !== "alertname" && key !== "severity",
+            );
+            const hidden = labels.length - VISIBLE_ALERT_LABELS;
+            return (
+              <li
+                key={`${instance.state}-${index}-${labels.map(([k, v]) => `${k}=${v}`).join(",")}`}
+                className="rounded-md border border-theme-border/70 bg-theme-base/30 px-2.5 py-2"
+              >
+                <div className="flex flex-wrap items-center gap-1.5">
+                  <Badge
+                    severity={alertStateSeverity(instance.state)}
+                    size="sm"
+                  >
+                    {instance.state}
+                  </Badge>
+                  {instance.namesTarget ? (
+                    <Badge severity="info" size="sm">
+                      names this resource
+                    </Badge>
+                  ) : null}
+                  {instance.value ? (
+                    <span className="font-mono text-xs text-theme-text-secondary">
+                      value {instance.value}
+                    </span>
+                  ) : null}
+                  {instance.activeAt ? (
+                    <Tooltip
+                      content={new Date(instance.activeAt).toLocaleString()}
+                      delay={150}
+                      position="left"
+                      wrapperClassName="ml-auto"
+                    >
+                      <time
+                        dateTime={instance.activeAt}
+                        className="text-xs text-theme-text-tertiary"
+                      >
+                        active {formatRelativeAgeTime(instance.activeAt)}
+                      </time>
+                    </Tooltip>
+                  ) : null}
+                </div>
+                {labels.length > 0 ? (
+                  <div className="mt-1.5 flex flex-wrap gap-1 font-mono text-[11px] text-theme-text-secondary">
+                    {labels
+                      .slice(0, VISIBLE_ALERT_LABELS)
+                      .map(([key, value]) => (
+                        <span
+                          key={key}
+                          className="rounded bg-theme-base px-1.5 py-0.5 [overflow-wrap:anywhere]"
+                        >
+                          {key}={value}
+                        </span>
+                      ))}
+                    {hidden > 0 ? (
+                      <span className="px-1 py-0.5 text-theme-text-tertiary">
+                        +{hidden} more
+                      </span>
+                    ) : null}
+                  </div>
+                ) : null}
+              </li>
+            );
+          })}
+        </ol>
+      ) : (
+        <p className="text-xs italic text-theme-text-tertiary">
+          No active instances were reported for this rule.
+        </p>
+      )}
+      {annotationEntries.length > 0 ? (
+        <dl className="space-y-1 text-xs">
+          {annotationEntries.map(([key, value]) => (
+            <div key={key} className="flex min-w-0 gap-2">
+              <dt className="shrink-0 text-theme-text-tertiary">{key}</dt>
+              <dd className="min-w-0 leading-relaxed text-theme-text-secondary [overflow-wrap:anywhere]">
+                {value}
+              </dd>
+            </div>
+          ))}
+        </dl>
+      ) : null}
+      {rule.query ? (
+        <TerminalBlock label="Rule expression">{rule.query}</TerminalBlock>
+      ) : null}
+    </div>
+  );
+}
+
+function helmStatusSeverity(status: string) {
+  const normalized = status.toLowerCase();
+  if (normalized === "deployed") return "success" as const;
+  if (normalized.includes("failed")) return "error" as const;
+  if (normalized.startsWith("pending") || normalized === "uninstalling")
+    return "info" as const;
+  return "warning" as const;
+}
+
+function HelmBody({ data }: { data: EvidenceDataOf<"helm"> }) {
+  const { onOpenResource } = useContext(EvidenceNavigationContext);
+  const { release } = data;
+  const operation = release.lastOperation;
+  return (
+    <div className="space-y-3">
+      <div className="flex flex-wrap items-center gap-1.5">
+        <Badge severity={helmStatusSeverity(release.status)} size="sm">
+          {release.status}
+        </Badge>
+        <Badge tone="structural" size="sm">
+          {release.chart}
+          {release.chartVersion ? ` ${release.chartVersion}` : ""}
+        </Badge>
+        <Badge tone="structural" size="sm">
+          revision {release.revision}
+        </Badge>
+        {release.appVersion ? (
+          <Badge tone="note" size="sm">
+            app {release.appVersion}
+          </Badge>
+        ) : null}
+        {release.resourceHealth ? (
+          <Badge
+            severity={
+              mapHealthToTone(release.resourceHealth) === "healthy"
+                ? "success"
+                : mapHealthToTone(release.resourceHealth) === "unhealthy"
+                  ? "error"
+                  : "warning"
+            }
+            size="sm"
+          >
+            resources {release.resourceHealth}
+          </Badge>
+        ) : null}
+        <Tooltip
+          content={new Date(release.updated).toLocaleString()}
+          delay={150}
+          position="left"
+          wrapperClassName="ml-auto"
+        >
+          <time
+            dateTime={release.updated}
+            className="text-xs text-theme-text-tertiary"
+          >
+            updated {formatRelativeAgeTime(release.updated)}
+          </time>
+        </Tooltip>
+      </div>
+      {release.healthIssue ? (
+        <p className="text-xs leading-relaxed text-warning-text">
+          {release.healthIssue}
+        </p>
+      ) : null}
+      {release.healthSummary &&
+      release.healthSummary !== release.healthIssue ? (
+        <p className="text-xs leading-relaxed text-theme-text-secondary">
+          {release.healthSummary}
+        </p>
+      ) : null}
+      {operation ? (
+        <div className="rounded-md border border-theme-border bg-theme-base/40 px-2.5 py-2">
+          <div className="flex flex-wrap items-center gap-1.5">
+            <span className="text-xs font-semibold uppercase tracking-wide text-theme-text-tertiary">
+              Last operation
+            </span>
+            <Badge tone="note" size="sm">
+              {operation.kind.replaceAll("_", " ")}
+            </Badge>
+            <Badge
+              severity={
+                operation.status === "completed"
+                  ? "success"
+                  : operation.status === "failed"
+                    ? "error"
+                    : "warning"
+              }
+              size="sm"
+            >
+              {operation.status.replaceAll("_", " ")}
+            </Badge>
+          </div>
+          {operation.message ? (
+            <p className="mt-1 text-xs leading-relaxed text-theme-text-secondary [overflow-wrap:anywhere]">
+              {operation.message}
+            </p>
+          ) : null}
+        </div>
+      ) : null}
+      {release.description ? (
+        <p className="text-xs text-theme-text-tertiary [overflow-wrap:anywhere]">
+          {release.description}
+        </p>
+      ) : null}
+      {release.storageNamespace &&
+      release.storageNamespace !== release.namespace ? (
+        <p className="text-xs text-theme-text-tertiary">
+          Release metadata stored in namespace {release.storageNamespace}
+        </p>
+      ) : null}
+      {release.managedByFluxHelmRelease ? (
+        <p className="text-xs text-theme-text-tertiary">
+          Managed by Flux HelmRelease {release.managedByFluxHelmRelease}
+        </p>
+      ) : null}
+      {release.resources.length > 0 ? (
+        <div className="max-h-52 overflow-y-auto rounded-md border border-theme-border">
+          {release.resources.map((owned, index) => (
+            <div
+              key={`${owned.kind}-${owned.namespace}-${owned.name}`}
+              className={clsx(
+                "flex min-w-0 items-center gap-2 px-2.5 py-1.5",
+                index > 0 && "border-t border-theme-border/60",
+              )}
+            >
+              <StatusDot
+                tone={mapHealthToTone(
+                  owned.issue ? "unhealthy" : (owned.status ?? ""),
+                )}
+                className="shrink-0"
+              />
+              <Badge tone="structural" size="sm">
+                {owned.kind}
+              </Badge>
+              <span className="min-w-0 flex-1">
+                <span className="block truncate font-mono text-xs">
+                  <ResourceLink
+                    name={owned.name}
+                    kind={owned.kind}
+                    namespace={owned.namespace}
+                    group={
+                      owned.apiVersion
+                        ? apiVersionToGroup(owned.apiVersion)
+                        : undefined
+                    }
+                    label={`${owned.namespace ? `${owned.namespace}/` : ""}${owned.name}`}
+                    onNavigate={
+                      owned.apiVersion && onOpenResource
+                        ? (ref) => onOpenResource(ref)
+                        : undefined
+                    }
+                  />
+                </span>
+                {owned.issue ? (
+                  <span className="block truncate text-xs text-warning-text">
+                    {owned.issue}
+                  </span>
+                ) : owned.summary || owned.message ? (
+                  <span className="block truncate text-xs text-theme-text-tertiary">
+                    {owned.summary || owned.message}
+                  </span>
+                ) : null}
+              </span>
+              {owned.ready || owned.status ? (
+                <span className="ml-auto shrink-0 font-mono text-xs text-theme-text-tertiary">
+                  {owned.ready || owned.status}
+                </span>
+              ) : null}
+            </div>
+          ))}
+        </div>
+      ) : null}
+    </div>
+  );
+}
+
+function PermissionsBody({ data }: { data: EvidenceDataOf<"permissions"> }) {
+  const { subject, accessCheck } = data;
+  const subjectBadges = (
+    <>
+      <Badge tone="structural" size="sm">
+        {subject.kind}
+      </Badge>
+      <span className="font-mono text-xs text-theme-text-secondary">
+        {subject.namespace ? `${subject.namespace}/` : ""}
+        {subject.name}
+      </span>
+    </>
+  );
+  if (accessCheck) {
+    const facts = [
+      ["Verb", accessCheck.verb],
+      ["Resource", accessCheck.resource],
+      ["Subresource", accessCheck.subresource],
+      ["API group", accessCheck.group || "core"],
+      ["Namespace", accessCheck.namespace || "cluster-wide"],
+      ["Name", accessCheck.resourceName],
+    ] as const;
+    return (
+      <div className="space-y-2.5">
+        <div className="flex flex-wrap items-center gap-1.5">
+          {subjectBadges}
+          <Badge
+            severity={accessCheck.allowed ? "success" : "warning"}
+            size="sm"
+          >
+            {accessCheck.allowed
+              ? "allowed"
+              : accessCheck.denied
+                ? "denied"
+                : "not allowed"}
+          </Badge>
+        </div>
+        <dl className="flex flex-wrap gap-x-6 gap-y-2 text-xs">
+          {facts.map(([label, value]) => (
+            <ResourceFact key={label} label={label} value={value} />
+          ))}
+        </dl>
+        {accessCheck.reason ? (
+          <p className="text-xs leading-relaxed text-theme-text-secondary [overflow-wrap:anywhere]">
+            {accessCheck.reason}
+          </p>
+        ) : null}
+        {accessCheck.evaluationError ? (
+          <p className="text-xs leading-relaxed text-semantic-error">
+            {accessCheck.evaluationError}
+          </p>
+        ) : null}
+      </div>
+    );
+  }
+  const bindings = data.bindings ?? [];
+  const usedByPods = data.usedByPods ?? [];
+  return (
+    <div className="space-y-2.5">
+      <div className="flex flex-wrap items-center gap-1.5">
+        {subjectBadges}
+        <Badge tone="note" size="sm">
+          {data.flatRulesCount ?? 0}
+          {data.truncated ? "+" : ""} effective rules
+        </Badge>
+        {data.truncated ? (
+          <Badge severity="warning" size="sm">
+            rule list truncated
+          </Badge>
+        ) : null}
+      </div>
+      {bindings.length > 0 ? (
+        <div className="max-h-52 overflow-y-auto rounded-md border border-theme-border">
+          {bindings.map((binding, index) => (
+            <div
+              key={`${binding.bindingKind}-${binding.bindingNamespace ?? ""}-${binding.bindingName}`}
+              className={clsx(
+                "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1 px-2.5 py-1.5 text-xs",
+                index > 0 && "border-t border-theme-border/60",
+              )}
+            >
+              <Badge tone="structural" size="sm">
+                {binding.bindingKind}
+              </Badge>
+              <span className="min-w-0 truncate font-mono text-theme-text-secondary">
+                {binding.bindingNamespace ? `${binding.bindingNamespace}/` : ""}
+                {binding.bindingName}
+              </span>
+              <span className="text-theme-text-tertiary">→</span>
+              <Badge tone="structural" size="sm">
+                {binding.roleKind}
+              </Badge>
+              <span className="min-w-0 truncate font-mono text-theme-text-primary">
+                {binding.roleNamespace ? `${binding.roleNamespace}/` : ""}
+                {binding.roleName}
+              </span>
+              <span className="ml-auto shrink-0 font-mono text-theme-text-tertiary">
+                {binding.rulesCount} rule{binding.rulesCount === 1 ? "" : "s"}
+              </span>
+              {binding.inheritedFromGroup ? (
+                <Badge tone="note" size="sm">
+                  via {binding.inheritedFromGroup}
+                </Badge>
+              ) : null}
+            </div>
+          ))}
+        </div>
+      ) : (
+        <p className="text-xs italic text-theme-text-tertiary">
+          No RoleBinding or ClusterRoleBinding grants this subject anything.
+        </p>
+      )}
+      {usedByPods.length > 0 ? (
+        <p className="text-xs leading-relaxed text-theme-text-secondary [overflow-wrap:anywhere]">
+          <span className="text-theme-text-tertiary">Used by pods: </span>
+          <span className="font-mono">{usedByPods.join(", ")}</span>
+          {data.podsTotal && data.podsTotal > usedByPods.length
+            ? ` and ${data.podsTotal - usedByPods.length} more`
+            : ""}
+        </p>
+      ) : null}
+    </div>
+  );
+}
+
 function RevisionHistory({
   observations,
   citedOrder,
@@ -2111,6 +2705,12 @@ function EvidenceCaveat({ data }: { data: InvestigationEvidenceData }) {
   } else if (data.type === "relationships" || data.type === "topology") {
     text =
       "This shows direct relationships Radar found, not an inferred blast radius.";
+  } else if (data.type === "alerts") {
+    text =
+      "Instances are matched to this investigation by their Prometheus labels; a firing rule alone does not establish the cause.";
+  } else if (data.type === "permissions") {
+    text =
+      "This is what RBAC grants the subject, not what the workload has exercised.";
   }
   if (!text) return null;
   return (
@@ -2210,6 +2810,12 @@ function evidenceIcon(type: InvestigationEvidenceData["type"]) {
       return ListTree;
     case "receipt":
       return CheckCircle2;
+    case "alerts":
+      return BellRing;
+    case "helm":
+      return Package;
+    case "permissions":
+      return KeyRound;
   }
 }