@skyhook-io/k8s-ui 1.12.0 → 1.13.3

package/src/components/ui/SelectMenu.tsx

@@ -1,5 +1,5 @@
-import { useEffect, useRef, useState } from 'react'
-import { Check, ChevronDown } from 'lucide-react'
+import { useEffect, useId, useMemo, useRef, useState } from 'react'
+import { Check, ChevronDown, Search } from 'lucide-react'
 import { clsx } from 'clsx'
 
 export interface SelectMenuOption {
@@ -13,67 +13,241 @@ export function SelectMenu({
   onChange,
   ariaLabel,
   className,
+  searchPlaceholder,
 }: {
   value: string
   options: SelectMenuOption[]
   onChange: (value: string) => void
   ariaLabel: string
   className?: string
+  searchPlaceholder?: string
 }) {
   const [open, setOpen] = useState(false)
+  const [query, setQuery] = useState('')
+  const [highlightedIndex, setHighlightedIndex] = useState(0)
+  const listboxId = useId()
   const rootRef = useRef<HTMLDivElement>(null)
+  const triggerRef = useRef<HTMLButtonElement>(null)
+  const searchInputRef = useRef<HTMLInputElement>(null)
+  const listRef = useRef<HTMLDivElement>(null)
+  const pointerDownInsideRef = useRef(false)
   const selected = options.find((option) => option.value === value) ?? options[0]
+  const filteredOptions = useMemo(() => {
+    const normalized = query.trim().toLowerCase()
+    if (!normalized) return options
+    return options.filter((option) => option.label.toLowerCase().includes(normalized))
+  }, [options, query])
+  const selectedIsVisible = filteredOptions.some((option) => option.value === value)
+
+  const selectOption = (nextValue: string) => {
+    onChange(nextValue)
+    setOpen(false)
+    triggerRef.current?.focus()
+  }
 
   useEffect(() => {
     if (!open) return
     const onPointerDown = (event: MouseEvent) => {
       if (!rootRef.current?.contains(event.target as Node)) setOpen(false)
     }
-    const onKeyDown = (event: KeyboardEvent) => {
-      if (event.key === 'Escape') setOpen(false)
-    }
     document.addEventListener('mousedown', onPointerDown)
-    document.addEventListener('keydown', onKeyDown)
     return () => {
       document.removeEventListener('mousedown', onPointerDown)
-      document.removeEventListener('keydown', onKeyDown)
     }
   }, [open])
 
+  useEffect(() => {
+    if (!open) setQuery('')
+  }, [open])
+
+  useEffect(() => {
+    if (!open || !query) return
+    if (listRef.current) listRef.current.scrollTop = 0
+  }, [open, query])
+
+  useEffect(() => {
+    if (!open) return
+    if (!searchPlaceholder) {
+      triggerRef.current?.focus()
+      return
+    }
+    listRef.current
+      ?.querySelector<HTMLElement>('[role="option"][aria-selected="true"]')
+      ?.scrollIntoView({ block: 'nearest' })
+  }, [open, searchPlaceholder])
+
   return (
-    <div ref={rootRef} className={clsx('relative', className)}>
+    <div
+      ref={rootRef}
+      className={clsx('relative', className)}
+      onMouseDownCapture={() => {
+        pointerDownInsideRef.current = true
+        requestAnimationFrame(() => {
+          pointerDownInsideRef.current = false
+        })
+      }}
+      onKeyDown={(event) => {
+        if (event.key !== 'Escape' || !open) return
+        event.preventDefault()
+        event.stopPropagation()
+        setOpen(false)
+        triggerRef.current?.focus()
+      }}
+      onBlur={(event) => {
+        if (!open) return
+        if (event.relatedTarget && rootRef.current?.contains(event.relatedTarget)) return
+        if (!pointerDownInsideRef.current) {
+          setOpen(false)
+          return
+        }
+        requestAnimationFrame(() => {
+          if (!document.hasFocus() || !listRef.current) return
+          if (searchPlaceholder) searchInputRef.current?.focus()
+          else triggerRef.current?.focus()
+        })
+      }}
+    >
       <button
+        ref={triggerRef}
         type="button"
         aria-label={ariaLabel}
         aria-haspopup="listbox"
         aria-expanded={open}
-        onClick={() => setOpen((current) => !current)}
+        aria-controls={open ? listboxId : undefined}
+        onClick={() => {
+          if (!open) {
+            setHighlightedIndex(
+              Math.max(
+                options.findIndex((option) => option.value === value),
+                0,
+              ),
+            )
+          }
+          setOpen(!open)
+        }}
         className="flex h-8 w-full items-center justify-between gap-2 rounded-md border border-theme-border bg-theme-elevated px-2.5 text-xs text-theme-text-primary transition-colors hover:bg-theme-hover"
       >
         <span className="truncate">{selected?.label}</span>
         <ChevronDown className={clsx('h-3.5 w-3.5 shrink-0 text-theme-text-tertiary transition-transform', open && 'rotate-180')} />
       </button>
       {open && (
-        <div role="listbox" className="absolute right-0 top-full z-50 mt-1 min-w-full overflow-hidden rounded-md border border-theme-border bg-theme-surface py-1 shadow-theme-lg">
-          {options.map((option) => {
-            const active = option.value === value
-            return (
-              <button
-                key={option.value}
-                type="button"
-                role="option"
-                aria-selected={active}
-                onClick={() => {
-                  onChange(option.value)
-                  setOpen(false)
+        <div
+          className={clsx(
+            'absolute top-full z-50 mt-1 min-w-full overflow-hidden rounded-md border border-theme-border bg-theme-surface shadow-theme-lg',
+            searchPlaceholder ? 'left-0 right-0' : 'right-0'
+          )}
+        >
+          {searchPlaceholder && (
+            <div
+              className="flex items-center gap-2 border-b border-theme-border px-2.5 py-2"
+              onMouseDown={(event) => {
+                if (event.target !== searchInputRef.current) event.preventDefault()
+              }}
+            >
+              <Search className="h-3.5 w-3.5 shrink-0 text-theme-text-tertiary" />
+              <input
+                ref={searchInputRef}
+                autoFocus
+                value={query}
+                onChange={(event) => {
+                  setQuery(event.target.value)
+                  setHighlightedIndex(0)
                 }}
-                className="flex w-full items-center gap-2 whitespace-nowrap px-2.5 py-1.5 text-left text-xs text-theme-text-secondary transition-colors hover:bg-theme-hover hover:text-theme-text-primary"
-              >
-                <Check className={clsx('h-3.5 w-3.5 shrink-0 text-accent', !active && 'opacity-0')} />
-                {option.label}
-              </button>
-            )
-          })}
+                onKeyDown={(event) => {
+                  if (event.key === 'Enter' && filteredOptions.length > 0) {
+                    event.preventDefault()
+                    const nextIndex = Math.min(highlightedIndex, filteredOptions.length - 1)
+                    selectOption(filteredOptions[nextIndex].value)
+                  } else if (event.key === 'ArrowDown') {
+                    event.preventDefault()
+                    const optionElements = listRef.current?.querySelectorAll<HTMLButtonElement>('[role="option"]')
+                    optionElements?.[Math.min(highlightedIndex, optionElements.length - 1)]?.focus()
+                  }
+                }}
+                aria-label={searchPlaceholder}
+                role="combobox"
+                aria-autocomplete="list"
+                aria-controls={listboxId}
+                aria-expanded="true"
+                aria-activedescendant={
+                  filteredOptions.length > 0
+                    ? `${listboxId}-option-${Math.min(highlightedIndex, filteredOptions.length - 1)}`
+                    : undefined
+                }
+                placeholder={searchPlaceholder}
+                className="min-w-0 flex-1 bg-transparent text-xs text-theme-text-primary outline-none placeholder:text-theme-text-tertiary"
+              />
+            </div>
+          )}
+          {searchPlaceholder && (
+            <span className="sr-only" aria-live="polite">
+              {filteredOptions.length === 0
+                ? 'No matches.'
+                : `${filteredOptions.length} ${filteredOptions.length === 1 ? 'option' : 'options'} available.`}
+            </span>
+          )}
+          <div
+            id={listboxId}
+            ref={listRef}
+            role="listbox"
+            aria-label={ariaLabel}
+            onKeyDown={(event) => {
+              if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return
+              const optionElements = Array.from(
+                listRef.current?.querySelectorAll<HTMLButtonElement>('[role="option"]') ?? [],
+              )
+              const currentIndex = optionElements.indexOf(event.target as HTMLButtonElement)
+              if (currentIndex < 0) return
+              event.preventDefault()
+              if (event.key === 'ArrowUp' && currentIndex === 0 && searchPlaceholder) {
+                searchInputRef.current?.focus()
+                return
+              }
+              const nextIndex = event.key === 'Home'
+                ? 0
+                : event.key === 'End'
+                  ? optionElements.length - 1
+                  : event.key === 'ArrowDown'
+                    ? Math.min(currentIndex + 1, optionElements.length - 1)
+                    : Math.max(currentIndex - 1, 0)
+              optionElements[nextIndex]?.focus()
+            }}
+            className={clsx(filteredOptions.length > 0 && 'py-1', searchPlaceholder && 'max-h-64 overflow-y-auto')}
+          >
+            {filteredOptions.map((option, index) => {
+              const active = option.value === value
+              return (
+                <button
+                  key={option.value}
+                  id={`${listboxId}-option-${index}`}
+                  type="button"
+                  role="option"
+                  aria-selected={active}
+                  tabIndex={
+                    searchPlaceholder ? (index === highlightedIndex ? 0 : -1) : active || (!selectedIsVisible && index === 0) ? 0 : -1
+                  }
+                  onClick={() => selectOption(option.value)}
+                  onFocus={() => setHighlightedIndex(index)}
+                  className={clsx(
+                    'flex w-full items-center gap-2 px-2.5 py-1.5 text-left text-xs text-theme-text-secondary transition-colors hover:bg-theme-hover hover:text-theme-text-primary',
+                    searchPlaceholder && index === highlightedIndex && 'bg-theme-hover text-theme-text-primary',
+                    !searchPlaceholder && 'whitespace-nowrap'
+                  )}
+                >
+                  <Check className={clsx('h-3.5 w-3.5 shrink-0 text-accent', !active && 'opacity-0')} />
+                  <span className={clsx(searchPlaceholder && 'truncate')}>{option.label}</span>
+                </button>
+              )
+            })}
+          </div>
+          {filteredOptions.length === 0 && (
+            <p
+              onMouseDown={(event) => event.preventDefault()}
+              className="px-3 py-2 text-xs text-theme-text-tertiary"
+            >
+              No matches.
+            </p>
+          )}
         </div>
       )}
     </div>

package/src/components/ui/drawer-components.test.tsx

@@ -1,6 +1,6 @@
 import { describe, expect, it } from 'vitest'
 import { renderToString } from 'react-dom/server'
-import { ProblemAlerts, OperationalIssuesShownContext } from './drawer-components'
+import { ProblemAlerts, OperationalIssuesShownContext, RelatedResourcesSection } from './drawer-components'
 
 const problems = [
   { color: 'red' as const, message: 'Application is Degraded' },
@@ -33,3 +33,19 @@ describe('ProblemAlerts', () => {
     expect(html).toContain('Application is OutOfSync')
   })
 })
+
+describe('RelatedResourcesSection', () => {
+  it('renders an associated Node', () => {
+    const html = renderToString(
+      <RelatedResourcesSection
+        relationships={{ node: { kind: 'Node', namespace: '', name: 'worker-1' } }}
+        onNavigate={() => {}}
+      />,
+    )
+
+    expect(html).toContain('Related Resources')
+    expect(html).toContain('Node')
+    expect(html).toContain('worker-1')
+    expect(html).toContain('<button')
+  })
+})

package/src/components/ui/drawer-components.tsx

@@ -167,7 +167,10 @@ export function Property({ label, value, copyable, onCopy, copied }: PropertyPro
   return (
     <div className="flex items-start gap-2 text-sm">
       <span className="text-theme-text-tertiary w-40 shrink-0">{label}</span>
-      <span className={clsx('text-theme-text-primary flex-1 min-w-0', isReactElement(value) ? 'break-normal' : 'break-all')}>{displayValue}</span>
+      {/* break-words, not break-all: a long unbroken token (image ref, UID)
+          still wraps because it has to, while a sentence keeps its words
+          intact. break-all split "PostgreSQL" across two lines. */}
+      <span className={clsx('text-theme-text-primary flex-1 min-w-0', isReactElement(value) ? 'break-normal' : 'break-words')}>{displayValue}</span>
       {copyable && onCopy && !isReactElement(value) && (
         <button
           onClick={() => onCopy(strValue, labelKey)}
@@ -789,6 +792,7 @@ export function RelatedResourcesSection({ relationships, onNavigate }: RelatedRe
   const hasRelationships =
     relationships.owner ||
     relationships.deployment ||
+    relationships.node ||
     (relationships.children && relationships.children.length > 0) ||
     (relationships.services && relationships.services.length > 0) ||
     (relationships.ingresses && relationships.ingresses.length > 0) ||
@@ -815,6 +819,9 @@ export function RelatedResourcesSection({ relationships, onNavigate }: RelatedRe
         {relationships.deployment && (
           <RelationshipGroup label="Deployment" refs={[relationships.deployment]} onNavigate={onNavigate} />
         )}
+        {relationships.node && (
+          <RelationshipGroup label="Node" refs={[relationships.node]} onNavigate={onNavigate} />
+        )}
         {relationships.children && relationships.children.length > 0 && (
           <RelationshipGroup label="Children" refs={dedupeRefs(relationships.children)} onNavigate={onNavigate} />
         )}
@@ -870,7 +877,7 @@ interface RelationshipGroupProps {
 
 const RELATIONSHIP_TRUNCATE_LIMIT = 10
 
-function RelationshipGroup({ label, refs, onNavigate }: RelationshipGroupProps) {
+export function RelationshipGroup({ label, refs, onNavigate }: RelationshipGroupProps) {
   const [showAll, setShowAll] = useState(false)
   if (!refs || refs.length === 0) return null
 

package/src/components/ui/index.ts

@@ -1,4 +1,6 @@
 export { Tooltip, WithTooltip } from './Tooltip'
+export { CronValue, TimeValue } from './ScheduleValue'
+export type { CronDialect } from './ScheduleValue'
 export { Badge } from './Badge'
 export type { BadgeSeverity, BadgeSize, BadgeTone } from './Badge'
 export { FreshnessControl } from './FreshnessControl'

package/src/components/workload/WorkloadView.tsx

@@ -30,7 +30,7 @@ import {
   BarChart3,
   Network,
   Stethoscope,
-  DollarSign,
+  Coins,
 } from 'lucide-react'
 import type { TimelineEvent, ResourceRef, Relationships, SelectedResource, ResolvedEnvFrom, Topology, TopologyNode, HPADiagnosis, WorkloadPodInfo } from '../../types'
 import type { GitOpsStatus } from '../../types/gitops'
@@ -506,6 +506,9 @@ export function WorkloadView({
       Service: 1, Ingress: 1, HTTPRoute: 1,
       ConfigMap: 2, Secret: 2,
       HorizontalPodAutoscaler: 3, PodDisruptionBudget: 3, NetworkPolicy: 3,
+      CalicoNetworkPolicy: 3, CalicoGlobalNetworkPolicy: 3,
+      CalicoStagedNetworkPolicy: 3, CalicoStagedGlobalNetworkPolicy: 3,
+      CalicoStagedKubernetesNetworkPolicy: 3,
       ReplicaSet: 4, Pod: 5,
     }
     return neighborhood.nodes
@@ -719,7 +722,7 @@ export function WorkloadView({
       icon: <Stethoscope className="w-4 h-4" />,
       hidden: !(renderDiagnoseTab && (isDiagnoseKind(apiKind, group) || (reachableVia?.length ?? 0) > 0)),
     },
-    { id: 'cost', label: 'Cost', icon: <DollarSign className="w-4 h-4" />, hidden: !costTabVisible },
+    { id: 'cost', label: 'Cost', icon: <Coins className="w-4 h-4" />, hidden: !costTabVisible },
     { id: 'yaml', label: 'YAML', icon: <FileText className="w-4 h-4" /> },
   ]
   const requestedTabAvailable = tabs.some((tab) => tab.id === requestedTab && !tab.hidden)

package/src/types/core.ts

@@ -202,6 +202,11 @@ export type CoreNodeKind =
   | 'KubeadmControlPlane' // Cluster API KubeadmControlPlane
   | 'ClusterClass'       // Cluster API ClusterClass
   | 'MachineHealthCheck' // Cluster API MachineHealthCheck
+  | 'CalicoNetworkPolicy'
+  | 'CalicoGlobalNetworkPolicy'
+  | 'CalicoStagedNetworkPolicy'
+  | 'CalicoStagedGlobalNetworkPolicy'
+  | 'CalicoStagedKubernetesNetworkPolicy'
 
 // NodeKind can be a core kind or any arbitrary CRD kind string
 export type NodeKind = CoreNodeKind | (string & {})
@@ -236,6 +241,11 @@ export function displayKind(kind: string): string {
     KubeadmControlPlane: 'Control Plane',
     ClusterClass: 'ClusterClass',
     MachineHealthCheck: 'Health Check',
+    CalicoNetworkPolicy: 'Calico NetworkPolicy',
+    CalicoGlobalNetworkPolicy: 'Calico GlobalNetworkPolicy',
+    CalicoStagedNetworkPolicy: 'Calico StagedNetworkPolicy',
+    CalicoStagedGlobalNetworkPolicy: 'Calico StagedGlobalNetworkPolicy',
+    CalicoStagedKubernetesNetworkPolicy: 'Calico StagedKubernetesNetworkPolicy',
   }
   return shortNames[kind] || kind
 }
@@ -258,6 +268,7 @@ export interface TopologyEdge {
   target: string
   type: EdgeType
   label?: string
+  partial?: boolean
   /** Hover tooltip for the edge label. Used by the Reachability view to keep the
    *  DECLARED route path available when the label shows an overridden tested path. */
   labelTitle?: string
@@ -444,12 +455,15 @@ export interface ClusterInfo {
 // Context info for context switching
 export interface ContextInfo {
   name: string
+  /** Original context name inside its source file. Set for isolated sources
+   *  so display code need not infer backend-added collision qualifiers. */
+  originalName?: string
   cluster: string
   user: string
   namespace: string
   isCurrent: boolean
-  /** Source kubeconfig label (e.g. "kube-cluster-paris"). Set by backend
-   *  only when 2+ kubeconfig files are loaded; empty otherwise. */
+  /** Source kubeconfig label (e.g. "kube-cluster-paris"). Set by the backend
+   *  for contexts loaded through the isolated source registry. */
   source?: string
 }
 
@@ -1204,6 +1218,13 @@ export interface TrafficFlow {
   bytesSent: number
   bytesRecv: number
   connections: number
+  /** The conversation's initiator could not be established, so source and
+   *  destination are ordered arbitrarily rather than describing a caller. */
+  directionUnknown?: boolean
+  /** 5xx responses per second. How a rate-based source reports failures: it
+   *  measures a rate rather than observing individual responses, so it has a
+   *  status code for no single flow. */
+  errorRate?: number
   verdict: string // forwarded, dropped, error
   lastSeen: string // ISO date string
 }
@@ -1236,6 +1257,9 @@ export interface AggregatedFlow {
   bytesRecv: number
   connections: number
   lastSeen: string
+  /** The conversation's initiator could not be established, so the endpoints are
+   *  ordered arbitrarily and the edge is drawn without an arrowhead. */
+  directionUnknown?: boolean
   l7Protocol?: string // HTTP, gRPC, DNS
   requestCount?: number
   errorCount?: number
@@ -1252,8 +1276,8 @@ export interface AggregatedFlow {
 
 // Cluster info for traffic detection
 export interface TrafficClusterInfo {
-  platform: string // gke, eks, aks, generic
-  cni: string // cilium, calico, flannel, vpc-cni, azure-cni
+  platform: string // rke2, gke, eks, aks, minikube, kind, docker-desktop, openshift, rancher, generic
+  cni: string // cilium, canal, calico, flannel, vpc-cni, azure-cni, gke-native, unknown
   dataplaneV2: boolean
   clusterName?: string
   k8sVersion?: string
@@ -1307,6 +1331,11 @@ export interface TrafficFlowsResponse {
   flows: TrafficFlow[]
   aggregated: AggregatedFlow[]
   warning?: string  // Non-fatal warning (e.g., query errors)
+  /** 'transient' (or absent) means the condition may clear on its own and a
+   *  retry is worthwhile. 'partial' means the flows are correct but incomplete
+   *  for a reason retrying cannot change, so show the warning next to them and
+   *  do not refetch. */
+  warningKind?: 'transient' | 'partial'
 }
 
 // Wizard state for traffic setup
@@ -1424,6 +1453,9 @@ export interface WorkloadRevision {
   isCurrent: boolean
   replicas: number
   template?: string // Pod template spec as YAML (for revision diff)
+  // Rollouts only: mid-canary isCurrent (rolling out) and isStable (serving traffic) differ.
+  isStable?: boolean
+  podHash?: string
 }
 
 // Workload log stream event data

package/src/types/policy.ts

@@ -26,17 +26,168 @@ export interface PolicyResourceCounts {
   skip: number
 }
 
+/** One resource a policy recorded an outcome for, from
+ *  GET /api/policy/policies/{policy}. */
+export interface PolicyCoverageSubject {
+  group?: string
+  kind: string
+  namespace?: string
+  name: string
+  result: PolicyResult
+  message?: string
+  /** Matched through a rule Kyverno synthesised from an authored Pod rule,
+   *  not through a rule the user wrote. */
+  autogen?: boolean
+}
+
+export interface PolicyCoverageRule {
+  /** Empty for the modern CEL families, which have no named rules. */
+  rule: string
+  counts: PolicyResourceCounts
+  subjects: PolicyCoverageSubject[]
+  total: number
+  truncated?: boolean
+  /** How many of `total` the namespace view filter held back. `counts` still
+   *  describe every outcome, so the two must be read together. */
+  hiddenByFilter?: number
+  /** The non-passing part of `hiddenByFilter`. Only non-passing subjects are
+   *  listed, so this is what separates a row the server cap dropped from one
+   *  the view filter held back. */
+  hiddenNotable?: number
+}
+
+/** What one policy decided about the cluster — the inverse of
+ *  PolicyResourceResponse.
+ *
+ *  Carries one partiality the per-resource view never needed: a resource may be
+ *  missing because the caller cannot read its namespace, so an absent subject is
+ *  not evidence of absence. `withheldNamespaces` is how the UI says so. */
+export interface PolicyCoverageResponse {
+  evaluated: boolean
+  status: string
+  reasonCode?: string
+  deniedGroups?: string[]
+  liveUpdates: boolean
+  /** The report-side name that matched — namespaced policies report as
+   *  "namespace/name". */
+  policy: string
+  counts: PolicyResourceCounts
+  scopeNamespaces: number
+  withheldNamespaces: number
+  clusterScoped?: boolean
+  /** Separate from withheldNamespaces — a cluster-scoped subject has no
+   *  namespace to name. */
+  withheldClusterScoped?: boolean
+  /** Outcomes dropped because they came only from a report family this caller
+   *  cannot read. The server drops them before counting, so the note can state
+   *  how many were left out rather than hedging that some might have been. */
+  withheldByFamily?: number
+  /** Report families the CALLER cannot read. Distinct from deniedGroups, which
+   *  are the ones radar's own probe could not read. */
+  unreadableFamilies?: string[]
+  /** How many distinct resources these outcomes describe, and how many of those
+   *  have at least one non-passing outcome. One resource matched by two rules
+   *  produces two outcomes, so any sentence saying "resources" needs these —
+   *  `counts` and `examined` are checks. Not derivable client-side: the per-rule
+   *  subject lists are capped. */
+  subjects?: number
+  subjectsFailing?: number
+  /** How many outcomes back these counts. */
+  examined: number
+  /** How many subjects the namespace view filter held back, across all rules. */
+  hiddenByFilter?: number
+  engines?: string[]
+  rules: PolicyCoverageRule[]
+}
+
 export interface PolicyResourceResponse {
   /** False whenever the answer is "we could not check". Never treat an empty
    *  findings array as "clean" without consulting this first. */
   evaluated: boolean
   status: string
   reasonCode?: string
-  /** Report families the caller could not read. Present even when evaluated:
-   *  the answer is real but incomplete. */
+  /** Report families RADAR's own probe could not read, so nobody's answer
+   *  carries them — not the same as `withheldByFamily`, which is what THIS
+   *  caller may not see. Present even when evaluated: the answer is real but
+   *  incomplete. */
   deniedGroups?: string[]
   /** False when the index is frozen at its initial contents. */
   liveUpdates: boolean
   counts: PolicyResourceCounts
   findings: PolicyResourceFinding[]
+  /** Findings dropped because they came only from a report family this caller
+   *  cannot read. `counts` excludes them too, so an all-passing count with this
+   *  set is not an all-clear — it is the part of the answer they may see. */
+  withheldByFamily?: number
+}
+
+/** Background work Kyverno currently has in flight for one policy, from
+ *  GET /api/policy/policies/{policy}/queued. Computed server-side: the requests
+ *  live in the engine's namespace, not the policy's. */
+export interface PolicyQueuedResponse {
+  /** Zero is a real answer — Kyverno deletes these seconds after they complete. */
+  requests: number
+  byState?: Record<string, number>
+  /** Separates healthy churn from a stopped controller. */
+  oldestPending?: string
+  /** The only diagnosis these objects carry. */
+  messages?: string[]
+}
+
+/** One Cluster pinned to a CloudNativePG image catalog. */
+export interface CNPGCatalogUser {
+  namespace: string
+  name: string
+  /** Absent when the reference carries no major — the screen must not render
+   *  "asks for PostgreSQL 0". */
+  major?: number
+  /** A catalog-pinned Cluster has no spec.imageName, so this is the only place
+   *  the image it actually resolved appears. */
+  image?: string
+}
+
+/** Clusters referencing one image catalog, from the CNPG catalog-users endpoint. */
+export interface CNPGCatalogUsersResponse {
+  clusters: CNPGCatalogUser[]
+}
+
+/** What one Velero BackupStorageLocation holds, from the stored-backups lookup. */
+export interface VeleroStoredBackupsResponse {
+  backups: Array<{
+    namespace: string
+    name: string
+    phase?: string
+    expiration?: string
+    completed?: string
+  }>
+  /** How many reached Completed and are still inside their retention — the rest
+   *  are stored here but are not something to restore from. Counted over the
+   *  whole location, like `stored`: recomputing it from the capped list above
+   *  undercounts every location big enough to be capped. */
+  restorable: number
+  /** How many reached Completed but have aged out. Same scope as `restorable`. */
+  expired?: number
+  /** How many the location holds in total, counted before the list was capped. */
+  stored?: number
+  /** The list above is a page, not the whole location. */
+  truncated?: boolean
+}
+
+/** One warning or error behind a Velero run's counts, with the scope Velero
+ *  filed it under: "velero", "cluster", or a namespace name. */
+export interface VeleroMessage {
+  scope: string
+  message: string
+}
+
+/** What a Backup or Restore actually reported, fetched on demand.
+ *
+ *  The counts live on the CR; these messages do not — they are in a results
+ *  file in object storage that only Velero's controller can hand out a link to.
+ *  So this is never present until someone asks for it. */
+export interface VeleroRunMessagesResponse {
+  warnings: VeleroMessage[]
+  errors: VeleroMessage[]
+  /** Set when the results file held more than were returned. */
+  truncated?: boolean
 }