@skyhook-io/radar-app 1.16.3 → 1.17.1

package/src/components/cnpg/actions/CNPGPoolerActions.tsx

@@ -0,0 +1,79 @@
+import { useState } from 'react'
+import { Pause, Play } from 'lucide-react'
+import { ActionConfirmDialog, Tooltip } from '@skyhook-io/k8s-ui'
+import { useCNPGAction } from '../../../api/cnpg'
+import { actionDialogResult, capabilityReason } from '../../../api/actions'
+import { useCNPGPoolerCapabilities, type CNPGPoolerCapabilities } from '../../../api/cnpg-sessions'
+import { useToast } from '../../ui/Toast'
+import { useCNPGWriteGuard } from './useCNPGWriteGuard'
+
+const BUTTON =
+  'btn-secondary inline-flex shrink-0 items-center gap-1.5 whitespace-nowrap px-2.5 py-1.5 text-xs font-medium disabled:cursor-not-allowed'
+
+/** Pause or resume a Pooler's PgBouncers (spec.pgbouncer.paused). */
+export function CNPGPoolerActions({ namespace, name }: { namespace: string; name: string }) {
+  const caps = useCNPGPoolerCapabilities(namespace, name)
+  const [open, setOpen] = useState<'pause' | 'resume' | null>(null)
+  const data = caps.data
+  if (!data) return null
+  const kind = data.facts.paused ? 'resume' : 'pause'
+  const cap = data.actions[kind]
+  return (
+    <>
+      <Tooltip content={capabilityReason(cap)} position="bottom">
+        <button type="button" className={BUTTON} disabled={!cap.allowed} onClick={() => setOpen(kind)}>
+          {kind === 'pause' ? <Pause className="h-3.5 w-3.5" /> : <Play className="h-3.5 w-3.5" />}
+          {kind === 'pause' ? 'Pause' : 'Resume'}
+        </button>
+      </Tooltip>
+      {open && <PoolerDialog kind={open} caps={data} namespace={namespace} name={name} onClose={() => setOpen(null)} />}
+    </>
+  )
+}
+
+function PoolerDialog({ kind, caps, namespace, name, onClose }: { kind: 'pause' | 'resume'; caps: CNPGPoolerCapabilities; namespace: string; name: string; onClose: () => void }) {
+  const mutation = useCNPGAction('poolers', namespace, name, caps.context)
+  const { showSuccess } = useToast()
+  const guard = useCNPGWriteGuard({ namespace, name, scope: { kind: 'spec', paths: ['spec.pgbouncer.paused'] }, targetKind: 'Pooler' })
+  const pause = kind === 'pause'
+  const cap = caps.actions[kind]
+  const pods = caps.facts.deployment.readyReplicas
+  return (
+    <ActionConfirmDialog
+      open
+      onClose={onClose}
+      onConfirm={() =>
+        mutation.mutate(
+          { action: kind, request: { reviewedContext: caps.context, uid: caps.uid, facts: { paused: caps.facts.paused, generation: caps.facts.generation } } },
+          {
+            onSuccess: (r) => {
+              showSuccess(r.message)
+              onClose()
+            },
+          },
+        )
+      }
+      title={pause ? `Pause ${name}?` : `Resume ${name}?`}
+      subject={{ kind: 'Pooler', namespace, name }}
+      context={caps.context}
+      effect={
+        pause
+          ? `Every PgBouncer of this Pooler${pods !== undefined ? ` (${pods} ready)` : ''} waits for running queries to complete, disconnects from ${caps.facts.cluster}, and then holds new client queries until it is resumed. Clients stay connected but their queries wait.`
+          : `Every PgBouncer of this Pooler reconnects to ${caps.facts.cluster} and serves the client queries it was holding.`
+      }
+      notes={[
+        'The operator applies this with PgBouncer’s PAUSE / RESUME on each Pod. Radar shows each PgBouncer’s own state (SHOW STATE) once it has applied it, when you can exec into the Pods.',
+        ...(pause ? ['Clients whose queries wait longer than their own timeouts see errors; a long-running transaction delays the pause.'] : []),
+      ]}
+      writes={[{ summary: `patch Pooler ${namespace}/${name}`, detail: `spec.pgbouncer.paused = ${pause}` }]}
+      guard={guard.node}
+      guardSatisfied={guard.satisfied}
+      typedConfirmation={pause ? name : undefined}
+      confirmLabel={pause ? 'Pause' : 'Resume'}
+      disruptive={pause}
+      disabledReason={capabilityReason(cap)}
+      isLoading={mutation.isPending}
+      result={actionDialogResult(mutation.outcomeError ?? mutation.error, { unknown: "An earlier write to this Pooler may have taken effect" })}
+    />
+  )
+}

package/src/components/cnpg/actions/CNPGReportDialog.test.tsx

@@ -0,0 +1,12 @@
+import { expect, it, vi } from 'vitest'
+import { renderToStaticMarkup } from 'react-dom/server'
+import { CNPGReportDialog } from './CNPGReportDialog'
+vi.mock('@skyhook-io/k8s-ui', async (original) => ({ ...await original<typeof import('@skyhook-io/k8s-ui')>(), ActionConfirmDialog: ({ notes, children }: any) => <div>{notes.map((note: string) => <p key={note}>{note}</p>)}{children}</div> }))
+vi.mock('../../../api/client', () => ({ useRadarFeature: () => ({ guard: vi.fn() }) }))
+vi.mock('../../../context/ConnectionContext', () => ({ useConnection: () => ({ connection: { context: 'test' } }) }))
+it('separates excluded Secret contents from best-effort log redaction and review', () => {
+  const html = renderToStaticMarkup(<CNPGReportDialog namespace="db" name="orders" onClose={() => {}} />)
+  expect(html).toContain('Secret objects are never read. Inline connection passwords and initialization and import SQL are withheld.')
+  expect(html).toContain('Included logs are redacted for recognisable secrets on a best-effort basis; review them before sharing.')
+  expect(html).not.toContain('Secret values are never included')
+})

package/src/components/cnpg/actions/CNPGReportDialog.tsx

@@ -0,0 +1,91 @@
+import { useState } from 'react'
+import { ActionConfirmDialog } from '@skyhook-io/k8s-ui'
+import { downloadCNPGReport } from '../../../api/cnpg-recovery'
+import { useRadarFeature } from '../../../api/client'
+import { useConnection } from '../../../context/ConnectionContext'
+import { downloadBlob } from '../../resources/file-browser-utils'
+
+const INCLUDED = [
+  'The Cluster, its instance and Job Pods, Jobs and PersistentVolumeClaims',
+  'Events about those objects',
+  'Backups, ScheduledBackups and Poolers of this cluster, and the ObjectStore it uses',
+  'Operator and plugin versions and readiness',
+  'The live instance and storage snapshots Radar shows (instance manager status, selected exporter metrics)',
+  'report.json: what was read, what was skipped and why, and the Secrets referenced (names only)',
+]
+
+/**
+ * The read-only report bundle, mirroring `kubectl cnpg report cluster`.
+ * Secret values are never included; logs and the query text inside them are
+ * opt-in.
+ */
+export function CNPGReportDialog({ namespace, name, onClose }: { namespace: string; name: string; onClose: () => void }) {
+  const { connection } = useConnection()
+  const [logs, setLogs] = useState(false)
+  const [queryText, setQueryText] = useState(false)
+  const [tailLines, setTailLines] = useState(1000)
+  const [busy, setBusy] = useState(false)
+  const { guard } = useRadarFeature('cnpgWorkspace')
+  const [error, setError] = useState<string | null>(null)
+
+  return (
+    <ActionConfirmDialog
+      open
+      onClose={onClose}
+      onConfirm={async () => {
+        setBusy(true)
+        setError(null)
+        try {
+          const { blob, filename } = await guard(() => downloadCNPGReport(namespace, name, { logs, queryText: logs && queryText, tailLines }))
+          await downloadBlob(blob, filename)
+          onClose()
+        } catch (e) {
+          if (!(e instanceof Error && e.message === 'cancelled')) setError(e instanceof Error ? e.message : String(e))
+        } finally {
+          setBusy(false)
+        }
+      }}
+      title="Download a report bundle"
+      subject={{ kind: 'Cluster', namespace, name }}
+      context={connection.context || undefined}
+      effect="Read-only: a zip of what this cluster looks like now, for a support ticket or a colleague. Everything is read with your permissions; what you cannot read is listed in report.json instead."
+      confirmLabel={busy ? 'Building…' : 'Download'}
+      isLoading={busy}
+      result={error ? { state: 'error', message: error, title: 'The report could not be downloaded' } : undefined}
+      notes={['Secret objects are never read. Inline connection passwords and initialization and import SQL are withheld. Included logs are redacted for recognisable secrets on a best-effort basis; review them before sharing.', 'The bundle is capped at 32 MiB; anything past that is listed as skipped.']}
+    >
+      <ul className="mb-3 list-disc space-y-0.5 pl-5 text-sm text-theme-text-secondary">
+        {INCLUDED.map((i) => <li key={i}>{i}</li>)}
+      </ul>
+      <div className="space-y-2 rounded-lg border border-theme-border bg-theme-base px-3 py-2">
+        <label className="flex items-start gap-2 text-sm text-theme-text-primary">
+          <input type="checkbox" className="mt-1" checked={logs} onChange={(e) => setLogs(e.target.checked)} />
+          <span>
+            Include Pod logs
+            <span className="block text-xs text-theme-text-tertiary">Every container of the instance and Job Pods, plus the previous run of restarted containers. Needs get pods/log.</span>
+          </span>
+        </label>
+        {logs && (
+          <div className="ml-6 space-y-2">
+            <label className="flex items-center gap-2 text-sm text-theme-text-secondary">
+              Last
+              <select value={tailLines} onChange={(e) => setTailLines(Number(e.target.value))} className="rounded-lg border border-theme-border bg-theme-base px-2 py-1 text-sm text-theme-text-primary">
+                {[200, 1000, 5000, 10000].map((n) => <option key={n} value={n}>{n.toLocaleString()}</option>)}
+              </select>
+              lines per container (at most 2 MiB each)
+            </label>
+            <label className="flex items-start gap-2 text-sm text-theme-text-primary">
+              <input type="checkbox" className="mt-1" checked={queryText} onChange={(e) => setQueryText(e.target.checked)} />
+              <span>
+                Keep query text
+                <span className="block text-xs text-theme-text-tertiary">
+                  Without this, statements and bind parameters in PostgreSQL log records are replaced. Query text can contain personal or secret data.
+                </span>
+              </span>
+            </label>
+          </div>
+        )}
+      </div>
+    </ActionConfirmDialog>
+  )
+}

package/src/components/cnpg/actions/CNPGScheduleActions.run.test.tsx

@@ -0,0 +1,58 @@
+// @vitest-environment jsdom
+import { act } from 'react'
+import { createRoot } from 'react-dom/client'
+import { expect, it, vi } from 'vitest'
+import { CNPGScheduleActions } from './CNPGScheduleActions'
+
+const mocks = vi.hoisted(() => ({ track: vi.fn(), mutate: vi.fn(), success: vi.fn() }))
+vi.mock('../useCNPGNavigate', () => ({ useCNPGNavigate: () => vi.fn() }))
+vi.mock('../../ui/Toast', () => ({ useToast: () => ({ showSuccess: mocks.success }) }))
+vi.mock('./useCNPGWriteGuard', () => ({ useCNPGWriteGuard: () => ({ node: null, satisfied: true }) }))
+vi.mock('../operations/store', () => ({ trackCNPGOperation: mocks.track }))
+vi.mock('../../../api/cnpg', () => ({
+  useCNPGAction: () => ({ mutate: mocks.mutate, isPending: false }),
+  useCNPGScheduleCapabilities: () => ({ data: {
+    uid: 'schedule-uid', context: 'kind-test',
+    facts: { cluster: 'payments', clusterUID: 'source-uid', clusterGeneration: 7, generation: 3, clusterState: 'ok', suspended: false },
+    actions: { run: { allowed: true }, suspend: { allowed: true }, setSchedule: { allowed: true } },
+  } }),
+}))
+
+it('binds the manual run and its follow-through to the reviewed source Cluster', async () => {
+  Object.assign(globalThis, { IS_REACT_ACT_ENVIRONMENT: true })
+  const host = document.createElement('div')
+  document.body.append(host)
+  const root = createRoot(host)
+  mocks.mutate.mockImplementation((_input, callbacks) => callbacks.onSuccess({ backup: 'manual-backup' }))
+  try {
+    await act(async () => root.render(<CNPGScheduleActions namespace="prod" name="nightly" />))
+    await act(async () => [...host.querySelectorAll('button')].find((button) => button.textContent === 'Run now')!.click())
+    const confirm = [...document.querySelectorAll<HTMLButtonElement>('[role="dialog"] button')].find((button) => button.textContent === 'Create Backup')!
+    expect(confirm).toBeDefined()
+    await act(async () => confirm.click())
+    expect(mocks.mutate.mock.calls[0][0].request.facts).toMatchObject({ clusterUID: 'source-uid', clusterGeneration: 7 })
+    expect(mocks.track).toHaveBeenCalledWith(expect.objectContaining({ kind: 'run', cluster: 'payments', clusterUID: 'source-uid', target: { name: 'manual-backup' } }))
+  } finally {
+    await act(async () => root.unmount())
+    host.remove()
+  }
+})
+
+it('binds the reviewed generation when suspending', async () => {
+  Object.assign(globalThis, { IS_REACT_ACT_ENVIRONMENT: true })
+  const host = document.createElement('div')
+  document.body.append(host)
+  const root = createRoot(host)
+  mocks.mutate.mockReset()
+  try {
+    await act(async () => root.render(<CNPGScheduleActions namespace="prod" name="nightly" />))
+    await act(async () => [...host.querySelectorAll('button')].find((button) => button.textContent === 'Suspend')!.click())
+    const confirm = [...document.querySelectorAll<HTMLButtonElement>('[role="dialog"] button')].find((button) => button.textContent === 'Suspend')!
+    expect(confirm).toBeDefined()
+    await act(async () => confirm.click())
+    expect(mocks.mutate.mock.calls[0][0]).toMatchObject({ action: 'suspend', request: { uid: 'schedule-uid', facts: { generation: 3, suspended: false } } })
+  } finally {
+    await act(async () => root.unmount())
+    host.remove()
+  }
+})

package/src/components/cnpg/actions/CNPGScheduleActions.test.tsx

@@ -0,0 +1,54 @@
+// @vitest-environment jsdom
+import { renderToStaticMarkup } from 'react-dom/server'
+import { act } from 'react'
+import { createRoot } from 'react-dom/client'
+import { expect, it, vi } from 'vitest'
+import { CNPGScheduleActions } from './CNPGScheduleActions'
+const navigate = vi.hoisted(() => vi.fn())
+const schedule = vi.hoisted(() => ({ cluster: 'payments', reason: 'Configure a backup destination on payments first', backupBlockedReason: 'Configure a backup destination on payments first', clusterState: 'ok', reasonCode: 'backup_destination' }))
+vi.mock('../useCNPGNavigate', () => ({ useCNPGNavigate: () => navigate }))
+vi.mock('../../../api/cnpg', () => ({ useCNPGScheduleCapabilities: () => ({ data: { actions: { run: { allowed: false, reason: schedule.reason, reasonCode: schedule.reasonCode }, suspend: { allowed: true }, setSchedule: { allowed: true } }, context: 'viewer', facts: { cluster: schedule.cluster, clusterState: schedule.clusterState, backupBlockedReason: schedule.backupBlockedReason, suspended: false } } }) }))
+it('shows the server destination blocker beneath the disabled Run now control', () => {
+  const html = renderToStaticMarkup(<CNPGScheduleActions namespace="prod" name="payments-nightly" />)
+  expect(html).toMatch(/disabled=""[^>]*>Run now/)
+  expect(new DOMParser().parseFromString(html, 'text/html').body.textContent).toContain('Configure a backup destination on payments first')
+  expect(html).toContain('Suspend')
+})
+
+it('keeps actions in one group and opens the target Cluster Backups tab', () => {
+  Object.assign(globalThis, { IS_REACT_ACT_ENVIRONMENT: true })
+  const host = document.createElement('div'); const root = createRoot(host)
+  act(() => root.render(<CNPGScheduleActions namespace="prod" name="payments-nightly" />))
+  const run = [...host.querySelectorAll('button')].find((b) => b.textContent === 'Run now')!
+  expect(run.parentElement!.parentElement!.textContent).toBe('Run nowSuspendEdit schedule')
+  const cluster = [...host.querySelectorAll('button')].find((b) => b.textContent === 'Cluster payments Backups →')!
+  expect(run.parentElement!.parentElement!.contains(cluster)).toBe(false)
+  act(() => cluster.click())
+  expect(navigate).toHaveBeenCalledWith('/cnpg/clusters/prod/payments?ctx=viewer&tab=backups')
+  act(() => root.unmount())
+})
+
+it.each(['backup', 'a', 'on'])('links the Cluster named %s rather than an earlier word in the reason', (cluster) => {
+  schedule.cluster = cluster; schedule.reason = `Configure a backup destination on ${cluster} first`; schedule.backupBlockedReason = schedule.reason
+  const html = renderToStaticMarkup(<CNPGScheduleActions namespace="prod" name="nightly" />)
+  expect(html).toMatch(new RegExp(`<button[^>]*>Cluster ${cluster} Backups →</button>`))
+  schedule.cluster = 'payments'; schedule.reason = 'Configure a backup destination on payments first'; schedule.backupBlockedReason = schedule.reason
+})
+it('adds the Cluster Backups destination when the blocker does not name the Cluster', () => {
+  schedule.reason = 'Set a volumeSnapshot backup configuration on the Cluster'; schedule.backupBlockedReason = schedule.reason
+  const html = renderToStaticMarkup(<CNPGScheduleActions namespace="prod" name="nightly" />)
+  expect(html).toContain('Set a volumeSnapshot backup configuration on the Cluster')
+  expect(html).toContain('Cluster payments Backups →')
+  schedule.reason = 'Configure a backup destination on payments first'; schedule.backupBlockedReason = schedule.reason
+})
+
+it.each(['Your account may not do this', 'The admission webhook rejects writes', 'The schedule is being deleted', 'The cluster of the schedule does not exist in this namespace'])('does not send an unrelated blocker to Backups: %s', (reason) => {
+  schedule.reason = reason
+  schedule.reasonCode = 'other'
+  if (reason.includes('does not exist')) schedule.clusterState = 'missing'
+  const html = renderToStaticMarkup(<CNPGScheduleActions namespace="prod" name="nightly" />)
+  expect(html).toContain(reason)
+  expect(html).not.toContain('Cluster payments Backups')
+  expect(html).not.toMatch(/<button[^>]*>payments</)
+  schedule.reasonCode = 'backup_destination'; schedule.clusterState = 'ok'; schedule.reason = 'Configure a backup destination on payments first'; schedule.backupBlockedReason = schedule.reason
+})

package/src/components/cnpg/actions/CNPGScheduleActions.tsx

@@ -0,0 +1,208 @@
+import { useState } from 'react'
+import { useCNPGNavigate } from '../useCNPGNavigate'
+import { cnpgDetailPath } from '../routes'
+import { ActionConfirmDialog, CNPGSchedulePreviewFacts, FactGrid, Tooltip, useDebouncedValue } from '@skyhook-io/k8s-ui'
+import { useCNPGAction, useCNPGScheduleCapabilities, useCNPGSchedulePreview, type CNPGScheduleActionName } from '../../../api/cnpg'
+import { actionDialogResult, capabilityReason } from '../../../api/actions'
+import { useToast } from '../../ui/Toast'
+import { useCNPGWriteGuard } from './useCNPGWriteGuard'
+import { cnpgOperatorActionNote } from '../operatorStatus'
+import { trackCNPGOperation } from '../operations/store'
+import { CNPGScheduleInput } from '../protection/CNPGScheduleInput'
+import { CNPGScheduleRepairButton } from '../protection/CNPGScheduleRepairButton'
+
+const BUTTON =
+  'btn-secondary inline-flex shrink-0 items-center gap-1.5 whitespace-nowrap px-2.5 py-1.5 text-xs font-medium disabled:cursor-not-allowed'
+
+/** Suspend, resume, run a ScheduledBackup's settings once, or change its schedule. */
+export function CNPGScheduleActions({ namespace, name }: { namespace: string; name: string }) {
+  const caps = useCNPGScheduleCapabilities(namespace, name)
+  const navigate = useCNPGNavigate()
+  const [open, setOpen] = useState<CNPGScheduleActionName | null>(null)
+  const data = caps.data
+  if (!data) return null
+  const btn = (id: CNPGScheduleActionName, label: string) => {
+    const cap = data.actions[id]
+    return (
+      <Tooltip key={id} content={capabilityReason(cap)} position="bottom">
+        <button type="button" className={BUTTON} disabled={!cap.allowed} onClick={() => setOpen(id)}>
+          {label}
+        </button>
+      </Tooltip>
+    )
+  }
+  return (
+    <div className="space-y-1.5">
+      <div className="flex flex-nowrap items-center gap-1.5">
+      {btn('run', 'Run now')}
+      {data.facts.suspended ? btn('resume', 'Resume') : btn('suspend', 'Suspend')}
+      {btn('setSchedule', 'Edit schedule')}
+      </div>
+      {!data.actions.run.allowed && <div className="text-xs text-theme-text-secondary">{(() => {
+        const reason = capabilityReason(data.actions.run) ?? ''
+        const cluster = data.facts.cluster
+        const destinationBlocked = data.actions.run.reasonCode === 'backup_destination'
+        return <>{reason}{cluster && destinationBlocked && <button type="button" className="ml-1 text-accent-text hover:underline" onClick={() => navigate(cnpgDetailPath({ plural: 'clusters', namespace, name: cluster }, data.context, 'backups'))}>Cluster {cluster} Backups →</button>}</>
+      })()}</div>}
+      {data.actions.run.reasonCode === 'backup_destination' && <CNPGScheduleRepairButton namespace={namespace} name={name} />}
+      {open === 'setSchedule' && <EditScheduleDialog namespace={namespace} name={name} onClose={() => setOpen(null)} />}
+      {open && open !== 'setSchedule' && <ScheduleDialog kind={open} namespace={namespace} name={name} onClose={() => setOpen(null)} />}
+    </div>
+  )
+}
+
+function EditScheduleDialog({ namespace, name, onClose }: { namespace: string; name: string; onClose: () => void }) {
+  const caps = useCNPGScheduleCapabilities(namespace, name)
+  const mutation = useCNPGAction('scheduledbackups', namespace, name, caps.data?.context)
+  const { showSuccess } = useToast()
+  const data = caps.data!
+  const current = data.facts.schedule
+  const [draft, setDraft] = useState(current)
+  const debounced = useDebouncedValue(draft.trim(), 300)
+  const preview = useCNPGSchedulePreview(namespace, name, debounced, debounced !== '')
+  const guard = useCNPGWriteGuard({ namespace, name, scope: { kind: 'spec', paths: ['spec.schedule'] }, targetKind: 'ScheduledBackup' })
+  const operatorNote = cnpgOperatorActionNote(data.operator)
+  const next = draft.trim()
+  const settled = debounced === next && preview.data?.schedule === next && !preview.isFetching
+  const p = settled ? preview.data : undefined
+  const disabledReason = !data.actions.setSchedule.allowed ? data.actions.setSchedule.reason : preview.error ? 'The schedule could not be checked' : undefined
+  const incompleteReason =
+    next === ''
+      ? 'Enter a schedule'
+      : next === current
+        ? 'The schedule is unchanged'
+        : !settled
+          ? 'Checking the schedule…'
+          : p && !p.valid
+            ? 'The operator cannot run this schedule'
+            : undefined
+  const warnings = [...(operatorNote?.tone === 'warning' ? [operatorNote.text] : []), ...(p?.valid && p.runsImmediately ? [p.clock?.declared ? 'The declared operator clock indicates a due run: saving can create one backup right away.' : 'The UTC estimate indicates a due run. The operator clock is not verified, so saving may create one backup right away.'] : [])]
+  return (
+    <ActionConfirmDialog
+      open
+      onClose={onClose}
+      onConfirm={() =>
+        mutation.mutate(
+          {
+            action: 'setSchedule',
+            request: { reviewedContext: data.context, uid: data.uid, facts: data.facts, params: { schedule: next } },
+          },
+          {
+            onSuccess: () => {
+              showSuccess(`${name} now runs on ${next}.`)
+              onClose()
+            },
+          },
+        )
+      }
+      title={`Edit ${name}'s schedule`}
+      subject={{ kind: 'ScheduledBackup', namespace, name }}
+      context={data.context}
+      effect={`Backups of ${data.facts.cluster} are taken on the new schedule. Method, target and other settings are unchanged.`}
+      notes={operatorNote?.tone === 'info' ? [operatorNote.text] : []}
+      warnings={warnings}
+      writes={[{ summary: `patch ScheduledBackup ${namespace}/${name}`, detail: `spec.schedule = "${next}" (was "${current}")` }]}
+      guard={guard.node}
+      guardSatisfied={guard.satisfied}
+      confirmLabel="Save schedule"
+      isLoading={mutation.isPending}
+      result={actionDialogResult(mutation.outcomeError ?? mutation.error, { unknown: "An earlier write to this ScheduledBackup may have taken effect" })}
+      disabledReason={disabledReason}
+      incompleteReason={incompleteReason}
+    >
+      <div className="space-y-2">
+        <CNPGScheduleInput value={draft} onChange={setDraft} />
+        {preview.error && next !== '' && (
+          <div className="text-xs text-theme-text-tertiary">The schedule could not be checked: {preview.error instanceof Error ? preview.error.message : 'unknown error'}</div>
+        )}
+        {preview.data && next !== '' && (
+          <div className={settled ? undefined : 'opacity-60'}>
+            <FactGrid>
+              <CNPGSchedulePreviewFacts preview={preview.data} />
+            </FactGrid>
+          </div>
+        )}
+        <div className="text-[11.5px] text-theme-text-tertiary">Checked by Radar with the parser CloudNativePG uses; the operator's admission webhook checks it again on save.</div>
+      </div>
+    </ActionConfirmDialog>
+  )
+}
+
+function ScheduleDialog({ kind, namespace, name, onClose }: { kind: CNPGScheduleActionName; namespace: string; name: string; onClose: () => void }) {
+  const caps = useCNPGScheduleCapabilities(namespace, name)
+  const mutation = useCNPGAction('scheduledbackups', namespace, name, caps.data?.context)
+  const { showSuccess } = useToast()
+  const data = caps.data!
+  const overdue = !!data.facts.nextScheduleTime && Date.parse(data.facts.nextScheduleTime) < Date.now()
+  const spec =
+    kind === 'run'
+      ? {
+          title: `Create a backup using ${name}'s settings?`,
+          confirm: 'Create Backup',
+          effect: `Creates one Backup of ${data.facts.cluster} with this schedule's method, plugin, online and target settings. The schedule itself is not changed and its next run still happens on time.`,
+          writes: [{ summary: `create Backup ${namespace}/${name}-manual-<timestamp>`, detail: 'spec copied from the ScheduledBackup (method, pluginConfiguration, online, onlineConfiguration, target)' }],
+          notes: ['This Backup is not owned by the schedule, so it outlives it.'],
+          scope: { kind: 'create-child' as const },
+        }
+      : kind === 'suspend'
+        ? {
+            title: `Suspend ${name}?`,
+            confirm: 'Suspend',
+            effect: `No new backups of ${data.facts.cluster} are taken on this schedule until it is resumed.`,
+            writes: [{ summary: `patch ScheduledBackup ${namespace}/${name}`, detail: 'spec.suspend = true' }],
+            notes: [] as string[],
+            scope: { kind: 'spec' as const, paths: ['spec.suspend'] },
+          }
+        : {
+            title: `Resume ${name}?`,
+            confirm: 'Resume',
+            effect: `Backups of ${data.facts.cluster} are taken on this schedule again.`,
+            writes: [{ summary: `patch ScheduledBackup ${namespace}/${name}`, detail: 'spec.suspend = false' }],
+            notes: overdue ? ['The next run is overdue, so the operator takes one catch-up backup right away. Missed runs are not replayed.'] : [],
+            scope: { kind: 'spec' as const, paths: ['spec.suspend'] },
+          }
+  const guard = useCNPGWriteGuard({ namespace, name, scope: spec.scope, targetKind: 'ScheduledBackup' })
+  const operatorNote = cnpgOperatorActionNote(data.operator)
+  return (
+    <ActionConfirmDialog
+      open
+      onClose={onClose}
+      onConfirm={() =>
+        mutation.mutate(
+          { action: kind, request: { reviewedContext: data.context, uid: data.uid, facts: data.facts } },
+          {
+            onSuccess: (r) => {
+              if (kind === 'run' && r.backup) {
+                trackCNPGOperation({
+                  kind: 'run',
+                  label: `Backup ${r.backup} (from ${name})`,
+                  context: data.context,
+                  namespace,
+                  cluster: data.facts.cluster,
+                  clusterUID: data.facts.clusterUID,
+                  target: { name: r.backup },
+                  link: { kind: 'Backup', group: 'postgresql.cnpg.io', name: r.backup },
+                })
+              }
+              showSuccess(kind === 'run' ? `Backup ${r.backup ?? ''} requested.` : kind === 'suspend' ? `${name} suspended.` : `${name} resumed.`)
+              onClose()
+            },
+          },
+        )
+      }
+      title={spec.title}
+      subject={{ kind: 'ScheduledBackup', namespace, name }}
+      context={data.context}
+      effect={spec.effect}
+      notes={operatorNote?.tone === 'info' ? [...spec.notes, operatorNote.text] : spec.notes}
+      warnings={operatorNote?.tone === 'warning' ? [operatorNote.text] : undefined}
+      writes={spec.writes}
+      guard={guard.node}
+      guardSatisfied={guard.satisfied}
+      confirmLabel={spec.confirm}
+      isLoading={mutation.isPending}
+      result={actionDialogResult(mutation.outcomeError ?? mutation.error, { unknown: "An earlier write to this ScheduledBackup may have taken effect" })}
+      disabledReason={data.actions[kind].allowed ? undefined : data.actions[kind].reason}
+    />
+  )
+}

package/src/components/cnpg/actions/actionModel.test.ts

@@ -0,0 +1,111 @@
+import { describe, expect, it } from 'vitest'
+import { backupNameFor, cnpgDestroyBlocker, pickDefaultStandby, switchoverCandidateFacts, switchoverConcernWarning, switchoverConcerns, switchoverDefault, switchoverLagNote } from './actionModel'
+
+describe('CNPG action model', () => {
+  it('names backups like kubectl-cnpg, in UTC', () => {
+    expect(backupNameFor('pg-orders', new Date(Date.UTC(2026, 8, 28, 14, 5, 9)))).toBe('pg-orders-20260928140509')
+  })
+
+  it('prefers a synchronous standby, then the least lag, and never an ineligible one', () => {
+    expect(
+      pickDefaultStandby([
+        { pod: 'a', podUID: '1', replayLagSeconds: 0.1, syncState: 'async' },
+        { pod: 'b', podUID: '2', replayLagSeconds: 3, syncState: 'sync' },
+        { pod: 'c', podUID: '3', ineligible: 'fenced', syncState: 'sync' },
+      ])?.pod,
+    ).toBe('b')
+    expect(pickDefaultStandby([{ pod: 'a', podUID: '1', ineligible: 'not ready' }])).toBeUndefined()
+  })
+})
+
+describe('cnpgDestroyBlocker', () => {
+  const fence = { allowed: false, permission: 'allowed' as const, reasonCode: 'fence_required', reason: 'Fence pg-2 first: a fenced instance cannot be promoted while it is destroyed' }
+  it('leaves the missing fence to the Fence-first callout', () => {
+    expect(cnpgDestroyBlocker(fence, true)).toBeUndefined()
+    expect(cnpgDestroyBlocker(fence, false)).toBe(fence.reason)
+    expect(cnpgDestroyBlocker({ ...fence, reason: 'A different explanation' }, true)).toBeUndefined()
+  })
+  it('keeps real blockers as the alert', () => {
+    expect(cnpgDestroyBlocker({ allowed: false, permission: 'denied', reason: 'Needs delete pods in db', grant: { verb: 'delete', resource: 'pods', namespace: 'db' } }, true)).toBe('Needs delete pods in db')
+    expect(cnpgDestroyBlocker({ allowed: false, permission: 'allowed', reason: 'The cluster is hibernated' }, true)).toBe('The cluster is hibernated')
+    expect(cnpgDestroyBlocker({ allowed: true, permission: 'allowed' }, true)).toBeUndefined()
+  })
+})
+
+describe('switchoverLagNote', () => {
+  it('warns from the WAL still to replay, never from replay delay alone', () => {
+    expect(switchoverLagNote({ pod: 'pg-2', replayBacklogBytes: 16 * 1024 * 1024, state: 'streaming' })).toBe('pg-2 has 16 MiB of WAL still to replay; the switchover may take longer while it catches up.')
+    expect(switchoverLagNote({ pod: 'pg-2', replayBacklogBytes: 16 * 1024 * 1024 })).toBe("pg-2 has 16 MiB of WAL still to replay and isn't connected to the primary to receive it.")
+    expect(switchoverLagNote({ pod: 'pg-2', replayBacklogBytes: 0 })).toBeUndefined()
+    expect(switchoverLagNote({ pod: 'pg-2' })).toBeUndefined()
+  })
+  it('lists the backlog before the replay delay on the candidate line', () => {
+    expect(switchoverCandidateFacts({ replayBacklogBytes: 0, replayLagSeconds: 12 })).toEqual(['backlog 0 B', 'replay delay 12 s'])
+  })
+})
+
+describe('pickDefaultStandby by backlog', () => {
+  it('prefers the standby with less WAL to replay over a lower replay delay', () => {
+    const a = { pod: 'a', podUID: '1', replayBacklogBytes: 0, replayLagSeconds: 12 }
+    const b = { pod: 'b', podUID: '2', replayBacklogBytes: 4096, replayLagSeconds: 1 }
+    expect(pickDefaultStandby([b, a])?.pod).toBe('a')
+  })
+})
+
+describe('switchoverDefault', () => {
+  const before = [
+    { pod: 'a', podUID: '1' },
+    { pod: 'b', podUID: '2' },
+  ]
+  const after = [
+    { pod: 'a', podUID: '1', replayBacklogBytes: 4096 },
+    { pod: 'b', podUID: '2', replayBacklogBytes: 0 },
+  ]
+  it('re-picks the default when runtime data arrives, until the user chooses', () => {
+    expect(switchoverDefault({ touched: false, current: 'a', standbys: before })).toBe('a')
+    expect(switchoverDefault({ touched: false, current: 'a', standbys: after })).toBe('b')
+    expect(switchoverDefault({ touched: true, current: 'a', standbys: after })).toBe('a')
+  })
+})
+
+describe('switchover concerns', () => {
+  const primary = { state: 'ok', timeline: 7, replication: [{ applicationName: 'pg-2' }] }
+  it('names a standby that is not connected, paused, or on another timeline', () => {
+    expect(switchoverConcerns(primary, { pod: 'pg-2', status: { state: 'ok', timeline: 7 } })).toEqual([])
+    expect(switchoverConcerns(primary, { pod: 'pg-1', status: { state: 'ok', timeline: 4, replayPaused: true } })).toEqual([
+      { code: 'not_receiving', text: 'not connected to the primary' },
+      { code: 'replay_paused', text: 'replay paused' },
+      { code: 'timeline_mismatch', text: 'timeline 4, primary on 7' },
+    ])
+    // Without the primary's replication rows, connection is not judged.
+    expect(switchoverConcerns({ state: 'partial', timeline: 7, replication: null }, { pod: 'pg-1', status: { state: 'ok', timeline: 7 } })).toEqual([])
+  })
+  it('trusts a standby streaming from the primary over the timeline of its last checkpoint', () => {
+    // After a switchover the old primary rejoins and streams, but reports the
+    // previous timeline until its next restartpoint.
+    const promoted = { state: 'ok', timeline: 2, replication: [{ applicationName: 'pg-1', state: 'streaming' }] }
+    expect(switchoverConcerns(promoted, { pod: 'pg-1', status: { state: 'ok', timeline: 1, roleDetail: 'streaming' } })).toEqual([])
+    expect(pickDefaultStandby([{ pod: 'pg-1', podUID: '1', concerns: switchoverConcerns(promoted, { pod: 'pg-1', status: { state: 'ok', timeline: 1 } }) }])?.pod).toBe('pg-1')
+  })
+  it('keeps the timeline concern for a standby that is not streaming', () => {
+    const catchingUp = { state: 'ok', timeline: 2, replication: [{ applicationName: 'pg-1', state: 'catchup' }] }
+    expect(switchoverConcerns(catchingUp, { pod: 'pg-1', status: { state: 'ok', timeline: 1 } })).toEqual([{ code: 'timeline_mismatch', text: 'timeline 1, primary on 2' }])
+    expect(switchoverConcerns({ state: 'ok', timeline: 2, replication: [] }, { pod: 'pg-1', status: { state: 'ok', timeline: 1 } }).map((c) => c.code)).toEqual(['not_receiving', 'timeline_mismatch'])
+  })
+  it('never picks a standby with concerns by default while a clean one exists', () => {
+    expect(
+      pickDefaultStandby([
+        { pod: 'pg-1', podUID: '1', concerns: [{ code: 'not_receiving', text: 'not connected to the primary' }] },
+        { pod: 'pg-2', podUID: '2', replayBacklogBytes: 1024, syncState: 'async' },
+      ])?.pod,
+    ).toBe('pg-2')
+    expect(pickDefaultStandby([{ pod: 'pg-1', podUID: '1', concerns: [{ code: 'replay_paused', text: 'replay paused' }] }])).toBeUndefined()
+  })
+  it('warns with what was observed, not with a guess at the outcome', () => {
+    const w = switchoverConcernWarning('pg-1', [{ code: 'not_receiving', text: 'not connected to the primary' }, { code: 'replay_paused', text: 'replay paused' }])!
+    expect(w).toContain('pg-1: not connected to the primary · replay paused.')
+    expect(w).toContain('not receiving WAL from the current primary')
+    expect(switchoverConcernWarning('pg-1', [{ code: 'not_receiving', text: 'Connection unavailable' }])).toContain('not receiving WAL from the current primary')
+    expect(switchoverConcernWarning('pg-1', [])).toBeNull()
+  })
+})