@skyhook-io/radar-app 1.17.0 → 1.17.1

package/src/components/workspace/layout.tsx

@@ -0,0 +1,259 @@
+import type { ComponentType, ReactNode } from 'react'
+import type { UseQueryResult } from '@tanstack/react-query'
+import { clsx } from 'clsx'
+import { AlertTriangle, X } from 'lucide-react'
+import { Tooltip, formatUpdatedAgo, grantParts, toneTextClass, type Grant } from '@skyhook-io/k8s-ui'
+import type { SelectedResource } from '../../types'
+import { sameSelectedResource } from '../../utils/drawer-trail'
+import { ROW_HOVER, TABLE_HEAD, TABLE_WRAP, TBODY, TD, TH } from './table'
+
+export function Notice({ children }: { children: ReactNode }) {
+  return (
+    <div className="flex items-start gap-2 rounded-lg border border-theme-border bg-theme-surface px-3 py-2 text-sm text-theme-text-secondary">
+      <AlertTriangle className="mt-0.5 h-4 w-4 shrink-0 text-theme-text-tertiary" />
+      <div>{children}</div>
+    </div>
+  );
+}
+
+/** A whole screen with nothing to show: not installed, unreadable, or empty. */
+export function ScreenEmptyState({
+  icon: Icon,
+  title,
+  detail,
+  action,
+}: {
+  icon: ComponentType<{ className?: string }>;
+  title: string;
+  detail: ReactNode;
+  action?: ReactNode;
+}) {
+  return (
+    <div className="flex min-h-0 flex-1 items-center justify-center bg-theme-base p-6">
+      <div className="max-w-md text-center">
+        <Icon className="mx-auto h-9 w-9 text-theme-text-tertiary/50" />
+        <h2 className="mt-3 text-lg font-medium text-theme-text-primary">
+          {title}
+        </h2>
+        <p className="mt-1 text-sm text-theme-text-secondary">{detail}</p>
+        {action}
+      </div>
+    </div>
+  );
+}
+
+export function ScreenBody({ children }: { children: ReactNode }) {
+  return (
+    <div className="min-h-0 flex-1 overflow-y-auto [scrollbar-gutter:stable]">
+      <div className="space-y-5 px-5 pb-6 pt-3 xl:px-7">{children}</div>
+    </div>
+  )
+}
+
+export function FilterChips({ chips }: { chips: { label: string; onClear: () => void }[] }) {
+  if (chips.length === 0) return null
+  return (
+    <div className="flex flex-wrap gap-1.5">
+      {chips.map((c) => (
+        <span key={c.label} className="inline-flex items-center gap-1 rounded-full bg-theme-elevated px-2.5 py-0.5 text-xs text-theme-text-secondary">
+          {c.label}
+          <button type="button" onClick={c.onClear} aria-label={`Remove ${c.label}`} className="rounded-full p-0.5 hover:bg-theme-hover">
+            <X className="h-3 w-3" />
+          </button>
+        </span>
+      ))}
+    </div>
+  )
+}
+
+export function namespaceChip(namespaces: string[], onClear: () => void) {
+  return namespaces.length > 0 ? [{ label: `Namespace: ${namespaces.join(', ')}`, onClear }] : []
+}
+
+export function Segments<T extends string>({
+  value,
+  options,
+  onChange,
+  label,
+}: {
+  value: T
+  options: { id: T; label: string; count?: number | string }[]
+  onChange: (id: T) => void
+  label: string
+}) {
+  return (
+    <div role="tablist" aria-label={label} className="inline-flex rounded-lg bg-theme-elevated p-0.5">
+      {options.map((o) => {
+        const on = o.id === value
+        return (
+          <button
+            key={o.id}
+            type="button"
+            role="tab"
+            aria-selected={on}
+            onClick={() => onChange(o.id)}
+            className={clsx(
+              'inline-flex items-center gap-1.5 rounded-md px-3 py-1 text-sm font-medium transition-colors',
+              on ? 'bg-theme-surface text-theme-text-primary shadow-theme-sm' : 'text-theme-text-secondary hover:text-theme-text-primary',
+            )}
+          >
+            {o.label}
+            {o.count !== undefined && <span className="font-mono text-xs text-theme-text-tertiary">{o.count}</span>}
+          </button>
+        )
+      })}
+    </div>
+  )
+}
+
+export interface TableColumn<T> {
+  header: ReactNode
+  width?: string
+  cell: (row: T) => ReactNode
+  className?: string
+}
+
+/** A workspace table. Rows inspect in the drawer; the inspected row is highlighted. */
+export function SectionTable<T>({
+  title,
+  subtitle,
+  columns,
+  rows,
+  rowKey,
+  rowResource,
+  onInspect,
+  inspected,
+  empty,
+  minWidth = 760,
+  footer,
+}: {
+  title: ReactNode
+  subtitle?: ReactNode
+  columns: TableColumn<T>[]
+  rows: T[]
+  rowKey: (row: T) => string
+  rowResource?: (row: T) => SelectedResource | null
+  onInspect?: (resource: SelectedResource) => void
+  inspected?: SelectedResource | null
+  empty: ReactNode
+  minWidth?: number
+  footer?: ReactNode
+}) {
+  return (
+    <section>
+      <div className="mb-2 flex flex-wrap items-baseline gap-x-2.5 gap-y-1">
+        <h2 className="text-sm font-semibold text-theme-text-primary">{title}</h2>
+        {subtitle && <span className="text-xs text-theme-text-tertiary">{subtitle}</span>}
+      </div>
+      <div className="overflow-hidden rounded-xl border border-theme-border bg-theme-surface shadow-theme-sm">
+        {rows.length === 0 ? (
+          <div className="px-4 py-5 text-sm text-theme-text-tertiary">{empty}</div>
+        ) : (
+          <div className={TABLE_WRAP}>
+            <table className="w-full table-fixed" style={{ minWidth }}>
+              <colgroup>
+                {columns.map((c, i) => (
+                  <col key={i} style={c.width ? { width: c.width } : undefined} />
+                ))}
+              </colgroup>
+              <thead className={TABLE_HEAD}>
+                <tr>
+                  {columns.map((c, i) => (
+                    <th key={i} className={TH}>{c.header}</th>
+                  ))}
+                </tr>
+              </thead>
+              <tbody className={TBODY}>
+                {rows.map((row) => {
+                  const res = rowResource?.(row) ?? null
+                  const active = !!res && sameSelectedResource(inspected, res)
+                  return (
+                    <tr
+                      key={rowKey(row)}
+                      onClick={res && onInspect ? () => onInspect(res) : undefined}
+                      className={clsx(res && onInspect && 'cursor-pointer', ROW_HOVER, active && 'selection')}
+                      aria-selected={res ? active : undefined}
+                    >
+                      {columns.map((c, i) => (
+                        <td key={i} className={clsx(TD, c.className)}>{c.cell(row)}</td>
+                      ))}
+                    </tr>
+                  )
+                })}
+              </tbody>
+            </table>
+          </div>
+        )}
+      </div>
+      {footer && <div className="mt-1.5 text-xs text-theme-text-tertiary">{footer}</div>}
+    </section>
+  )
+}
+
+/**
+ * Text that wraps only after `after` ("/" for a path, "-" for a resource
+ * name), never mid-word; a single segment too long for its cell is cut with an
+ * ellipsis. The whole value shows on hover.
+ */
+export function BreakText({ value, after, className }: { value: string; after: '/' | '-'; className?: string }) {
+  const parts = value.split(after === '/' ? /(?<=\/)/ : /(?<=-)/)
+  return (
+    <Tooltip content={value} wrapperClassName="max-w-full">
+      <span className={clsx('block max-w-full', className)}>
+        {parts.map((p, i) => (
+          <span key={i} className="inline-block max-w-full truncate align-top">
+            {p}
+          </span>
+        ))}
+      </span>
+    </Tooltip>
+  )
+}
+
+/** A URL or path; see BreakText. */
+export function PathText({ value, className }: { value: string; className?: string }) {
+  return <BreakText value={value} after="/" className={clsx('font-mono text-[12.5px]', className)} />
+}
+
+/**
+ * A grant as one unit: the verb and resource in a code span that does not
+ * wrap, its scope ("cluster-wide", "in namespace pg") as plain text after it.
+ */
+export function GrantText({ grant }: { grant: Grant }) {
+  const { what, scope } = grantParts(grant)
+  return (
+    <>
+      <code className="whitespace-nowrap rounded bg-theme-elevated px-1 font-mono text-[12px]">{what}</code>
+      {scope}
+    </>
+  )
+}
+
+export function Mono({ children }: { children: ReactNode }) {
+  return <Tooltip content={children} wrapperClassName="min-w-0"><span className="font-mono text-[12.5px] break-normal [overflow-wrap:anywhere]">{children}</span></Tooltip>
+}
+
+export function Sub({ children }: { children: ReactNode }) {
+  return <div className="mt-0.5 text-xs text-theme-text-tertiary break-words">{children}</div>
+}
+
+type RefreshableQuery = Pick<UseQueryResult<unknown>, 'isRefetchError' | 'error' | 'dataUpdatedAt'>
+
+/**
+ * A refetch failed while the last good answer stays on screen: say so, why,
+ * and how old that answer is, so cached values are not read as current.
+ */
+export function RefreshFailedNotice({ queries, className }: { queries: RefreshableQuery[]; className?: string }) {
+  const failed = queries.filter((q) => q.isRefetchError)
+  if (failed.length === 0) return null
+  const oldest = failed.reduce((a, b) => (b.dataUpdatedAt < a.dataUpdatedAt ? b : a))
+  const reason = oldest.error instanceof Error ? oldest.error.message : 'unknown error'
+  return (
+    <div role="status" className={clsx('flex items-start gap-1.5 text-xs text-theme-text-secondary', className)}>
+      <AlertTriangle className={clsx('mt-px h-3.5 w-3.5 shrink-0', toneTextClass('degraded'))} />
+      <span>
+        Last refresh failed: {reason.length > 160 ? `${reason.slice(0, 160)}…` : reason} · showing data from {formatUpdatedAgo(Date.now() - oldest.dataUpdatedAt)}
+      </span>
+    </div>
+  )
+}

package/src/components/workspace/table.ts

@@ -0,0 +1,7 @@
+export const TABLE_WRAP = 'overflow-x-auto';
+export const TABLE_HEAD =
+  'border-b border-theme-border bg-theme-base/60 text-[11px] uppercase tracking-wide text-theme-text-tertiary';
+export const TH = 'px-3 py-2.5 text-left font-medium whitespace-nowrap';
+export const TD = 'px-3 py-2.5 align-top text-sm text-theme-text-primary';
+export const TBODY = 'table-divide-subtle';
+export const ROW_HOVER = 'transition-colors hover:bg-theme-hover/50';

package/src/contexts/CapabilitiesContext.tsx

@@ -155,7 +155,7 @@ export function useNamespacedCapabilities(namespace: string | undefined) {
   const { data: nsCaps, error, isPending } = useNamespaceCapabilities(namespace, globalCaps)
 
   if (error) {
-    console.warn(`Failed to fetch namespace capabilities for ${namespace}, using global:`, error)
+    console.warn('Failed to fetch namespace capabilities, using global:', namespace, error)
   }
 
   return useMemo(() => ({

package/src/integrations/resourceHost.test.tsx

@@ -0,0 +1,55 @@
+import { renderToStaticMarkup } from 'react-dom/server'
+import { describe, expect, it } from 'vitest'
+import {
+  composeDetailSlots, composeResourceHosts, hostsForResource, resourceHostForSlot,
+  type ResourceHost,
+} from './resourceHost'
+
+const job = { kind: 'Job', group: 'batch', namespace: 'ml', name: 'run' }
+const jobs = [{ name: 'jobs', group: 'batch' }]
+const Admission = () => <span>admission</span>
+
+describe('resource host composition', () => {
+  it('allows batch and admission to extend the same Job without hiding the destination owner', () => {
+    const hosts: ResourceHost[] = [
+      { id: 'admission', resources: jobs, detailSlots: () => ({ renderHeaderActions: () => <Admission /> }) },
+      { id: 'execution', resources: jobs, detailOwnership: ['destination'], expandedPath: () => '/execution/run', detailSlots: () => ({ renderHeaderActions: () => <span>execution</span>, extraTabs: [{ id: 'runs', label: 'Runs', render: () => null }] }) },
+    ]
+    composeResourceHosts(hosts)
+    expect(hostsForResource(hosts, job).map(host => host.id)).toEqual(['admission', 'execution'])
+    expect(resourceHostForSlot(hosts, job, 'destination')?.expandedPath?.(job)).toBe('/execution/run')
+    const slots = composeDetailSlots(hosts.map(host => ({ id: host.id, slots: host.detailSlots?.(job) })), [{ id: 'history', label: 'History', render: () => null }])
+    const html = renderToStaticMarkup(<>{slots.renderHeaderActions?.({ resource: {}, context: 'drawer' })}</>)
+    expect(html).toBe('<span>admission</span><span>execution</span>')
+    expect(slots.extraTabs?.map(tab => tab.id)).toEqual(['history', 'runs'])
+  })
+
+  it('requires resolved group identity and normalizes Kind versus resource plural', () => {
+    const hosts: ResourceHost[] = [{ id: 'batch', resources: jobs }]
+    expect(hostsForResource(hosts, job)).toHaveLength(1)
+    expect(hostsForResource(hosts, { ...job, kind: 'jobs' })).toHaveLength(1)
+    expect(hostsForResource(hosts, { ...job, group: undefined })).toEqual([])
+    expect(hostsForResource(hosts, { ...job, group: '' })).toEqual([])
+    expect(hostsForResource(hosts, { ...job, group: 'batch.volcano.sh' })).toEqual([])
+    expect(hostsForResource([{ id: 'core', resources: [{ name: 'pods', group: '' }] }], { ...job, kind: 'Pod', group: '' })).toHaveLength(1)
+  })
+
+  it('rejects competing exclusive ownership instead of letting registration order win', () => {
+    const owner: ResourceHost = { id: 'execution', resources: jobs, detailOwnership: ['destination'], expandedPath: () => '/execution' }
+    const other: ResourceHost = { ...owner, id: 'other' }
+    expect(() => composeResourceHosts([owner, other])).toThrow('ownership conflict')
+    expect(() => composeResourceHosts([{ id: 'missing', resources: jobs, logs: () => null }])).toThrow('must declare logs ownership')
+    expect(() => composeResourceHosts([{ id: 'missing', resources: jobs, expandedPath: () => '/' }])).toThrow('must declare destination ownership')
+    expect(() => composeResourceHosts([
+      { id: 'one', renderers: { JobRenderer: Admission } },
+      { id: 'two', renderers: { JobRenderer: Admission } },
+    ])).toThrow('renderer:JobRenderer')
+  })
+
+  it('catches summary and tab conflicts even if a contribution omitted its declaration', () => {
+    expect(() => composeDetailSlots(['one', 'two'].map(id => ({ id, slots: { renderSummary: () => null } })))).toThrow('summary ownership conflict')
+    const tab = { id: 'runs', label: 'Runs', render: () => null }
+    expect(composeDetailSlots([], [tab, tab]).extraTabs).toEqual([tab, tab])
+    expect(() => composeDetailSlots([{ id: 'execution', slots: { extraTabs: [tab] } }], [tab])).toThrow('tab ownership conflict: runs')
+  })
+})

package/src/integrations/resourceHost.ts

@@ -0,0 +1,99 @@
+import { createElement, Fragment, type ComponentProps, type ComponentType, type ReactNode } from 'react'
+import type { RendererOverrides, WorkloadExtraTab, WorkloadView } from '@skyhook-io/k8s-ui'
+import type { RadarFeature, RadarFeatureSupport } from '../api/radarFeatures'
+import type { RenderDiagnoseAction } from '../context/DiagnoseCustomization'
+import type { SelectedResource } from '../types'
+import { kindToPluralWithGroup } from '../utils/navigation'
+
+export type HostResource = Pick<SelectedResource, 'kind' | 'group' | 'namespace' | 'name'>
+export type DetailSlots = Pick<ComponentProps<typeof WorkloadView>, 'renderSummary' | 'renderHeaderActions' | 'extraTabs'>
+export type HostFeatures = Partial<Record<RadarFeature, RadarFeatureSupport>>
+export type KindListMode = 'table' | 'wait' | 'view'
+export interface HostKind { name: string; kind: string; group: string }
+export interface KindListProps {
+  namespaces: string[]
+  inspected: SelectedResource | null
+  onInspect: (resource: SelectedResource) => void
+  onClearNamespaces: () => void
+  onCreate: (kind: HostKind) => void
+}
+type ExclusiveDetailSlot = 'summary' | 'destination' | 'logs'
+export interface ResourceHost {
+  id: string
+  feature?: RadarFeature
+  diagnoseAction?: (render: RenderDiagnoseAction | undefined) => RenderDiagnoseAction | undefined
+  kindLists?: readonly {
+    kind: HostKind
+    title: string
+    mode: (support: RadarFeatureSupport, pending: boolean) => KindListMode
+    Component: ComponentType<KindListProps>
+  }[]
+  renderers?: RendererOverrides
+  resources?: readonly { name: string; group: string }[]
+  expandedPath?: (resource: HostResource, context?: string, tab?: 'yaml') => string | null
+  detailRedirect?: (resource: HostResource, search: URLSearchParams) => string | null
+  detailSlots?: (resource: HostResource) => DetailSlots
+  detailOwnership?: readonly ExclusiveDetailSlot[]
+  logs?: (resource: HostResource, data: { apiVersion?: string } | null | undefined) => ReactNode
+  drawerNavigation?: {
+    ownsPath: (pathname: string) => boolean
+    Component: ComponentType<{ resource: SelectedResource }>
+  }
+}
+
+export function hostSupport(host: ResourceHost, features: HostFeatures): RadarFeatureSupport {
+  return host.feature ? features[host.feature] ?? 'unknown' : 'supported'
+}
+
+function resourceKey(name: string, group: string): string { return `${group}\u0000${name}` }
+
+export function hostsForResource(hosts: readonly ResourceHost[], resource: HostResource): ResourceHost[] {
+  // An unresolved group must not select a colliding CRD, or be treated as core.
+  if (resource.group === undefined) return []
+  const plural = kindToPluralWithGroup(resource.kind, resource.group)
+  return hosts.filter(host => host.resources?.some(kind => kind.name === plural && kind.group === resource.group))
+}
+
+export function resourceHostForSlot(hosts: readonly ResourceHost[], resource: HostResource, slot: ExclusiveDetailSlot): ResourceHost | undefined {
+  return hostsForResource(hosts, resource).find(host => host.detailOwnership?.includes(slot))
+}
+
+export function composeResourceHosts(hosts: readonly ResourceHost[]): RendererOverrides {
+  const renderers: RendererOverrides = {}
+  const owners = new Map<string, string>()
+  const claim = (key: string, id: string) => {
+    const previous = owners.get(key)
+    if (previous) throw new Error(`Resource host ownership conflict: ${previous} and ${id} own ${key}`)
+    owners.set(key, id)
+  }
+  for (const host of hosts) {
+    claim(`host:${host.id}`, host.id)
+    if ((host.expandedPath || host.detailRedirect) && !host.detailOwnership?.includes('destination')) throw new Error(`Resource host ${host.id} must declare destination ownership`)
+    if (host.logs && !host.detailOwnership?.includes('logs')) throw new Error(`Resource host ${host.id} must declare logs ownership`)
+    for (const name of Object.keys(host.renderers ?? {})) claim(`renderer:${name}`, host.id)
+    Object.assign(renderers, host.renderers)
+    for (const kind of host.resources ?? []) {
+      for (const slot of host.detailOwnership ?? []) claim(`${slot}:${resourceKey(kind.name, kind.group)}`, host.id)
+    }
+    for (const list of host.kindLists ?? []) claim(`kind-list:${resourceKey(list.kind.name, list.kind.group)}`, host.id)
+  }
+  return renderers
+}
+
+export function composeDetailSlots(contributions: readonly { id: string; slots: DetailSlots | undefined }[], inheritedTabs: WorkloadExtraTab[] = []): DetailSlots {
+  const summaries = contributions.filter(host => host.slots?.renderSummary)
+  if (summaries.length > 1) throw new Error(`Resource host summary ownership conflict: ${summaries.map(host => host.id).join(', ')}`)
+  const summary = summaries[0]?.slots?.renderSummary
+  const actions = contributions.filter(host => host.slots?.renderHeaderActions)
+  const tabs = [...inheritedTabs, ...contributions.flatMap(host => host.slots?.extraTabs ?? [])]
+  const tabIds = new Set(inheritedTabs.map(tab => tab.id))
+  for (const tab of contributions.flatMap(host => host.slots?.extraTabs ?? [])) {
+    if (tabIds.has(tab.id)) throw new Error(`Resource host tab ownership conflict: ${tab.id}`)
+    tabIds.add(tab.id)
+  }
+  return {
+    ...(summary ? { renderSummary: summary } : {}),
+    ...(actions.length ? { renderHeaderActions: (props: Parameters<NonNullable<DetailSlots['renderHeaderActions']>>[0]) => actions.map(host => createElement(Fragment, { key: host.id }, host.slots!.renderHeaderActions!(props))) } : {}),
+    ...(tabs.length ? { extraTabs: tabs } : {}),
+  }
+}

package/src/integrations/resourceHosts.test.tsx

@@ -0,0 +1,141 @@
+import { isValidElement } from 'react'
+import { renderToStaticMarkup } from 'react-dom/server'
+import { MemoryRouter } from 'react-router-dom'
+import { describe, expect, it, vi } from 'vitest'
+import { ResourceRendererDispatch } from '@skyhook-io/k8s-ui'
+import { encodeDrawerTrail } from '../utils/drawer-trail'
+import { kindToPluralWithGroup } from '../utils/navigation'
+import {
+  decorateResourceDiagnose, renderResourceKindList, resourceKindListMode, resourceKindListTitle, ResourceDrawerNavigation,
+  resourceDetailRedirect, resourceDetailSlots, resourceExpandedPath,
+  resourceLogs, resourceRendererOverrides,
+} from './resourceHosts'
+
+vi.mock('../api/client', () => ({
+  ApiError: class extends Error { status = 500 },
+  useKueueAdmission: () => ({ data: { uid: 'job-id', installed: true, workloads: [], total: 0 }, isLoading: false, refetch: () => {} }),
+}))
+
+import type { HostFeatures } from './resourceHost'
+
+const cluster = { kind: 'Cluster', group: 'postgresql.cnpg.io', namespace: 'db', name: 'pg' }
+
+const cnpgKind = { name: 'clusters', group: cluster.group }
+const supported: HostFeatures = { cnpgWorkspace: 'supported' }
+const unsupported: HostFeatures = { cnpgWorkspace: 'unsupported' }
+const unknown: HostFeatures = { cnpgWorkspace: 'unknown' }
+const listProps = { namespaces: ['db'], inspected: null, onInspect: () => {}, onClearNamespaces: () => {}, onCreate: () => {} }
+
+function renderResource(data: any) {
+  const group = data.apiVersion.split('/')[0]
+  return renderToStaticMarkup(<MemoryRouter><ResourceRendererDispatch
+    resource={{ kind: kindToPluralWithGroup(data.kind, group), namespace: 'ml', name: 'run', group }}
+    data={data} onCopy={() => {}} copied={null} showCommonSections={false}
+    rendererOverrides={resourceRendererOverrides}
+  /></MemoryRouter>)
+}
+
+describe('application resource hosts', () => {
+  it('preserves existing CNPG access and exact group collisions without a new feature flag', () => {
+    expect(resourceExpandedPath(cluster, 'kind-demo', 'yaml')).toBe('/cnpg/clusters/db/pg?ctx=kind-demo&tab=yaml')
+    expect(resourceDetailSlots(cluster).renderSummary).toBeDefined()
+    for (const group of [undefined, '', 'cluster.x-k8s.io']) {
+      expect(resourceExpandedPath({ ...cluster, group })).toBeNull()
+      expect(resourceDetailSlots({ ...cluster, group })).toEqual({})
+    }
+    expect(resourceExpandedPath({ kind: 'NodePool', group: 'karpenter.sh', namespace: '', name: 'pool' })).toBeNull()
+  })
+
+  it('retains every existing renderer override at a stable module reference', () => {
+    expect(Object.keys(resourceRendererOverrides).sort()).toEqual([
+      'RayJobRenderer', 'JobRenderer', 'JobSetRenderer', 'RayServiceRenderer', 'RayClusterRenderer',
+      'KueueWorkloadRenderer', 'CAPIClusterRenderer', 'PodRenderer', 'KarpenterNodePoolRenderer',
+      'NodeRenderer', 'ServiceRenderer', 'WorkloadRenderer', 'CompositeRenderer', 'ServiceAccountRenderer',
+      'RoleRenderer', 'RoleBindingRenderer', 'NamespaceRenderer', 'HPARenderer', 'PVCRenderer',
+      'RolloutRenderer', 'KyvernoPolicyCoverage', 'KyvernoPolicyQueued', 'CNPGObjectStoreRenderer',
+      'VeleroBSLRenderer', 'VeleroBackupRenderer', 'VeleroRestoreRenderer', 'CNPGClusterRenderer',
+      'CNPGDatabaseRenderer', 'CNPGPublicationRenderer', 'CNPGSubscriptionRenderer', 'CNPGImageCatalogRenderer',
+    ].sort())
+    const inherited = [{ id: 'local', label: 'Local', render: () => null }]
+    expect(resourceDetailSlots({ kind: 'Pod', group: '', namespace: 'db', name: 'pg-1' }, inherited).extraTabs).toEqual(inherited)
+    expect(resourceExpandedPath({ ...cluster, group: undefined })).toBeNull()
+    expect(resourceDetailRedirect({ ...cluster, group: '' }, new URLSearchParams('tab=events'))).toBeNull()
+  })
+
+  it('keeps query, tab, context and drawer state when redirecting a generic detail link', () => {
+    const search = new URLSearchParams('apiGroup=postgresql.cnpg.io&ctx=kind-demo&tab=events&drawer=pods%3Apg-1&ai-run=run')
+    const path = resourceDetailRedirect({ ...cluster, kind: 'clusters' }, search)!
+    const url = new URL(path, 'http://radar.test')
+    expect(url.pathname).toBe('/cnpg/clusters/db/pg')
+    expect(Object.fromEntries(url.searchParams)).toEqual({ ctx: 'kind-demo', tab: 'activity', drawer: 'pods:pg-1', 'ai-run': 'run' })
+    expect(search.get('tab')).toBe('events')
+    expect(search.get('apiGroup')).toBe('postgresql.cnpg.io')
+  })
+
+  it('keeps integration log selection confined to observed CNPG Clusters and falls back for other resources', () => {
+    expect(isValidElement(resourceLogs(cluster, { apiVersion: 'postgresql.cnpg.io/v1' }))).toBe(true)
+    expect(isValidElement(resourceLogs({ ...cluster, group: undefined }, { apiVersion: 'postgresql.cnpg.io/v1' }))).toBe(true)
+    expect(resourceLogs(cluster, { apiVersion: 'cluster.x-k8s.io/v1beta1' })).toBeNull()
+    expect(resourceLogs({ ...cluster, kind: 'Pooler' }, { apiVersion: 'postgresql.cnpg.io/v1' })).toBeNull()
+    expect(resourceLogs({ kind: 'Pod', group: '', namespace: 'db', name: 'pg-1' }, { apiVersion: 'v1' })).toBeNull()
+  })
+
+  it('mounts drawer trail navigation for any inspected resource in its owning workspace, including embeds', () => {
+    const previous = { kind: 'backups', group: 'postgresql.cnpg.io', namespace: 'db', name: 'base' }
+    const pod = { kind: 'pods', group: '', namespace: 'db', name: 'pg-1' }
+    const search = `?drawer=${encodeURIComponent(encodeDrawerTrail([previous, pod]))}`
+    const html = renderToStaticMarkup(<MemoryRouter basename="/c/demo" initialEntries={[`/c/demo/cnpg/protection${search}`]}><ResourceDrawerNavigation resource={pod} /></MemoryRouter>)
+    expect(html).toContain('Backup base')
+    const ordinary = renderToStaticMarkup(<MemoryRouter initialEntries={[`/resources/pods${search}`]}><ResourceDrawerNavigation resource={pod} /></MemoryRouter>)
+    expect(ordinary).toBe('')
+  })
+
+  it('preserves shared version dispatch and simultaneous batch/Kueue detail in the stable override map', () => {
+    const data = { kind: 'Job', apiVersion: 'batch/v1', metadata: { name: 'run', namespace: 'ml', uid: 'job-id', labels: { 'kueue.x-k8s.io/queue-name': 'queue' } }, spec: { completions: 1 }, status: { active: 1 } }
+    const job = renderResource(data)
+    expect(job).toContain('Completions')
+    expect(job).toContain('No controller-owned Kueue Workload observed')
+    const jobSet = { ...data, kind: 'JobSet', apiVersion: 'jobset.x-k8s.io/v1alpha2', spec: { replicatedJobs: [] } }
+    const current = renderResource(jobSet)
+    expect(current).toContain('JobSet status')
+    expect(current).toContain('No controller-owned Kueue Workload observed')
+    for (const apiVersion of ['jobset.x-k8s.io/v1beta1', 'example.io/v1alpha2']) {
+      const generic = renderResource({ ...jobSet, apiVersion })
+      expect(generic).not.toContain('JobSet status')
+      expect(generic).not.toContain('No controller-owned Kueue Workload observed')
+    }
+    const foreignJob = renderResource({ ...data, apiVersion: 'batch.volcano.sh/v1alpha1' })
+    expect(foreignJob).toContain('Specification')
+    expect(foreignJob).not.toContain('No controller-owned Kueue Workload observed')
+  })
+
+  it('makes the same kind-list decision for fetching and rendering across feature states', () => {
+    for (const [features, pending, mode] of [
+      [supported, true, 'view'], [supported, false, 'view'],
+      [unknown, true, 'wait'], [unknown, false, 'table'],
+      [unsupported, true, 'table'], [unsupported, false, 'table'],
+    ] as const) {
+      expect(resourceKindListMode(cnpgKind, features, pending)).toBe(mode)
+      const view = renderResourceKindList(cnpgKind, features, pending, listProps)
+      expect(view !== null).toBe(mode !== 'table')
+      if (mode === 'wait') expect(renderToStaticMarkup(view)).toContain('Loading…')
+    }
+    for (const group of ['', 'cluster.x-k8s.io']) {
+      expect(resourceKindListMode({ ...cnpgKind, group }, supported, true)).toBe('table')
+      expect(renderResourceKindList({ ...cnpgKind, group }, supported, true, listProps)).toBeNull()
+      expect(resourceKindListTitle({ ...cnpgKind, group })).toBeNull()
+    }
+    expect(resourceKindListTitle(cnpgKind)).toBe('CloudNativePG Clusters')
+  })
+
+  it('decorates Diagnose only for the integration-owned resource context', () => {
+    const render = vi.fn(() => <span>diagnose</span>)
+    const decorated = decorateResourceDiagnose(render)!
+    const context = { ...cluster, compact: false }
+    expect(isValidElement(decorated(context))).toBe(true)
+    expect(render).not.toHaveBeenCalled()
+    decorated({ ...context, group: 'cluster.x-k8s.io' })
+    expect(render).toHaveBeenCalledOnce()
+    expect(decorateResourceDiagnose(undefined)).toBeUndefined()
+  })
+})