@skyhook-io/radar-app 1.17.0 → 1.17.1

package/src/components/cnpg/blocking.ts

@@ -0,0 +1,131 @@
+import type { CNPGBackend } from '../../api/cnpg-sessions'
+
+export interface BlockingNode {
+  session: CNPGBackend
+  children: BlockingNode[]
+  /** Blockers of this session other than the parent it is shown under. */
+  alsoWaitsOn: number[]
+  /** This session waits on one of its own ancestors: a lock cycle (deadlock). */
+  cycle?: boolean
+}
+
+/**
+ * Blocker → victim trees from pg_blocking_pids. A root blocks others and
+ * waits on nobody listed; a victim appears under each blocker it waits on.
+ * Sessions left over after walking from the roots are in a cycle (a deadlock
+ * PostgreSQL has not resolved yet) and become roots of their own, marked.
+ */
+export function buildBlockingTree(sessions: CNPGBackend[]): BlockingNode[] {
+  const byPid = new Map(sessions.map((s) => [s.pid, s]))
+  const victimsOf = new Map<number, CNPGBackend[]>()
+  for (const s of sessions) {
+    for (const b of s.blockedBy) {
+      if (!byPid.has(b)) continue
+      victimsOf.set(b, [...(victimsOf.get(b) ?? []), s])
+    }
+  }
+  const seen = new Set<number>()
+  const build = (s: CNPGBackend, parent: number | undefined, path: Set<number>): BlockingNode => {
+    seen.add(s.pid)
+    const node: BlockingNode = { session: s, children: [], alsoWaitsOn: s.blockedBy.filter((b) => b !== parent) }
+    const nextPath = new Set(path).add(s.pid)
+    for (const v of victimsOf.get(s.pid) ?? []) {
+      if (nextPath.has(v.pid)) {
+        node.cycle = true
+        continue
+      }
+      node.children.push(build(v, s.pid, nextPath))
+    }
+    return node
+  }
+  const roots = sessions
+    .filter((s) => s.blockedBy.every((b) => !byPid.has(b)) && (victimsOf.get(s.pid)?.length ?? 0) > 0)
+    .map((s) => build(s, undefined, new Set()))
+  // Waiting on a backend that is not listed (capped, or ended between reads).
+  for (const s of sessions) {
+    if (!seen.has(s.pid) && s.blockedBy.length > 0 && s.blockedBy.every((b) => !byPid.has(b))) roots.push(build(s, undefined, new Set()))
+  }
+  for (const s of sessions) {
+    if (!seen.has(s.pid)) {
+      const node = build(s, undefined, new Set())
+      node.cycle = true
+      roots.push(node)
+    }
+  }
+  return roots
+}
+
+/** How many sessions wait behind this one, directly or transitively. */
+export function countVictims(node: BlockingNode): number {
+  const pids = new Set<number>()
+  const walk = (n: BlockingNode) => {
+    for (const c of n.children) {
+      pids.add(c.session.pid)
+      walk(c)
+    }
+  }
+  walk(node)
+  return pids.size
+}
+
+export interface CNPGConnectionFigure {
+  /** e.g. "6 in use" */
+  value: string
+  /** What it is out of, e.g. "of 97 usable (max_connections 100, 3 reserved)", shown beneath. */
+  limit: string
+  /** What the figure is measured against, and from where. */
+  detail: string
+  /** used / usable, for a headroom bar; undefined when the limit is unknown. */
+  ratio?: number
+  tone?: 'degraded' | 'unhealthy'
+}
+
+function connectionTone(ratio: number | undefined): CNPGConnectionFigure['tone'] {
+  if (ratio === undefined) return undefined
+  return ratio >= 0.95 ? 'unhealthy' : ratio >= 0.8 ? 'degraded' : undefined
+}
+
+/**
+ * The one connections figure the Sessions section shows. pg_stat_activity
+ * (read over exec) knows the superuser reserve, so it gives usable headroom;
+ * the exporter's count stands in when that read is unavailable and says what
+ * it cannot account for.
+ */
+export function cnpgConnectionFigure(
+  exec: { maxConnections?: number; superuserReservedConnections?: number; clientBackends?: number } | undefined,
+  exporter?: { sessionsTotal?: number; maxConnections?: number },
+): CNPGConnectionFigure | undefined {
+  if (exec?.maxConnections !== undefined && exec.clientBackends !== undefined) {
+    const reserved = exec.superuserReservedConnections ?? 0
+    const usable = exec.maxConnections - reserved
+    const ratio = usable > 0 ? exec.clientBackends / usable : 1
+    return {
+      value: `${exec.clientBackends} in use`,
+      limit: `of ${usable} usable (max_connections ${exec.maxConnections}, ${reserved} reserved)`,
+      detail: `Client backends from pg_stat_activity; ${reserved} of max_connections ${exec.maxConnections} are reserved for superusers`,
+      ratio,
+      tone: connectionTone(ratio),
+    }
+  }
+  if (exporter?.sessionsTotal === undefined) return undefined
+  if (exporter.maxConnections === undefined) {
+    return { value: `${exporter.sessionsTotal} in use`, limit: 'max_connections not reported', detail: 'Sessions from the metrics exporter' }
+  }
+  const ratio = exporter.maxConnections > 0 ? exporter.sessionsTotal / exporter.maxConnections : 1
+  return {
+    value: `${exporter.sessionsTotal} in use`,
+    limit: `of max_connections ${exporter.maxConnections} (superuser reserve not read)`,
+    detail: 'Sessions from the metrics exporter; the superuser reserve is read only with exec into the instance',
+    ratio,
+    tone: connectionTone(ratio),
+  }
+}
+
+/**
+ * Whether no instance has metrics readings (null = none for that Pod,
+ * undefined = not answered yet), so the panel says so once. That can be a
+ * missing metrics API or Pods not sampled yet; it never claims which.
+ */
+export function cnpgNoMetricsReadings(results: (unknown | null | undefined)[]): boolean {
+  return results.length > 0 && results.every((r) => r === null)
+}

package/src/components/cnpg/coverageText.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, it } from 'vitest'
+import { coverageEmpty, coverageLabel, incompleteKindsText } from './shared'
+
+describe('coverage wording', () => {
+  it('names every cause the server named, whatever the overall state', () => {
+    const mixed = { state: 'uncached' as const, uncachedNamespaces: ['b'], deniedNamespaces: ['c'] }
+    expect(coverageEmpty(mixed, 'Pods')).toBe('No Pods visible: no access in c; Radar does not cache Pods in b.')
+    expect(coverageLabel(mixed)).toBe('no access in c; not cached by Radar in b')
+  })
+  it('falls back to the state when no namespace is named', () => {
+    expect(coverageEmpty({ state: 'uncached' }, 'Pods')).toBe('Radar does not cache Pods in this scope.')
+    expect(coverageEmpty({ state: 'partial' }, 'Pods')).toBe('No Pods visible. Some namespaces were not read.')
+    expect(coverageLabel({ state: 'denied' })).toBe('no access')
+  })
+  it('says each reason once for the kinds it applies to', () => {
+    const text = incompleteKindsText(['clusters', 'backups', 'clusterImageCatalogs'], {
+      clusters: { state: 'partial' },
+      backups: { state: 'partial' },
+      clusterImageCatalogs: { state: 'uncached' },
+    })
+    expect(text).toBe('Cluster, Backup (not read in some namespaces); ClusterImageCatalog (not cached by Radar)')
+  })
+  it("lists Jobs it could not read, since a Cluster's Job Pods are read only where they are", () => {
+    expect(incompleteKindsText(['clusters'], { clusters: { state: 'partial' } }, { state: 'denied' })).toBe('Cluster (not read in some namespaces); Job (no access)')
+    expect(incompleteKindsText([], {}, { state: 'full' })).toBe('')
+  })
+})

package/src/components/cnpg/creation/CNPGTargetFields.tsx

@@ -0,0 +1,110 @@
+import { useId, type InputHTMLAttributes } from 'react'
+import { Input } from '@skyhook-io/k8s-ui'
+import type { CNPGTarget } from './targetModel'
+import { CNPG_FORM_FIELD as FIELD } from '../formFields'
+
+export function CNPGTargetFields({
+  value,
+  onChange,
+  idPrefix,
+  namespaces = [],
+  storageClasses = [],
+  namespaceFixed = false,
+  imageDescription,
+  imageRequired = false,
+  defaultClassDisabled = false,
+}: {
+  value: CNPGTarget
+  onChange: (value: CNPGTarget) => void
+  idPrefix: string
+  namespaces?: string[]
+  storageClasses?: string[]
+  namespaceFixed?: boolean
+  imageDescription?: string
+  imageRequired?: boolean
+  defaultClassDisabled?: boolean
+}) {
+  const listId = useId()
+  const set = (key: keyof CNPGTarget, next: string) => onChange({ ...value, [key]: next })
+  const input = (key: keyof CNPGTarget, label: string, props: InputHTMLAttributes<HTMLInputElement> = {}) => (
+    <label className="block" htmlFor={`${idPrefix}-${key}`}>
+      <span className="text-xs font-medium text-theme-text-secondary">{label}</span>
+      <Input
+        id={`${idPrefix}-${key}`}
+        value={value[key]}
+        onChange={(event) => set(key, event.target.value)}
+        autoComplete="off"
+        spellCheck={false}
+        className={FIELD}
+        {...props}
+      />
+    </label>
+  )
+  return (
+    <div className="space-y-4">
+      <div className="grid gap-3 sm:grid-cols-2">
+        {input('name', 'Cluster name', { placeholder: 'orders-db' })}
+        {namespaceFixed ? (
+          <div>
+            <span className="text-xs font-medium text-theme-text-secondary">Namespace</span>
+            <div className="mt-2 font-mono text-sm text-theme-text-primary">{value.namespace}</div>
+          </div>
+        ) : (
+          input('namespace', 'Namespace', { list: `${listId}-namespaces`, placeholder: 'Choose a namespace' })
+        )}
+        {input('instances', 'Instances', { type: 'number', min: 1, step: 1 })}
+        {input('size', 'Data volume size · per instance', { placeholder: '20Gi' })}
+      </div>
+      <p className="text-xs text-theme-text-tertiary">
+        One instance is the primary; the others are standbys. Choose storage for the data you expect to keep.
+      </p>
+      <div className="grid items-start gap-3 sm:grid-cols-2">
+        <div>
+          {input('storageClass', 'Storage class · optional', {
+            list: `${listId}-storage`,
+            placeholder: defaultClassDisabled ? 'No default class' : 'Cluster default',
+          })}
+          {defaultClassDisabled && !value.storageClass && (
+            <p className="mt-1 text-xs text-theme-text-tertiary">
+              The PVC template opts out of the default class. Keep empty to preserve that choice, or choose a class.
+            </p>
+          )}
+        </div>
+        <div>
+          {imageDescription ? (
+            <div>
+              <span className="text-xs font-medium text-theme-text-secondary">Recovery image</span>
+              <p className="mt-1 break-all font-mono text-sm text-theme-text-primary">{imageDescription}</p>
+              <p className="mt-1 text-xs text-theme-text-tertiary">
+                Physical recovery requires the PostgreSQL major used by the backup. Advanced YAML exposes the full configuration.
+              </p>
+            </div>
+          ) : (
+            <>
+              {input(
+                'image',
+                imageRequired ? 'PostgreSQL image · required for recovery' : 'PostgreSQL image · optional',
+                { placeholder: imageRequired ? 'Image matching the source PostgreSQL major' : 'Operator default' },
+              )}
+              <p className="text-xs text-theme-text-tertiary">
+                {imageRequired
+                  ? 'Choose an image for the PostgreSQL major used by the backup before restoring.'
+                  : 'Leave this empty to use the image selected by the operator.'}
+              </p>
+            </>
+          )}
+        </div>
+      </div>
+      <datalist id={`${listId}-namespaces`}>
+        {namespaces.map((name) => (
+          <option key={name} value={name} />
+        ))}
+      </datalist>
+      <datalist id={`${listId}-storage`}>
+        {storageClasses.map((name) => (
+          <option key={name} value={name} />
+        ))}
+      </datalist>
+    </div>
+  )
+}

package/src/components/cnpg/creation/targetModel.test.ts

@@ -0,0 +1,137 @@
+import { expect, it } from 'vitest'
+import yaml from 'yaml'
+import {
+  cnpgTargetDraft,
+  cnpgTargetFromManifest,
+  cnpgTargetIssue,
+  onlyCNPGTargetChanged,
+  sameCNPGRecoveryIdentity,
+  updateCNPGTargetYaml,
+  withCNPGTarget,
+} from './targetModel'
+
+const cluster = {
+  apiVersion: 'postgresql.cnpg.io/v1',
+  kind: 'Cluster',
+  metadata: { name: 'orders', namespace: 'db', labels: { app: 'orders' } },
+  spec: {
+    instances: 3,
+    storage: { size: '20Gi' },
+    imageCatalogRef: { kind: 'ClusterImageCatalog', name: 'pg', major: 17 },
+    bootstrap: { recovery: { source: 'archive' } },
+    externalClusters: [{ name: 'archive' }],
+    postgresql: { parameters: { max_connections: '200' } },
+    walStorage: { size: '2Gi' },
+  },
+}
+
+it('updates common inputs without flattening inherited or advanced configuration', () => {
+  const target = {
+    ...cnpgTargetFromManifest(cluster),
+    name: 'restored',
+    instances: '2',
+    size: '40Gi',
+    storageClass: 'fast',
+  }
+  const next = withCNPGTarget(cluster, target)
+  expect(next).toMatchObject({
+    metadata: { name: 'restored', labels: { app: 'orders' } },
+    spec: {
+      instances: 2,
+      storage: { size: '40Gi', storageClass: 'fast' },
+      imageCatalogRef: cluster.spec.imageCatalogRef,
+      bootstrap: cluster.spec.bootstrap,
+      postgresql: cluster.spec.postgresql,
+      walStorage: cluster.spec.walStorage,
+    },
+  })
+  expect(cluster.spec.storage.size).toBe('20Gi')
+  expect(sameCNPGRecoveryIdentity(next, cluster)).toBe(true)
+  expect(onlyCNPGTargetChanged(cluster, next, target)).toBe(true)
+  expect(onlyCNPGTargetChanged(cluster, { ...next, spec: { ...next.spec, walStorage: { size: '5Gi' } } }, target)).toBe(
+    false,
+  )
+})
+
+it('preserves complex PVC templates and explicit no-default-class semantics', () => {
+  const source = {
+    ...cluster,
+    spec: {
+      ...cluster.spec,
+      storage: {
+        pvcTemplate: {
+          accessModes: ['ReadWriteOnce'],
+          storageClassName: '',
+          volumeMode: 'Block',
+          resources: { requests: { storage: '30Gi' } },
+        },
+      },
+    },
+  }
+  const target = { ...cnpgTargetFromManifest(source), size: '60Gi' }
+  const next = withCNPGTarget(source, target)
+  expect(next.spec.storage).toEqual({
+    pvcTemplate: {
+      accessModes: ['ReadWriteOnce'],
+      storageClassName: '',
+      volumeMode: 'Block',
+      resources: { requests: { storage: '60Gi' } },
+    },
+  })
+  const selected = withCNPGTarget(next, { ...target, storageClass: 'fast' })
+  expect(selected.spec.storage.storageClass).toBe('fast')
+  expect(selected.spec.storage.pvcTemplate.storageClassName).toBe('')
+  const cleared = withCNPGTarget(selected, { ...target, storageClass: '' })
+  expect(cleared.spec.storage.storageClass).toBeUndefined()
+  expect(cleared.spec.storage.pvcTemplate.storageClassName).toBe('')
+})
+
+it('retains comments and arbitrary settings through a form round-trip', () => {
+  const text = `# archive must stay isolated\n${yaml.stringify(cluster, { version: '1.1' })}`
+  const next = updateCNPGTargetYaml(text, { ...cnpgTargetFromManifest(cluster), name: 'new-orders', size: '50Gi' })!
+  expect(next).toContain('archive must stay isolated')
+  expect(cnpgTargetDraft(next)).toMatchObject({
+    metadata: { name: 'new-orders' },
+    spec: { storage: { size: '50Gi' }, postgresql: { parameters: { max_connections: '200' } } },
+  })
+})
+
+it('adds missing storage parents as Kubernetes mappings in YAML 1.1', () => {
+  const source = { ...cluster, spec: { instances: 1 } }
+  const text = yaml.stringify(source, { version: '1.1' })
+  const next = updateCNPGTargetYaml(text, { ...cnpgTargetFromManifest(source), size: '20Gi', storageClass: 'fast' })!
+  expect(next).not.toContain('!!omap')
+  expect(cnpgTargetDraft(next)?.spec.storage).toEqual({ size: '20Gi', storageClass: 'fast' })
+})
+
+it.each([
+  '',
+  'kind: [',
+  yaml.stringify({ ...cluster, apiVersion: 'cluster.x-k8s.io/v1beta1' }),
+  `${yaml.stringify(cluster)}---\nkind: Secret\n`,
+  yaml.stringify({ ...cluster, spec: 'bad' }),
+  yaml.stringify({ ...cluster, spec: { storage: 'bad' } }),
+  yaml.stringify({ ...cluster, spec: { storage: { pvcTemplate: [] } } }),
+])('keeps unsupported YAML outside the form projection: %s', (text) => {
+  expect(cnpgTargetDraft(text)).toBeNull()
+  expect(updateCNPGTargetYaml(text, cnpgTargetFromManifest(cluster))).toBeNull()
+})
+
+it('requires actual storage and a known recovery image while allowing standard quantities', () => {
+  const target = cnpgTargetFromManifest(cluster)
+  expect(cnpgTargetIssue(target)).toBeUndefined()
+  for (const size of ['20Gi', '1e9', '2G']) expect(cnpgTargetIssue({ ...target, size })).toBeUndefined()
+  for (const size of ['', '0', '-2Gi', 'banana']) expect(cnpgTargetIssue({ ...target, size })).toContain('volume size')
+  for (const instances of ['0', '1.5', '-2', '9007199254740993'])
+    expect(cnpgTargetIssue({ ...target, instances })).toContain('whole number')
+  expect(cnpgTargetIssue(target, true)).toContain('matching the source')
+  expect(cnpgTargetIssue({ ...target, image: 'postgres:17' }, true)).toBeUndefined()
+})
+
+it('changes an image override without inventing a catalog or losing the recovery source', () => {
+  const source = { ...cluster, spec: { ...cluster.spec, imageCatalogRef: undefined, imageName: 'postgres:17' } }
+  const next = withCNPGTarget(source, { ...cnpgTargetFromManifest(source), image: 'postgres:17.6' })
+  expect(next.spec.imageName).toBe('postgres:17.6')
+  expect(next.spec.bootstrap).toEqual(source.spec.bootstrap)
+  expect(sameCNPGRecoveryIdentity(source, next)).toBe(false)
+})

package/src/components/cnpg/creation/targetModel.ts

@@ -0,0 +1,149 @@
+import yaml from 'yaml'
+import { isApiGroup, parseQuantityToNumber } from '@skyhook-io/k8s-ui'
+import { validateRFC1123Label } from '@skyhook-io/k8s-ui/utils/validators'
+
+export interface CNPGTarget {
+  name: string
+  namespace: string
+  instances: string
+  size: string
+  storageClass: string
+  image: string
+}
+
+export function cnpgTargetFromManifest(manifest: Record<string, any>): CNPGTarget {
+  const storage = manifest.spec?.storage
+  return {
+    name: manifest.metadata?.name ?? '',
+    namespace: manifest.metadata?.namespace ?? '',
+    instances: String(manifest.spec?.instances ?? 1),
+    size: storage?.size ?? storage?.pvcTemplate?.resources?.requests?.storage ?? '',
+    storageClass: storage?.storageClass ?? storage?.pvcTemplate?.storageClassName ?? '',
+    image: manifest.spec?.imageName ?? '',
+  }
+}
+
+export function cnpgTargetIssue(target: CNPGTarget, requireImage = false): string | undefined {
+  const name = validateRFC1123Label(target.name.trim())
+  if (!name.valid) return `Cluster name ${name.error}.`
+  const namespace = validateRFC1123Label(target.namespace.trim())
+  if (!namespace.valid) return `Namespace ${namespace.error}.`
+  if (
+    !/^\d+$/.test(target.instances) ||
+    Number(target.instances) < 1 ||
+    !Number.isSafeInteger(Number(target.instances))
+  )
+    return 'Choose a positive whole number of instances.'
+  if (!(parseQuantityToNumber(target.size.trim()) > 0)) return 'Enter a positive data volume size, such as 20Gi.'
+  if (requireImage && !target.image.trim()) return 'Enter the image matching the source PostgreSQL major version.'
+}
+
+export function withCNPGTarget(manifest: Record<string, any>, target: CNPGTarget): Record<string, any> {
+  const out = structuredClone(manifest)
+  out.metadata = { ...out.metadata, name: target.name.trim(), namespace: target.namespace.trim() }
+  out.spec.instances = Number(target.instances)
+  const storage = out.spec.storage ?? (out.spec.storage = {})
+  if (storage.size !== undefined || !storage.pvcTemplate?.resources?.requests?.storage)
+    storage.size = target.size.trim()
+  else storage.pvcTemplate.resources.requests.storage = target.size.trim()
+  if (target.storageClass.trim() !== cnpgTargetFromManifest(manifest).storageClass) {
+    if (target.storageClass.trim()) storage.storageClass = target.storageClass.trim()
+    else {
+      delete storage.storageClass
+      if (storage.pvcTemplate && storage.pvcTemplate.storageClassName !== '')
+        delete storage.pvcTemplate.storageClassName
+    }
+  }
+  if (!out.spec.imageCatalogRef) {
+    if (target.image.trim()) out.spec.imageName = target.image.trim()
+    else delete out.spec.imageName
+  }
+  return out
+}
+
+export function cnpgTargetDraft(text: string): Record<string, any> | null {
+  try {
+    const documents = yaml.parseAllDocuments(text, { version: '1.1' })
+    if (documents.length !== 1 || documents[0].errors.length > 0) return null
+    const document = documents[0]
+    for (const path of [
+      ['spec'],
+      ['spec', 'storage'],
+      ['spec', 'storage', 'pvcTemplate'],
+      ['spec', 'storage', 'pvcTemplate', 'resources'],
+      ['spec', 'storage', 'pvcTemplate', 'resources', 'requests'],
+    ]) {
+      const node = document.getIn(path, true)
+      if (node !== undefined && !yaml.isMap(node)) return null
+    }
+    const manifest = documents[0].toJS()
+    if (
+      manifest?.kind !== 'Cluster' ||
+      !isApiGroup(manifest.apiVersion, 'postgresql.cnpg.io') ||
+      !manifest.spec ||
+      typeof manifest.metadata?.name !== 'string' ||
+      typeof manifest.metadata?.namespace !== 'string'
+    )
+      return null
+    const target = cnpgTargetFromManifest(manifest)
+    if ([target.size, target.storageClass, target.image].some((value) => typeof value !== 'string')) return null
+    return manifest
+  } catch {
+    return null
+  }
+}
+
+export function updateCNPGTargetYaml(text: string, target: CNPGTarget): string | null {
+  const current = cnpgTargetDraft(text)
+  if (!current) return null
+  const next = withCNPGTarget(current, target)
+  const document = yaml.parseDocument(text, { version: '1.1' })
+  const paths = [
+    ['metadata', 'name'],
+    ['metadata', 'namespace'],
+    ['spec', 'instances'],
+    ['spec', 'storage', 'size'],
+    ['spec', 'storage', 'storageClass'],
+    ['spec', 'storage', 'pvcTemplate', 'resources', 'requests', 'storage'],
+    ['spec', 'storage', 'pvcTemplate', 'storageClassName'],
+    ['spec', 'imageName'],
+  ]
+  for (const path of paths) {
+    const at = (object: Record<string, any>) => path.reduce<any>((value, key) => value?.[key], object)
+    if (at(current) === at(next)) continue
+    if (at(next) === undefined) document.deleteIn(path)
+    else {
+      // YAML 1.1 creates !!omap for missing setIn parents; Kubernetes expects plain mappings.
+      for (let depth = 1; depth < path.length; depth++) {
+        const parent = path.slice(0, depth)
+        if (!document.hasIn(parent)) document.setIn(parent, document.createNode({}))
+      }
+      document.setIn(path, at(next))
+    }
+  }
+  return document.toString()
+}
+
+export function sameCNPGRecoveryIdentity(left: Record<string, any>, right: Record<string, any>): boolean {
+  const identity = (manifest: Record<string, any>) => ({
+    bootstrap: manifest.spec.bootstrap,
+    externalClusters: manifest.spec.externalClusters,
+    imageName: manifest.spec.imageName,
+    imageCatalogRef: manifest.spec.imageCatalogRef,
+  })
+  return (
+    yaml.stringify(identity(left), { sortMapEntries: true }) ===
+    yaml.stringify(identity(right), { sortMapEntries: true })
+  )
+}
+
+export function onlyCNPGTargetChanged(
+  before: Record<string, any>,
+  after: Record<string, any>,
+  target: CNPGTarget,
+): boolean {
+  return (
+    yaml.stringify(withCNPGTarget(before, target), { sortMapEntries: true }) ===
+    yaml.stringify(after, { sortMapEntries: true })
+  )
+}

package/src/components/cnpg/fleetStatus.test.ts

@@ -0,0 +1,46 @@
+import { describe, expect, it } from 'vitest'
+import { buildCNPGFleet, type CNPGFleetRow, type CNPGProblem } from '@skyhook-io/k8s-ui'
+import { cnpgInstancePillLabel, cnpgPillsToShow, cnpgRowStatus } from './fleetStatus'
+
+const problem = (severity: CNPGProblem['severity'], title: string) => ({ id: title, severity, title }) as CNPGProblem
+const row = (over: Partial<CNPGFleetRow>) =>
+  ({ attention: false, problems: [], controllerStatus: { text: 'Cluster in healthy state', level: 'healthy' }, ...over }) as CNPGFleetRow
+
+describe('cnpgRowStatus', () => {
+  it('leads with the most severe problem and counts the rest', () => {
+    expect(cnpgRowStatus(row({ attention: true, problems: [problem('warning', 'Backup failed: disk'), problem('critical', 'WAL archiving failing')] }))).toEqual({
+      tone: 'unhealthy',
+      label: 'Critical: WAL archiving failing (+1 more)',
+    })
+    expect(cnpgRowStatus(row({ attention: true, problems: [problem('warning', 'Backup failed: disk'), problem('posture', 'No backup schedule')] }))).toEqual({
+      tone: 'degraded',
+      label: 'Needs attention: Backup failed: disk (+1 more)',
+    })
+  })
+  it('says no problems only with a readable phase, never healthy when unknown', () => {
+    expect(cnpgRowStatus(row({}))).toEqual({ tone: 'healthy', label: 'No concerns detected in what Radar read · CNPG phase: Cluster in healthy state' })
+    const unknown = cnpgRowStatus(row({ controllerStatus: { text: '', level: 'unknown' } }))
+    expect(unknown).toEqual({ tone: 'unknown', label: 'Status unknown · CNPG phase: not reported' })
+    expect(unknown.label).not.toContain('No concerns')
+    expect(cnpgRowStatus(row({ controllerStatus: { text: 'Upgrading cluster', level: 'degraded' } })).tone).toBe('degraded')
+  })
+})
+
+describe('cnpgInstancePillLabel', () => {
+  it('names a replica as a standby too', () => {
+    expect(cnpgInstancePillLabel({ name: 'pg-wal-failing-1', role: 'replica', ready: false })).toBe('pg-wal-failing-1 · replica (standby) · Pod not ready')
+    expect(cnpgInstancePillLabel({ name: 'pg-1', role: 'primary', ready: null })).toBe('pg-1 · primary · Pod readiness unknown')
+  })
+})
+
+describe('cnpgPillsToShow', () => {
+  it('shows every pill up to the bound, and otherwise leaves room for "+N"', () => {
+    expect(cnpgPillsToShow([1, 2, 3, 4, 5], 5)).toEqual({ shown: [1, 2, 3, 4, 5], hidden: [] })
+    expect(cnpgPillsToShow([1, 2, 3, 4, 5, 6, 7], 5)).toEqual({ shown: [1, 2, 3, 4], hidden: [5, 6, 7] })
+  })
+})
+
+it('gives a destination-blocked schedule an amber fleet status', () => {
+  const fleet = buildCNPGFleet({ installed: true, context: 'test', namespaces: null, coverage: { clusters: { state: 'full' }, pods: { state: 'full' }, scheduledBackups: { state: 'full' } }, objects: { clusters: [{ apiVersion: 'postgresql.cnpg.io/v1', kind: 'Cluster', metadata: { name: 'payments', namespace: 'db' }, spec: { instances: 1 }, status: { phase: 'Cluster in healthy state', readyInstances: 1 } }], scheduledBackups: [{ metadata: { name: 'payments-nightly', namespace: 'db' }, spec: { cluster: { name: 'payments' } } }] }, issues: [{ id: 'blocked-schedule', reason: 'CNPGScheduleDestinationMissing', severity: 'warning', kind: 'ScheduledBackup', group: 'postgresql.cnpg.io', namespace: 'db', name: 'payments-nightly', message: 'Backup schedule payments-nightly cannot run: no backup destination' }], audit: [], backupsOmitted: 0 })
+  expect(cnpgRowStatus(fleet.rows[0])).toMatchObject({ tone: 'degraded', label: 'Needs attention: Backup schedule payments-nightly cannot run: no backup destination' })
+})

package/src/components/cnpg/fleetStatus.ts

@@ -0,0 +1,43 @@
+import type { CNPGFleetRow, HealthLevel } from '@skyhook-io/k8s-ui'
+
+/**
+ * A fleet row's status dot and the sentence behind it. Problems (warning or
+ * worse) decide it first; without any, the operator's phase does, and a phase
+ * Radar cannot read stays unknown rather than healthy.
+ */
+export function cnpgRowStatus(row: Pick<CNPGFleetRow, 'attention' | 'problems' | 'controllerStatus'>): { tone: HealthLevel; label: string } {
+  const phase = `CNPG phase: ${row.controllerStatus.text || 'not reported'}`
+  const counted = row.problems.filter((p) => p.severity !== 'posture')
+  if (row.attention && counted.length > 0) {
+    const critical = counted.filter((p) => p.severity === 'critical')
+    const lead = critical[0] ?? counted[0]
+    // The same count the Needs attention cell shows: every other problem, posture included.
+    const more = row.problems.length - 1
+    return {
+      tone: critical.length > 0 ? 'unhealthy' : 'degraded',
+      label: `${critical.length > 0 ? 'Critical' : 'Needs attention'}: ${lead.title}${more > 0 ? ` (+${more} more)` : ''}`,
+    }
+  }
+  const level = row.controllerStatus.level
+  switch (level) {
+    case 'healthy':
+    case 'neutral':
+      return { tone: level, label: `No concerns detected in what Radar read · ${phase}` }
+    case 'unknown':
+      return { tone: 'unknown', label: `Status unknown · ${phase}` }
+    default:
+      return { tone: level, label: `No concerns detected, but the cluster is not healthy · ${phase}` }
+  }
+}
+
+/** "pg-1 · replica (standby) · not ready": CNPG's docs say standby where the role label says replica. */
+export function cnpgInstancePillLabel(pod: CNPGFleetRow['pods'][number]): string {
+  const role = pod.role === 'primary' ? 'primary' : pod.role === 'replica' ? 'replica (standby)' : 'role unknown'
+  const ready = pod.ready === true ? 'Pod ready' : pod.ready === false ? 'Pod not ready' : 'Pod readiness unknown'
+  return `${pod.name} · ${role} · ${ready}`
+}
+
+/** The instance pills a fleet row shows (primary first, as listed) and those left for the "+N" hover. */
+export function cnpgPillsToShow<T>(pods: T[], max: number): { shown: T[]; hidden: T[] } {
+  return pods.length <= max ? { shown: pods, hidden: [] } : { shown: pods.slice(0, max - 1), hidden: pods.slice(max - 1) }
+}

package/src/components/cnpg/formFields.ts

@@ -0,0 +1,2 @@
+export const CNPG_FORM_FIELD =
+  'mt-1 w-full rounded-lg border border-theme-border bg-theme-base px-3 py-1.5 text-sm text-theme-text-primary'

package/src/components/cnpg/grantText.test.tsx

@@ -0,0 +1,11 @@
+import { renderToStaticMarkup } from 'react-dom/server'
+import { describe, expect, it } from 'vitest'
+import { GrantText } from '../workspace/layout'
+
+describe('GrantText', () => {
+  it('keeps the verb and resource together, with the scope as plain text', () => {
+    const html = renderToStaticMarkup(<GrantText grant={{ verb: 'get', group: 'admissionregistration.k8s.io', resource: 'mutatingwebhookconfigurations' }} />)
+    expect(html).toMatch(/<code[^>]*whitespace-nowrap[^>]*>get mutatingwebhookconfigurations.admissionregistration.k8s.io<\/code> cluster-wide/)
+    expect(renderToStaticMarkup(<GrantText grant={{ verb: 'get', resource: 'pods', subresource: 'proxy', namespace: 'pgrt' }} />)).toMatch(/>get pods\/proxy<\/code> in namespace pgrt/)
+  })
+})