@skyhook-io/radar-app 1.14.4 → 1.14.6

package/src/components/ui/command-items.ts

@@ -146,9 +146,6 @@ const VIEW_ENTRIES: {
   { view: "cost", label: "Cost", icon: Coins, shortcut: "g c" },
 ];
 
-// The static command-palette items (Views, Resource Kinds, Contexts,
-// Namespaces, Actions) — shared by the centered modal (embedded) and the
-// standalone omnibar so the two never drift.
 export function useCommandItems(cb: CommandItemCallbacks): CommandItem[] {
   const { data: namespacesData } = useNamespaces();
   const { data: contexts } = useContexts();

package/src/components/useContextSwitchFlow.tsx

@@ -0,0 +1,147 @@
+import { useState, type ReactNode } from 'react'
+import { AlertTriangle } from 'lucide-react'
+import { pluralize } from '@skyhook-io/k8s-ui'
+import { useSwitchContext, fetchSessionCounts, type SessionCounts } from '../api/client'
+import { useContextSwitch } from '../context/ContextSwitchContext'
+import { useToast } from './ui/Toast'
+import { useDock } from './dock'
+import type { ContextInfo, SelectedResource } from '../types'
+import { parseContextForSwitcher } from '../utils/context-name'
+
+function shouldSuppressSwitchErrorToast(error: unknown): boolean {
+  const message = error instanceof Error ? error.message : ''
+  return message.includes('cluster connection failed:')
+}
+
+interface PendingSwitch {
+  context: ContextInfo
+  openAfter?: SelectedResource
+}
+
+// The one way to switch contexts from the UI: the switching overlay, a
+// confirmation when port-forwards or terminals would be killed, and an error
+// toast when the switch fails. `openAfter` is opened once the new context is
+// live. Callers render `confirmDialog`.
+export function useContextSwitchFlow() {
+  const switchContext = useSwitchContext()
+  const { startSwitch, endSwitch, setOpenAfterSwitch } = useContextSwitch()
+  const { showError } = useToast()
+  const { tabs } = useDock()
+  const [pending, setPending] = useState<PendingSwitch | null>(null)
+  const [sessionCounts, setSessionCounts] = useState<SessionCounts | null>(null)
+
+  const performSwitch = async ({ context, openAfter }: PendingSwitch) => {
+    const parsed = parseContextForSwitcher(context)
+    startSwitch({
+      raw: parsed.raw,
+      provider: parsed.provider,
+      account: parsed.account,
+      region: parsed.region,
+      clusterName: parsed.clusterName,
+    })
+    setOpenAfterSwitch(openAfter ? { context: context.name, resource: openAfter } : null)
+    try {
+      await switchContext.mutateAsync({ name: context.name })
+    } catch (error) {
+      console.error('Failed to switch context:', error)
+      setOpenAfterSwitch(null)
+      endSwitch()
+      // Backend may not transition to StateDisconnected on client-side errors
+      // (network, timeout) — without this toast the user gets no feedback.
+      if (!shouldSuppressSwitchErrorToast(error)) {
+        const message = error instanceof Error ? error.message : 'Unknown error'
+        showError('Failed to switch context', message)
+      }
+    }
+  }
+
+  const requestSwitch = async (context: ContextInfo, openAfter?: SelectedResource) => {
+    if (context.isCurrent || switchContext.isPending) return
+    // Active sessions (port forwards from API + terminal tabs from dock) get
+    // a confirmation prompt — switching contexts kills both.
+    try {
+      const counts = await fetchSessionCounts()
+      const terminalTabs = tabs.filter(t => t.type === 'terminal').length
+      const total = counts.portForwards + terminalTabs
+      if (total > 0) {
+        setSessionCounts({ ...counts, execSessions: terminalTabs, total })
+        setPending({ context, openAfter })
+        return
+      }
+    } catch (error) {
+      // Session-counts is best-effort; failing it shouldn't block the user.
+      // But warn — if there ARE active sessions we couldn't see, the switch
+      // will silently kill them.
+      console.error('Failed to check sessions:', error)
+      showError(
+        'Could not check active sessions',
+        'Switching anyway. Any open port-forwards or terminals will be terminated.',
+      )
+    }
+    performSwitch({ context, openAfter })
+  }
+
+  const confirm = () => {
+    if (pending) performSwitch(pending)
+    setPending(null)
+  }
+
+  const cancel = () => {
+    setPending(null)
+    setSessionCounts(null)
+  }
+
+  const confirmDialog: ReactNode = pending && sessionCounts ? (
+    <div className="fixed inset-0 z-[100] flex items-center justify-center bg-black/50">
+      <div className="bg-theme-surface border border-theme-border rounded-lg shadow-xl max-w-md mx-4 overflow-hidden">
+        <div className="px-4 py-3 border-b border-theme-border flex items-center gap-2">
+          <AlertTriangle className="w-5 h-5 text-amber-400" />
+          <span className="font-medium text-theme-text-primary">Active Sessions</span>
+        </div>
+        <div className="px-4 py-4">
+          <p className="text-sm text-theme-text-secondary mb-3">
+            Switching contexts will terminate active sessions:
+          </p>
+          <ul className="text-sm text-theme-text-primary space-y-1 mb-4">
+            {sessionCounts.portForwards > 0 && (
+              <li className="flex items-center gap-2">
+                <span className="w-1.5 h-1.5 rounded-full bg-blue-400" />
+                {pluralize(sessionCounts.portForwards, 'port forward')}
+              </li>
+            )}
+            {sessionCounts.execSessions > 0 && (
+              <li className="flex items-center gap-2">
+                <span className="w-1.5 h-1.5 rounded-full bg-green-400" />
+                {pluralize(sessionCounts.execSessions, 'terminal session')}
+              </li>
+            )}
+          </ul>
+          <p className="text-xs text-theme-text-tertiary">
+            Switch to: <span className="text-theme-text-secondary">{parseContextForSwitcher(pending.context).clusterName}</span>
+          </p>
+        </div>
+        <div className="px-4 py-3 border-t border-theme-border flex justify-end gap-2">
+          <button
+            onClick={cancel}
+            className="px-3 py-1.5 text-sm rounded-md bg-theme-elevated hover:bg-theme-hover text-theme-text-secondary transition-colors"
+          >
+            Cancel
+          </button>
+          <button
+            onClick={confirm}
+            className="px-3 py-1.5 text-sm rounded-md bg-amber-500 hover:bg-amber-600 text-white transition-colors"
+          >
+            Switch Anyway
+          </button>
+        </div>
+      </div>
+    </div>
+  ) : null
+
+  return {
+    requestSwitch,
+    isPending: switchContext.isPending,
+    error: switchContext.isError ? switchContext.error : null,
+    confirmDialog,
+  }
+}

package/src/components/workload/WorkloadView.test.ts

@@ -2,7 +2,7 @@ import { describe, expect, it } from 'vitest'
 
 import { gitOpsOwnerFromRelationships } from '@skyhook-io/k8s-ui'
 import type { Relationships } from '../../types'
-import { findInheritedGitOpsLookupRef } from './WorkloadView'
+import { findInheritedGitOpsLookupRef, supportsBatchExecution } from './WorkloadView'
 
 describe('findInheritedGitOpsLookupRef', () => {
   it('follows a referenced ReplicaSet to its parent workload for inherited ownership', () => {
@@ -58,3 +58,19 @@ describe('findInheritedGitOpsLookupRef', () => {
     ).toBeNull()
   })
 })
+
+describe('supportsBatchExecution', () => {
+  it('enables only the supported JobSet API identity', () => {
+    expect(supportsBatchExecution('JobSet', 'jobsets', 'jobset.x-k8s.io', 'jobset.x-k8s.io/v1alpha2')).toBe(true)
+    expect(supportsBatchExecution('JobSet', 'jobsets', 'jobset.x-k8s.io')).toBe(false)
+    expect(supportsBatchExecution('JobSet', 'jobsets', 'example.io', 'example.io/v1alpha2')).toBe(false)
+    expect(supportsBatchExecution('JobSet', 'jobsets', 'example.io', 'jobset.x-k8s.io/v1alpha2')).toBe(false)
+    expect(supportsBatchExecution('JobSet', 'jobsets', 'jobset.x-k8s.io', 'jobset.x-k8s.io/v1beta1')).toBe(false)
+  })
+
+  it('preserves the core Job collision guard and existing scheduled kinds', () => {
+    expect(supportsBatchExecution('Job', 'jobs', 'batch')).toBe(true)
+    expect(supportsBatchExecution('Job', 'jobs', 'example.io')).toBe(false)
+    expect(supportsBatchExecution('CronJob', 'cronjobs', 'batch')).toBe(true)
+  })
+})

package/src/components/workload/WorkloadView.tsx

@@ -1,3 +1,6 @@
+import { RayClusterRenderer } from '../resources/renderers/RayClusterRenderer'
+import { RayServiceRenderer } from '../resources/renderers/RayServiceRenderer'
+import { KueueWorkloadRenderer } from '../resources/renderers/KueueWorkloadRenderer'
 import { useMemo, useEffect, useCallback, useRef, useState } from 'react'
 import { useQueries, useQueryClient } from '@tanstack/react-query'
 import { useNavigate, useLocation, useSearchParams } from 'react-router-dom'
@@ -29,6 +32,7 @@ import {
   type WorkloadImageTarget,
 } from '@skyhook-io/k8s-ui'
 import type { ServicePortRenderProps } from '@skyhook-io/k8s-ui/components/resources/renderers/ServiceRenderer'
+import { isJobSetV1Alpha2 } from '@skyhook-io/k8s-ui/components/resources/resource-utils-jobset-lws'
 import type { SelectedResource, ResourceRef, Relationships, ResourceWithRelationships } from '../../types'
 import {
   kindToPlural,
@@ -121,6 +125,7 @@ import { ServiceAccountRenderer } from '../resources/renderers/ServiceAccountRen
 import { RoleRenderer } from '../resources/renderers/RoleRenderer'
 import { RoleBindingRenderer } from '../resources/renderers/RoleBindingRenderer'
 import { NamespaceRenderer } from '../resources/renderers/NamespaceRenderer'
+import { CAPIClusterRenderer } from '../resources/renderers/CAPIClusterRenderer'
 import { HPARenderer } from '../resources/renderers/HPARenderer'
 import { PVCRenderer } from '../resources/renderers/PVCRenderer'
 import { RolloutRenderer } from '../resources/renderers/RolloutRenderer'
@@ -152,10 +157,24 @@ const BATCH_EXECUTION_KINDS = new Set([
   'WorkflowTemplate',
   'ClusterWorkflowTemplate',
   'ScaledJob',
+  'JobSet',
 ])
 
+export function supportsBatchExecution(kind: string, apiKind: string, group?: string, apiVersion?: string): boolean {
+  if (!BATCH_EXECUTION_KINDS.has(kind)) return false
+  if (kind === 'Job') return isCoreBatchJob(apiKind, group)
+  if (kind === 'JobSet') {
+    return group === 'jobset.x-k8s.io' && isJobSetV1Alpha2({ kind, apiVersion })
+  }
+  return true
+}
+
 // Stable reference — web renderer wrappers inject platform hooks internally
 const rendererOverrides: RendererOverrides = {
+  RayServiceRenderer,
+  RayClusterRenderer,
+  KueueWorkloadRenderer,
+  CAPIClusterRenderer,
   PodRenderer,
   KarpenterNodePoolRenderer,
   NodeRenderer,
@@ -548,18 +567,6 @@ export function WorkloadView({
     [searchParams, setSearchParams],
   )
 
-  const batchKind = pluralToKind(apiKind)
-  const batchExecution = BATCH_EXECUTION_KINDS.has(batchKind) &&
-    (batchKind !== 'Job' || isCoreBatchJob(apiKind, rest.group))
-  const batchRunsQuery = useWorkloadRuns(apiKind, namespace, name, expanded && batchExecution, {
-    refetchActive: true,
-    clusterScoped: batchKind === 'ClusterWorkflowTemplate',
-  })
-  const relatedTimelineEvents = useMemo(
-    () => workloadRunTimelineEvents(batchRunsQuery.data?.runs ?? []),
-    [batchRunsQuery.data?.runs],
-  )
-
   // Fetch resource with relationships
   const {
     data: resourceResponse,
@@ -579,6 +586,16 @@ export function WorkloadView({
   // of itself. Fall back to the group derived from the fetched resource, then
   // to undefined (which the gate treats as "group unknown → allow").
   const effectiveGroup = rest.group || resourceGroup || undefined
+  const batchKind = pluralToKind(apiKind)
+  const batchExecution = supportsBatchExecution(batchKind, apiKind, effectiveGroup, resource?.apiVersion)
+  const batchRunsQuery = useWorkloadRuns(apiKind, namespace, name, expanded && batchExecution, {
+    refetchActive: true,
+    clusterScoped: batchKind === 'ClusterWorkflowTemplate',
+  })
+  const relatedTimelineEvents = useMemo(
+    () => batchKind === 'JobSet' ? [] : workloadRunTimelineEvents(batchRunsQuery.data?.runs ?? []),
+    [batchKind, batchRunsQuery.data?.runs],
+  )
   // Reachability for a workload IS the reachability of the Services in front of
   // it - a Deployment has no address of its own. Empty for a workload nothing
   // selects, which correctly leaves the tab hidden: there is no path to trace.
@@ -595,6 +612,7 @@ export function WorkloadView({
       }),
       queryClient.refetchQueries({
         queryKey: ['workload-pods', apiKind, namespace, name],
+        ...(apiKind === 'rayclusters' ? { type: 'active' as const } : {}),
       }),
     ])
   }, [apiKind, name, namespace, queryClient, refetchResource])
@@ -761,7 +779,7 @@ export function WorkloadView({
     isLoading: resourceFocusedEventsLoading,
     k8sError: resourceFocusedK8sError,
     updatesError: resourceFocusedUpdatesError,
-  } = useResourceEvents(apiKind, namespace, name)
+  } = useResourceEvents(apiKind, namespace, name, effectiveGroup)
 
   // Fetch all events for this resource's namespace (only when expanded)
   const { data: allEvents, isLoading: eventsLoading } = useChanges({
@@ -868,7 +886,7 @@ export function WorkloadView({
   // the renderer banners. The backend canonicalizes a plural kind via discovery,
   // so using the normalized API kind resolves direct links and app navigation alike.
   const { data: liveIssues, isPending: issuesPending } = useResourceIssues(apiKind, rest.group, namespace, name)
-  const { data: auditFindings } = useResourceAudit(apiKind, namespace, name)
+  const { data: auditFindings } = useResourceAudit(apiKind, namespace, name, effectiveGroup)
   const hasOperationalIssues = Boolean(liveIssues?.length)
   const {
     onCompareTo,
@@ -1169,7 +1187,7 @@ export function WorkloadView({
         // Timeline
         allEvents={allEvents}
         relatedTimelineEvents={relatedTimelineEvents}
-        eventsLoading={eventsLoading || (batchExecution && batchRunsQuery.isLoading)}
+        eventsLoading={eventsLoading || (batchExecution && batchKind !== 'JobSet' && batchRunsQuery.isLoading)}
         topology={topology}
         resourceFocusedK8sEvents={resourceFocusedK8sEvents}
         resourceFocusedUpdates={resourceFocusedUpdates}
@@ -1199,8 +1217,7 @@ export function WorkloadView({
           />
         )}
         renderExpandedOverview={({ kind: k, apiKind, namespace: ns, name: n, resource: res }) =>
-          BATCH_EXECUTION_KINDS.has(k) &&
-          (k !== 'Job' || isCoreBatchJob(apiKind, effectiveGroup)) &&
+          supportsBatchExecution(k, apiKind, effectiveGroup, res?.apiVersion) &&
           res ? (
             <BatchExecutionFullscreen
               kind={k}
@@ -1561,6 +1578,7 @@ const SCHEDULED_LOG_KINDS = new Set([
   'WorkflowTemplate',
   'ClusterWorkflowTemplate',
   'ScaledJob',
+  'JobSet',
 ])
 
 function LogsTabContent({
@@ -1592,7 +1610,7 @@ function LogsTabContent({
   selectedRunKey: string
   onSelectRun: (runKey: string) => void
 }) {
-  if (SCHEDULED_LOG_KINDS.has(kind)) {
+  if (SCHEDULED_LOG_KINDS.has(kind) && supportsBatchExecution(kind, apiKind, group, resource?.apiVersion)) {
     return (
       <div className="h-full">
         <ScheduledWorkloadLogsViewer

package/src/context/ContextSwitchContext.tsx

@@ -1,4 +1,5 @@
-import { createContext, useContext, useState, useCallback, ReactNode } from 'react'
+import { createContext, useContext, useState, useCallback, useRef, ReactNode } from 'react'
+import type { SelectedResource } from '../types'
 
 export interface ParsedContextInfo {
   raw: string
@@ -15,6 +16,11 @@ interface ContextSwitchState {
   startSwitch: (context: ParsedContextInfo) => void
   updateProgress: (message: string) => void
   endSwitch: () => void
+  // A resource to open once a switch to `context` is live. The app's context
+  // reset takes it, so the open can't race the reset that clears the old
+  // cluster's drawer and URL. A change to any other context discards it.
+  setOpenAfterSwitch: (target: { context: string; resource: SelectedResource } | null) => void
+  takeOpenAfterSwitch: (context: string) => SelectedResource | null
 }
 
 const ContextSwitchContext = createContext<ContextSwitchState | null>(null)
@@ -40,8 +46,18 @@ export function ContextSwitchProvider({ children }: { children: ReactNode }) {
     setProgressMessage(null)
   }, [])
 
+  const openAfterSwitch = useRef<{ context: string; resource: SelectedResource } | null>(null)
+  const setOpenAfterSwitch = useCallback((target: { context: string; resource: SelectedResource } | null) => {
+    openAfterSwitch.current = target
+  }, [])
+  const takeOpenAfterSwitch = useCallback((context: string) => {
+    const target = openAfterSwitch.current
+    openAfterSwitch.current = null
+    return target && target.context === context ? target.resource : null
+  }, [])
+
   return (
-    <ContextSwitchContext.Provider value={{ isSwitching, targetContext, progressMessage, startSwitch, updateProgress, endSwitch }}>
+    <ContextSwitchContext.Provider value={{ isSwitching, targetContext, progressMessage, startSwitch, updateProgress, endSwitch, setOpenAfterSwitch, takeOpenAfterSwitch }}>
       {children}
     </ContextSwitchContext.Provider>
   )

package/src/context/NavCustomization.tsx

@@ -1,15 +1,3 @@
-// Slot-based customization of Radar's top nav.
-//
-// Lets library consumers (e.g. Radar Hub) swap out the brand area, the
-// context picker, and append items on the right of the action bar —
-// without forking App.tsx or building a parallel nav.
-//
-// The `embedded` flag hides chrome that only makes sense for Radar's
-// standalone OSS binary: GitHub star link, update-from-GitHub notifier,
-// Radar's own OIDC/proxy-mode UserMenu. Consumers typically provide
-// their own auth UI via `rightExtras`.
-//
-// Default (no provider): Radar renders its standalone nav unchanged.
 import { createContext, useContext } from 'react';
 import type { ReactNode } from 'react';
 
@@ -21,11 +9,9 @@ import type { ReactNode } from 'react';
  */
 export type FleetTakeoverTarget = 'issues' | 'gitops' | 'checks' | 'certs';
 
-interface NavCustomizationBase {
-  /** Replaces Radar's Skyhook/radar logo + wordmark. */
-  brandSlot?: ReactNode;
-  /** Replaces the ContextSwitcher (kubeconfig-context picker). */
-  contextSlot?: ReactNode;
+export interface NavCustomization {
+  /** Radar Hub owns all chrome; Radar renders only the active view. */
+  embedded?: boolean;
   /**
    * When set, a "Compare across clusters" option is added to the Compare
    * button in resource action bars. The host returns the URL that should
@@ -50,8 +36,7 @@ interface NavCustomizationBase {
    * canonical surfaces rather than a second, diverging per-cluster copy:
    *   - 'issues'  → the Active Issues panel + cluster-health issues count
    *   - 'gitops'  → the GitOps controllers card
-   *   - 'checks'  → the Cluster Audit card (and any route to /audit; legacy
-   *                 `clusterChecksHref` folded in here)
+   *   - 'checks'  → the Cluster Audit card (and any route to /audit)
    *   - 'certs'   → the Certificate Health card
    *
    * View-shaped targets (issues / gitops / checks) are honored for every entry:
@@ -64,13 +49,6 @@ interface NavCustomizationBase {
    * falls back to `window.location` (a hard reload).
    */
   fleetTakeoverHref?: (target: FleetTakeoverTarget) => string | undefined;
-  /**
-   * @deprecated Superseded by `fleetTakeoverHref('checks')`. Kept so consumers
-   * still on the pre-1.7 hook keep working (App.tsx folds it into the 'checks'
-   * target) — this makes adding `fleetTakeoverHref` an additive, non-breaking
-   * change. Remove in a major release once all consumers have migrated.
-   */
-  clusterChecksHref?: () => string;
   /**
    * Optional smooth navigator for host-owned URLs. When the host takes a
    * destination over (`fleetTakeoverHref`, `crossClusterCompareHref`), Radar
@@ -82,40 +60,8 @@ interface NavCustomizationBase {
    * OSS / other hosts are unaffected.
    */
   onHostNavigate?: (url: string) => void;
-  /**
-   * Chrome level for embedded hosts. Default ('full', or omitted) renders
-   * Radar's top bar + the view-switcher. 'none' suppresses BOTH — the host
-   * drives view navigation and cluster/namespace scope from its OWN chrome, and
-   * Radar renders just the active view's content full-bleed. Radar Hub uses this
-   * to surface per-cluster views (Topology / Resources / Traffic / Cost) that
-   * don't aggregate to the fleet as native cloud destinations under one chrome,
-   * gated by a cluster picker — instead of a second, redundant in-cluster nav.
-   * Only meaningful with `embedded: true`.
-   */
-  chrome?: 'full' | 'none';
 }
 
-/**
- * Slot-based customization of Radar's top nav.
- *
- * Standalone-mode consumers pass `embedded: false` (or omit it) and may
- * optionally append items via `rightExtras`. Embedded-mode consumers must
- * supply `rightExtras` — Radar's OSS chrome (GitHub star, update notifier,
- * built-in UserMenu) is hidden, so the host app owns the right side of the
- * nav and must render its own user/auth UI there.
- */
-export type NavCustomization =
-  | (NavCustomizationBase & {
-      embedded?: false;
-      /** Appended to the right of the action bar (before the UserMenu). */
-      rightExtras?: ReactNode;
-    })
-  | (NavCustomizationBase & {
-      embedded: true;
-      /** Required in embedded mode: Radar's own UserMenu is hidden. */
-      rightExtras: ReactNode;
-    });
-
 const NavCustomizationContext = createContext<NavCustomization>({});
 
 export function NavCustomizationProvider({

package/src/context/ThemeContext.tsx

@@ -1,5 +1,5 @@
 import { createContext, useContext, useEffect, useState, ReactNode } from 'react'
-import { apiUrl, getAuthHeaders, getCredentialsMode } from '../api/config'
+import { loadPreferences, persistPreferences } from '../api/preferences'
 
 type Theme = 'dark' | 'light'
 
@@ -34,14 +34,7 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
   const setTheme = (newTheme: Theme) => {
     setThemeState(newTheme)
     localStorage.setItem(THEME_STORAGE_KEY, newTheme)
-    fetch(apiUrl('/settings'), {
-      method: 'PUT',
-      credentials: getCredentialsMode(),
-      headers: { 'Content-Type': 'application/json', ...getAuthHeaders() },
-      body: JSON.stringify({ theme: newTheme }),
-    }).then((res) => {
-      if (!res.ok) console.warn('[settings] Failed to persist theme:', res.status)
-    }).catch((err) => console.warn('[settings] Failed to persist theme:', err))
+    persistPreferences({ theme: newTheme }).catch((err) => console.warn('[settings] Failed to persist theme:', err))
   }
 
   const toggleTheme = () => {
@@ -56,8 +49,7 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
 
   // Sync theme from server (persisted settings survive port changes in desktop app)
   useEffect(() => {
-    fetch(apiUrl('/settings'), { credentials: getCredentialsMode(), headers: getAuthHeaders() })
-      .then((res) => res.ok ? res.json() : null)
+    loadPreferences()
       .then((data) => {
         if (data?.theme && (data.theme === 'dark' || data.theme === 'light') && data.theme !== theme) {
           setThemeState(data.theme)

package/src/hooks/useClusterLoadState.ts

@@ -21,8 +21,8 @@ interface UseClusterLoadStateResult {
 }
 
 // Tracks cluster-data warmup (deferred/partial dashboard load) once the main
-// connection is usable. Standalone / embedded-with-chrome render it in Radar's
-// topbar; chromeless hosts (Radar Hub) receive it via onClusterLoadStateChange;
+// connection is usable. Standalone renders it in Radar's topbar; Radar Hub
+// receives it via onClusterLoadStateChange;
 // a chromeless host without a callback gets a fallback row on Home.
 export function useClusterLoadState({
   namespaces,

package/src/hooks/useFavorites.ts

@@ -1,5 +1,5 @@
 import { useState, useCallback, useEffect } from 'react'
-import { apiUrl, getAuthHeaders, getCredentialsMode } from '../api/config'
+import { loadPreferences, persistPreferences } from '../api/preferences'
 
 export interface PinnedKind {
   name: string       // plural name for API calls, e.g. "pods", "deployments"
@@ -25,8 +25,7 @@ function savePinned(pinned: PinnedKind[]) {
   } catch {
     // ignore storage errors
   }
-  fetch(apiUrl('/settings'), { method: 'PUT', credentials: getCredentialsMode(), headers: { 'Content-Type': 'application/json', ...getAuthHeaders() }, body: JSON.stringify({ pinnedKinds: pinned }) })
-    .then((res) => { if (!res.ok) console.warn('[settings] Failed to persist pinned kinds:', res.status) })
+  persistPreferences({ pinnedKinds: pinned })
     .catch((err) => console.warn('[settings] Failed to persist pinned kinds:', err))
 }
 
@@ -39,8 +38,7 @@ export function usePinnedKinds() {
 
   // Sync from server (persisted settings survive port changes in desktop app)
   useEffect(() => {
-    fetch(apiUrl('/settings'), { credentials: getCredentialsMode(), headers: getAuthHeaders() })
-      .then((res) => res.ok ? res.json() : null)
+    loadPreferences()
       .then((data) => {
         if (data?.pinnedKinds?.length && loadPinned().length === 0) {
           setPinned(data.pinnedKinds)

package/src/utils/auditBadges.ts

@@ -30,7 +30,7 @@ export function isBadgeWorthy(
 /**
  * buildAuditSeverityMap keys badge-worthy findings by the same resource key the
  * backend stamps onto topology nodes (`node.data.auditKey`): `group|Kind|ns|name`,
- * group following the audit convention (built-ins → their group, CRDs → "").
+ * using the resource’s actual API group.
  */
 export function buildAuditSeverityMap(
   findings: AuditFinding[] | undefined,

package/src/utils/navigation.test.ts

@@ -1,9 +1,10 @@
+import type { Topology } from '@skyhook-io/k8s-ui/types/core'
 import { afterEach, describe, expect, it } from 'vitest'
 import {
   initNavigationMap,
   resetNavigationMap,
 } from '@skyhook-io/k8s-ui/utils/navigation'
-import { relatedResourcePath, resourcePath } from './navigation'
+import { getNetworkPolicyResourceTarget, relatedResourcePath, resourcePath } from './navigation'
 
 afterEach(resetNavigationMap)
 
@@ -43,3 +44,19 @@ describe('resource navigation paths', () => {
     ).toBe('/workload/pods/default/batch')
   })
 })
+
+
+describe('JobSet investigation navigation', () => {
+  it('preserves selected member and tab on the exact JobSet route', () => {
+    expect(relatedResourcePath({ kind: 'jobsets', namespace: 'training', name: 'wide', group: 'jobset.x-k8s.io', run: 'jobs/training/worker-240', tab: 'logs' })).toBe('/workload/jobsets/training/wide?apiGroup=jobset.x-k8s.io&run=jobs%2Ftraining%2Fworker-240&tab=logs')
+  })
+  it('leaves colliding JobSet kinds in their group-aware drawer', () => {
+    expect(relatedResourcePath({ kind: 'jobsets', namespace: 'training', name: 'wide', group: 'other.example' })).toBe('/resources/jobsets?resource=training%2Fwide&apiGroup=other.example')
+  })
+})
+
+
+it('uses the Kubernetes kind for a Calico aggregate target', () => {
+  expect(getNetworkPolicyResourceTarget({nodes: [{id: 'policy', kind: 'CalicoNetworkPolicy', name: 'allow', status: 'healthy', data: {apiVersion: 'crd.projectcalico.org/v1', resourceKind: 'NetworkPolicy'}}], edges: []} as unknown as Topology))
+    .toEqual({kind: 'networkpolicies', group: 'crd.projectcalico.org'})
+})

package/src/utils/navigation.ts

@@ -1,5 +1,6 @@
 import { apiUrl, getAuthHeaders, getCredentialsMode } from '../api/config'
 import { apiVersionToGroup, kindToPluralWithGroup } from '@skyhook-io/k8s-ui/utils/navigation'
+import { topologyNodeResourceKind } from '@skyhook-io/k8s-ui/utils/topology-neighborhood'
 import type { SelectedResource, Topology } from '@skyhook-io/k8s-ui/types/core'
 import type { SearchHit } from '../api/client'
 
@@ -48,7 +49,7 @@ export function getNetworkPolicyResourceTarget(topology: Topology | null): { kin
 
     const group = networkPolicyGroup(node)
     const target = {
-      kind: kindToPluralWithGroup(node.kind, group ?? ''),
+      kind: kindToPluralWithGroup(topologyNodeResourceKind(node), group ?? ''),
       ...(group ? { group } : {}),
     }
     targets.set(`${target.kind}\u0000${target.group ?? ''}`, target)
@@ -67,12 +68,18 @@ export function getNetworkPolicyResourceTarget(topology: Topology | null): { kin
  * positional and WorkloadViewRoute can parse it back. '_' is safe — it's not a
  * valid DNS-1123 namespace label, so it can never collide with a real one.
  */
-export function buildWorkloadPath(resource: SelectedResource): string {
+export type ResourceNavigationTarget = SelectedResource & { run?: string; tab?: string }
+
+export function buildWorkloadPath(resource: ResourceNavigationTarget): string {
   const kind = encodeURIComponent(resource.kind)
   const namespace = encodeURIComponent(resource.namespace || '_')
   const name = encodeURIComponent(resource.name)
   const base = `/workload/${kind}/${namespace}/${name}`
-  return resource.group ? `${base}?apiGroup=${encodeURIComponent(resource.group)}` : base
+  const params = new URLSearchParams()
+  if (resource.group) params.set('apiGroup', resource.group)
+  if (resource.run) params.set('run', resource.run)
+  if (resource.tab) params.set('tab', resource.tab)
+  return params.size ? `${base}?${params}` : base
 }
 
 /**
@@ -101,9 +108,9 @@ export function resourcePath(resource: SelectedResource): string {
 
 const FULLSCREEN_RESOURCE_KINDS = new Set(['pods', 'deployments', 'statefulsets', 'daemonsets', 'jobs', 'cronjobs', 'nodes'])
 
-export function relatedResourcePath(resource: SelectedResource): string {
+export function relatedResourcePath(resource: ResourceNavigationTarget): string {
   const apiKind = kindToPluralWithGroup(resource.kind, resource.group ?? '').toLowerCase()
-  if (FULLSCREEN_RESOURCE_KINDS.has(apiKind)) {
+  if (FULLSCREEN_RESOURCE_KINDS.has(apiKind) || (apiKind === 'jobsets' && resource.group === 'jobset.x-k8s.io')) {
     return buildWorkloadPath({ ...resource, kind: apiKind })
   }
   return resourcePath(resource)