@skyhook-io/radar-app 1.13.4 → 1.14.0

package/src/components/traffic/TrafficGraph.tsx

@@ -23,7 +23,7 @@ import { isClusterAddon, type AddonMode } from './TrafficView'
 import { SEVERITY_BADGE, SEVERITY_DOT, SEVERITY_TEXT } from '@skyhook-io/k8s-ui/utils/badge-colors'
 import { getNamespaceColor } from '../../utils/traffic-colors'
 import { Tooltip } from '../ui/Tooltip'
-import { isRateBasedSource } from './trafficFilters'
+import { isRateBasedSource, isExternalKind } from './trafficFilters'
 
 const elk = new ELK()
 
@@ -172,7 +172,7 @@ const MAX_VISIBLE_PORTS = 4 // Maximum ports to show before "+N more"
 
 // Custom node component
 function TrafficNode({ data }: { data: TrafficNodeData }) {
-  const isExternal = data.kind.toLowerCase() === 'external'
+  const isExternal = isExternalKind(data.kind)
   const isInternet = data.kind === 'Internet'
   const isAddonInternet = data.kind === 'AddonInternet' // Separate internet for addon traffic
   const isAddon = data.kind === 'Addon'
@@ -515,7 +515,7 @@ function DetailsPanel({
               <Globe className="h-4 w-4 text-sky-400" />
             ) : nodeData?.kind === 'Addon' ? (
               <Server className="h-4 w-4 text-purple-400" />
-            ) : nodeData?.kind.toLowerCase() === 'external' ? (
+            ) : nodeData && isExternalKind(nodeData.kind) ? (
               <Globe className="h-4 w-4 text-yellow-500" />
             ) : (
               <Server className="h-4 w-4 text-blue-500" />
@@ -554,7 +554,7 @@ function DetailsPanel({
                     ? 'bg-sky-500/20 text-sky-400'
                     : nodeData.kind === 'Addon'
                       ? 'bg-purple-500/20 text-purple-400'
-                      : nodeData.kind.toLowerCase() === 'external'
+                      : isExternalKind(nodeData.kind)
                         ? 'bg-yellow-500/20 text-yellow-400'
                         : 'bg-blue-500/20 text-blue-400'
                 )}>{nodeData.kind === 'Addon' ? 'Cluster Addons' : nodeData.kind}</span>
@@ -1192,7 +1192,7 @@ export function TrafficGraph({ flows, hotPathThreshold = 0, showNamespaceGroups
             namespaceColor: showNamespaceGroups && !sourceIsAddon ? getNamespaceColor(flow.source.namespace) : undefined,
             isHotPath: hotNodes.has(sourceId),
             isAddonNode: sourceIsAddon, // AddonInternet is NOT an addon node
-            serviceCategory: flow.source.kind.toLowerCase() === 'external' ? serviceCategories?.get(flow.source.name) : undefined,
+            serviceCategory: isExternalKind(flow.source.kind) ? serviceCategories?.get(flow.source.name) : undefined,
             nodeHeight: NODE_BASE_HEIGHT,
             connLabel,
           },
@@ -1254,7 +1254,7 @@ export function TrafficGraph({ flows, hotPathThreshold = 0, showNamespaceGroups
             namespaceColor: showNamespaceGroups && !destIsAddon ? getNamespaceColor(flow.destination.namespace) : undefined,
             isHotPath: hotNodes.has(destId),
             isAddonNode: destIsAddon,
-            serviceCategory: flow.destination.kind.toLowerCase() === 'external' ? serviceCategories?.get(flow.destination.name) : undefined,
+            serviceCategory: isExternalKind(flow.destination.kind) ? serviceCategories?.get(flow.destination.name) : undefined,
             ports: destPorts,
             nodeHeight: getNodeHeight(destPorts),
             connLabel,

package/src/components/traffic/TrafficView.tsx

@@ -13,7 +13,7 @@ import { useDock } from '../dock'
 import { AlertBanner, EmptyState, PaneLoader, FreshnessControl } from '@skyhook-io/k8s-ui'
 import { useConnection } from '../../context/ConnectionContext'
 import { Tooltip } from '../ui/Tooltip'
-import { matchesStatusRanges, bucketsFromCounts, bucketsFromStatus, isRateBasedSource, keepAvailable, effectiveThreshold, volumeUnit, type VolumeUnit } from './trafficFilters'
+import { matchesStatusRanges, bucketsFromCounts, bucketsFromStatus, isRateBasedSource, keepAvailable, effectiveThreshold, volumeUnit, type VolumeUnit, isExternalKind } from './trafficFilters'
 
 // Addon types for filtering
 export type AddonMode = 'show' | 'group' | 'hide'
@@ -271,8 +271,12 @@ function isSystemEndpoint(name: string, namespace: string | undefined, kind: str
     return true
   }
 
-  // Cilium reserved identities (show up as External kind with reserved names)
-  if (kind === 'External' && CILIUM_RESERVED_IDENTITIES.has(name)) {
+  // Cilium reserved identities: nodes and the host network arrive as Host;
+  // health, init and unmanaged endpoints carry no usable identity.
+  if (kind === 'Host') {
+    return true
+  }
+  if ((kind === 'External' || kind === 'Unknown') && CILIUM_RESERVED_IDENTITIES.has(name)) {
     return true
   }
 
@@ -330,10 +334,7 @@ function isSystemEndpoint(name: string, namespace: string | undefined, kind: str
   return false
 }
 
-// Helper to check if endpoint is external (case-insensitive)
-function isExternal(kind: string): boolean {
-  return kind.toLowerCase() === 'external'
-}
+const isExternal = isExternalKind
 
 interface TrafficViewProps {
   namespaces: string[]
@@ -988,14 +989,14 @@ export function TrafficView({ namespaces }: TrafficViewProps) {
 
     flows.forEach(flow => {
       // Count source nodes
-      if (flow.source.namespace && flow.source.kind.toLowerCase() !== 'external') {
+      if (flow.source.namespace && !isExternalKind(flow.source.kind)) {
         if (!nsCounts.has(flow.source.namespace)) {
           nsCounts.set(flow.source.namespace, new Set())
         }
         nsCounts.get(flow.source.namespace)!.add(flow.source.name)
       }
       // Count destination nodes
-      if (flow.destination.namespace && flow.destination.kind.toLowerCase() !== 'external') {
+      if (flow.destination.namespace && !isExternalKind(flow.destination.kind)) {
         if (!nsCounts.has(flow.destination.namespace)) {
           nsCounts.set(flow.destination.namespace, new Set())
         }

package/src/components/traffic/trafficFilters.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect } from 'vitest'
-import { matchesStatusRanges, bucketsFromCounts, bucketsFromStatus, isRateBasedSource, keepAvailable, effectiveThreshold, volumeUnit } from './trafficFilters'
+import { matchesStatusRanges, bucketsFromCounts, bucketsFromStatus, isRateBasedSource, keepAvailable, effectiveThreshold, volumeUnit, isExternalKind, isPolicyDropReason } from './trafficFilters'
 
 describe('matchesStatusRanges', () => {
   it('does not filter when nothing is selected', () => {
@@ -101,3 +101,30 @@ describe('volumeUnit', () => {
     expect(volumeUnit(undefined)).toBe('connections')
   })
 })
+
+describe('isExternalKind', () => {
+  it('places the world, nodes and unidentified endpoints outside the workloads', () => {
+    expect(isExternalKind('External')).toBe(true)
+    expect(isExternalKind('Host')).toBe(true)
+    expect(isExternalKind('Unknown')).toBe(true)
+  })
+  it('keeps pods and services inside', () => {
+    expect(isExternalKind('Pod')).toBe(false)
+    expect(isExternalKind('Service')).toBe(false)
+  })
+})
+
+describe('isPolicyDropReason', () => {
+  it('recognises both of Hubble\'s policy drop codes', () => {
+    expect(isPolicyDropReason('POLICY_DENIED', 0)).toBe(true)
+    expect(isPolicyDropReason('POLICY_DENY', 0)).toBe(true)
+  })
+  it('takes the plugin naming a policy as evidence even without a code', () => {
+    expect(isPolicyDropReason(undefined, 1)).toBe(true)
+  })
+  it('does not assume policy for other or missing reasons', () => {
+    expect(isPolicyDropReason('STALE_OR_UNROUTABLE_IP', 0)).toBe(false)
+    expect(isPolicyDropReason(undefined, 0)).toBe(false)
+    expect(isPolicyDropReason('', 0)).toBe(false)
+  })
+})

package/src/components/traffic/trafficFilters.ts

@@ -115,3 +115,34 @@ export function volumeUnit(isRateBased: boolean | undefined): VolumeUnit {
 export function effectiveThreshold(value: number, chosenUnit: VolumeUnit, currentUnit: VolumeUnit): number {
   return chosenUnit === currentUnit ? value : 0
 }
+
+/**
+ * Is this endpoint kind drawn outside the cluster's workloads?
+ *
+ * "External" is what every source reports for the world outside; Hubble also
+ * tells nodes (`Host`) and endpoints it could not identify (`Unknown`) apart,
+ * because a policy evaluation treats each differently. The graph does not:
+ * none of them is a workload, so they take the external node's place and
+ * styling, and stay out of namespace counts.
+ */
+export function isExternalKind(kind: string): boolean {
+  const k = kind.toLowerCase()
+  return k === 'external' || k === 'host' || k === 'unknown'
+}
+
+/**
+ * Is a drop a NetworkPolicy question at all?
+ *
+ * Only on positive evidence: Hubble's two policy drop reasons — `POLICY_DENIED`
+ * (no rule allowed it) and `POLICY_DENY` (an explicit deny rule) — or the
+ * plugin naming the policy itself. A drop with no reported reason is not
+ * assumed to be one. The two codes are spelled differently enough that a
+ * substring test on either misses the other.
+ */
+export function isPolicyDropReason(dropReasonDesc: string | undefined, deniedByCount: number): boolean {
+  // deniedByCount includes references withheld for permissions: the plugin
+  // still named a policy.
+  if (deniedByCount > 0) return true
+  const code = (dropReasonDesc ?? '').toUpperCase()
+  return code === 'POLICY_DENIED' || code === 'POLICY_DENY'
+}

package/src/components/workload/WorkloadView.tsx

@@ -70,6 +70,8 @@ import {
   useCordonNode,
   useUncordonNode,
   useDrainNode,
+  useDrainPlan,
+  DrainPlanUnsupportedError,
   useCascadeDeletePreview,
   useResourceEvents,
   useResource,
@@ -81,7 +83,7 @@ import {
 import { PrometheusCharts, isPrometheusSupported } from '../resource/PrometheusCharts'
 import { PrometheusChartsGrid } from '../resource/PrometheusChartsGrid'
 import { RestartEventLane } from '../resource/RestartChart'
-import { RightsizingPanel, RightsizingStrip } from '../resource/RightsizingStrip'
+import { RightsizingPanel } from '../resource/RightsizingStrip'
 import { WorkloadCostTab } from '../cost/WorkloadCostTab'
 import { isOpenCostWorkloadKind } from '../cost/kinds'
 import { useResourceAudit, useResourceIssues, useResources, useTrace, fetchTraceWithProbes, fetchInClusterCapability, runInClusterMerged } from '../../api/client'
@@ -381,6 +383,7 @@ function useActionsBarProps(
   const cordonMutation = useCordonNode()
   const uncordonMutation = useUncordonNode()
   const drainMutation = useDrainNode()
+  const drainPlanMutation = useDrainPlan()
 
   const { renderAction: renderDiagnose } = useDiagnoseCustomization()
 
@@ -485,6 +488,13 @@ function useActionsBarProps(
     onDrainNode: (params: Parameters<typeof drainMutation.mutate>[0]) =>
       drainMutation.mutate(params),
     isDrainingNode: drainMutation.isPending,
+    onPlanDrain: (params: Parameters<typeof drainPlanMutation.mutate>[0]) =>
+      drainPlanMutation.mutate(params),
+    onPlanDrainReset: () => drainPlanMutation.reset(),
+    drainPlan: drainPlanMutation.data ?? null,
+    isPlanningDrain: drainPlanMutation.isPending,
+    drainPlanError: drainPlanMutation.error?.message ?? null,
+    drainPlanUnsupported: drainPlanMutation.error instanceof DrainPlanUnsupportedError,
   }
 }
 
@@ -2411,16 +2421,9 @@ function MetricsTabContent({
   resource: any
   expanded: boolean
 }) {
-  const showRightsizing = expanded && ['Deployment', 'StatefulSet', 'DaemonSet'].includes(kind)
-
   if (expanded) {
     return (
       <div className="flex flex-col h-full">
-        {showRightsizing && (
-          <div className="px-4 pt-4">
-            <RightsizingStrip kind={kind} namespace={namespace} name={name} />
-          </div>
-        )}
         <div className="flex-1 min-h-0">
           <PrometheusChartsGrid kind={kind} namespace={namespace} name={name} resource={resource} />
         </div>
@@ -2446,9 +2449,17 @@ function DrawerMetricsContent({
 }) {
   const [chartRange, setChartRange] = useState<import('../../api/client').PrometheusTimeRange>('1h')
   const showRestartLane = isPrometheusSupported(kind) && kind !== 'Node'
+  const navigate = useNavigate()
 
   return (
     <div className="flex flex-col h-full">
+      {['Deployment', 'StatefulSet', 'DaemonSet'].includes(kind) && (
+        <div className="px-4 pt-3">
+          <button className="text-xs text-accent hover:underline" onClick={() => navigate(`${buildWorkloadPath({ kind, namespace, name })}?tab=metrics&metricsRange=${chartRange}`)}>
+            Open request and resource dashboard →
+          </button>
+        </div>
+      )}
       <div className="flex-1 min-h-0">
         <PrometheusCharts
           kind={kind}

package/src/context/ConnectionContext.tsx

@@ -1,7 +1,7 @@
 import { createContext, useContext, useState, useCallback, useEffect, useRef, ReactNode } from 'react'
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
 import { getApiBase } from '../api/config'
-import { apiFetch } from '../api/client'
+import { apiFetch, type SyncStatusSnapshot } from '../api/client'
 
 export type ConnectionStateType = 'connected' | 'disconnected' | 'connecting'
 
@@ -12,6 +12,10 @@ export interface ConnectionState {
   error?: string
   errorType?: string // config, auth, auth-rejected, auth-plugin-stuck, rbac, network, timeout, tls, unknown
   progressMessage?: string
+  // Per-kind readiness while the initial informer sync runs ('connecting'
+  // with informers started). Drives the progressive app shell — absent once
+  // connected or before informers exist.
+  syncStatus?: SyncStatusSnapshot
 }
 
 interface ConnectionStatusResponse extends ConnectionState {
@@ -157,7 +161,15 @@ export function ConnectionProvider({ children }: { children: ReactNode }) {
     if (!firstConnect || cacheWarmAtMountRef.current) {
       queryClient.invalidateQueries()
     } else {
-      queryClient.invalidateQueries({ predicate: (q) => q.state.status === 'error' })
+      // Detail responses served during the progressive shell are partial —
+      // the server skips relationship computation while the topology cache
+      // is unavailable — and they resolve as successes, so the error-only
+      // sweep would leave an open drawer without its Related Resources
+      // forever (focus refetch is globally off). Refetching the resource
+      // detail keys is at most the open drawer, so it stays cheap.
+      queryClient.invalidateQueries({
+        predicate: (q) => q.state.status === 'error' || q.queryKey[0] === 'resource',
+      })
     }
   }, [queryClient])
 
@@ -195,12 +207,35 @@ export function ConnectionProvider({ children }: { children: ReactNode }) {
     // while the retry is still running; the retry's own result supersedes it.
     if (manualRetryPendingRef.current || autoRetryInFlightRef.current) return
     const current = connectionRef.current
+    // The progressive shell renders real resource lists while still
+    // 'connecting'. A query client shared across cluster mounts may hold
+    // another cluster's data under identical keys — drop it before the
+    // shell can show it (the 'connected' path repeats this for the
+    // full-refresh case). Deliberately ahead of the SSE-generation guard:
+    // live connection_state frames bump the generation and drop the poll,
+    // and the shell must not spend the whole sync on another cluster's rows.
+    if (current.state === 'connecting' && data.state === 'connecting' &&
+        data.syncStatus && cacheWarmAtMountRef.current) {
+      cacheWarmAtMountRef.current = false
+      // Drop only cluster-scoped data. App chrome (auth identity, kubeconfig
+      // contexts) is not another cluster's data, and purging it flips
+      // authMePending back on — which holds the whole shell on the splash
+      // until /auth/me refetches, delaying the first progressive paint.
+      const keep = new Set(['connection-status', 'auth-me', 'contexts'])
+      queryClient.removeQueries({ predicate: (q) => !keep.has(String(q.queryKey[0])) })
+    }
     if (!shouldApplyPolledConnection(
       current.state,
       data.state,
       data.sseGenerationAtStart,
       sseGenerationRef.current,
     )) {
+      // SSE owns the state fields, but connection_state frames don't carry
+      // per-kind sync progress — merge it from the poll so the progressive
+      // shell keeps ticking while still connecting.
+      if (data.state === 'connecting' && data.syncStatus) {
+        setConnection(prev => prev.state === 'connecting' ? { ...prev, syncStatus: data.syncStatus } : prev)
+      }
       return
     }
     const becameConnected = current.state !== 'connected' && data.state === 'connected'
@@ -211,11 +246,12 @@ export function ConnectionProvider({ children }: { children: ReactNode }) {
       error: data.error,
       errorType: data.errorType,
       progressMessage: data.progressMessage,
+      syncStatus: data.syncStatus,
     })
     if (becameConnected) {
       refreshCachesOnConnect()
     }
-  }, [data, dataUpdatedAt, refreshCachesOnConnect])
+  }, [data, dataUpdatedAt, refreshCachesOnConnect, queryClient])
 
   // Retry mutation
   const retryMutation = useMutation({
@@ -231,6 +267,9 @@ export function ConnectionProvider({ children }: { children: ReactNode }) {
         state: 'connecting',
         error: undefined,
         progressMessage: 'Connecting to cluster...',
+        // A retry is a fresh attempt — per-kind progress from the previous
+        // attempt would mislabel readiness until the next poll.
+        syncStatus: undefined,
       }))
     },
     onSuccess: (result) => {
@@ -371,6 +410,12 @@ export function ConnectionProvider({ children }: { children: ReactNode }) {
       if (prev.state === 'connected' && status.state === 'connecting') {
         return prev
       }
+      // connection_state frames don't carry per-kind sync progress — keep the
+      // last polled snapshot while still connecting, or each SSE progress
+      // frame would flicker the progressive shell back to the splash.
+      if (status.state === 'connecting' && !status.syncStatus && prev.state === 'connecting') {
+        return { ...status, syncStatus: prev.syncStatus }
+      }
       return status
     })
 

package/src/context/DiagnoseCustomization.test.tsx

@@ -0,0 +1,26 @@
+import { describe, expect, it, vi } from 'vitest';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { DiagnoseCustomizationProvider, useDiagnoseCustomization } from './DiagnoseCustomization';
+import type { RunSummary } from '../api/diagnose';
+
+const run = { id: 'r1' } as RunSummary;
+const onRunUpdated = vi.fn();
+function Actions() {
+  const { renderRunActions } = useDiagnoseCustomization();
+  return <>{renderRunActions?.({ run, onRunUpdated })}</>;
+}
+
+describe('investigation action slot', () => {
+  it('has no default host actions in OSS', () => {
+    expect(renderToStaticMarkup(<Actions />)).toBe('');
+  });
+  it('passes the run and update callback to the host', () => {
+    const renderRunActions = vi.fn(() => <button>Host action</button>);
+    expect(renderToStaticMarkup(
+      <DiagnoseCustomizationProvider value={undefined} renderRunActions={renderRunActions}>
+        <Actions />
+      </DiagnoseCustomizationProvider>,
+    )).toContain('Host action');
+    expect(renderRunActions).toHaveBeenCalledWith({ run, onRunUpdated });
+  });
+});

package/src/context/DiagnoseCustomization.tsx

@@ -11,9 +11,19 @@
 // agent-free.
 import { createContext, useContext, useMemo } from "react";
 import type { ReactNode } from "react";
+import type { RunSummary } from "../api/diagnose";
+
+/** Optional host controls beside shared run actions. Return a component element
+ * if hooks are needed: this callback is invoked conditionally. Call onRunUpdated
+ * after a mutation to refresh the shared run summary. */
+export type RenderInvestigationRunActions = (props: {
+  run: RunSummary;
+  onRunUpdated: (run: RunSummary) => void;
+}) => ReactNode;
 
 /** Render prop for the resource-level Investigate action. */
 export type RenderDiagnoseAction = (ctx: {
+  /** Kubernetes Kind when loaded or discovered; otherwise its API resource name. */
   kind: string;
   /** Kubernetes API group; empty means core. */
   group?: string;
@@ -52,6 +62,7 @@ export type DiagnoseConsentCopy = {
 // set once at mount, so per-value re-render isolation buys nothing.
 export interface DiagnoseCustomization {
   renderAction: RenderDiagnoseAction | undefined;
+  renderRunActions?: RenderInvestigationRunActions;
   consentCopy: DiagnoseConsentCopy | undefined;
   // undefined = default (CustomEvent → Radar's own Settings dialog);
   // null = hide the settings affordances.
@@ -70,19 +81,21 @@ const DiagnoseCustomizationContext =
 export function DiagnoseCustomizationProvider({
   value,
   consentCopy,
+  renderRunActions,
   onOpenSettings,
   children,
 }: {
   value: RenderDiagnoseAction | undefined;
   consentCopy?: DiagnoseConsentCopy;
+  renderRunActions?: RenderInvestigationRunActions;
   /** Where "AI settings" affordances lead. Omit for Radar's own Settings
    *  dialog; pass `null` to hide them. */
   onOpenSettings?: (() => void) | null;
   children: ReactNode;
 }) {
   const ctx = useMemo(
-    () => ({ renderAction: value, consentCopy, onOpenSettings }),
-    [value, consentCopy, onOpenSettings],
+    () => ({ renderAction: value, consentCopy, onOpenSettings, renderRunActions }),
+    [value, consentCopy, onOpenSettings, renderRunActions],
   );
   return (
     <DiagnoseCustomizationContext.Provider value={ctx}>

package/src/index.css

@@ -21,6 +21,23 @@
 }
 
 @layer components {
+  .metrics-layout {
+    container-type: inline-size;
+    container-name: metrics;
+  }
+  .metrics-chart-grid {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr);
+    gap: 0.75rem;
+  }
+  @container metrics (min-width: 760px) {
+    .metrics-chart-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+    .metrics-chart-wide { grid-column: 1 / -1; }
+  }
+  @container metrics (min-width: 1200px) {
+    .metrics-chart-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+    .metrics-chart-wide { grid-column: auto; }
+  }
   .investigation-assessment {
     background: var(--color-investigation-assessment);
     border-color: var(--color-investigation-assessment-border);

package/src/index.ts

@@ -28,6 +28,7 @@ export type {
 } from './api/timelineSource';
 export type {
   RenderDiagnoseAction,
+  RenderInvestigationRunActions,
   DiagnoseConsentCopy,
 } from './context/DiagnoseCustomization';
 

package/src/utils/navigation.ts

@@ -14,7 +14,7 @@ export function searchHitToSelectedResource(hit: SearchHit): SelectedResource {
 }
 
 // Re-export shared navigation utilities from @skyhook-io/k8s-ui.
-export { kindToPlural, kindToPluralWithGroup, pluralToKind, refToSelectedResource, apiVersionToGroup } from '@skyhook-io/k8s-ui/utils/navigation'
+export { kindToPlural, kindToPluralWithGroup, pluralToKind, knownKindForPluralWithGroup, refToSelectedResource, apiVersionToGroup } from '@skyhook-io/k8s-ui/utils/navigation'
 export type { NavigateToResource } from '@skyhook-io/k8s-ui/utils/navigation'
 
 const NETWORK_POLICY_TOPOLOGY_KINDS = new Set([

package/src/utils/shell-safe.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, it } from 'vitest'
 
-import { allShellSafe, isShellSafeValue } from './shell-safe'
+import { allShellSafe, isShellSafeAWSProfile, isShellSafeValue } from './shell-safe'
 
 describe('isShellSafeValue', () => {
   it('accepts the values real provider context names produce', () => {
@@ -53,3 +53,27 @@ describe('allShellSafe', () => {
     expect(allShellSafe('prod', null)).toBe(false)
   })
 })
+
+describe('isShellSafeAWSProfile', () => {
+  it('accepts simple and slash-separated profile names', () => {
+    expect(isShellSafeAWSProfile('default')).toBe(true)
+    expect(isShellSafeAWSProfile('myorg/my-account/my-role')).toBe(true)
+    expect(isShellSafeAWSProfile('prod-account')).toBe(true)
+  })
+
+  it('rejects shell metacharacters', () => {
+    expect(isShellSafeAWSProfile('prod; id')).toBe(false)
+    expect(isShellSafeAWSProfile('prod$(id)')).toBe(false)
+    expect(isShellSafeAWSProfile('prod profile')).toBe(false)
+  })
+
+  it('rejects leading dash', () => {
+    expect(isShellSafeAWSProfile('-rf')).toBe(false)
+  })
+
+  it('rejects empty and absent values', () => {
+    expect(isShellSafeAWSProfile('')).toBe(false)
+    expect(isShellSafeAWSProfile(null)).toBe(false)
+    expect(isShellSafeAWSProfile(undefined)).toBe(false)
+  })
+})

package/src/utils/shell-safe.ts

@@ -19,3 +19,19 @@ export function isShellSafeValue(value: string | null | undefined): value is str
 export function allShellSafe(...values: (string | null | undefined)[]): boolean {
   return values.every(isShellSafeValue)
 }
+
+// AWS SSO profile names may contain `/` as a path separator
+// (e.g. "myorg/my-account/my-role") — safe in shell arguments since `/`
+// has no special meaning to the shell itself.
+const SHELL_SAFE_AWS_PROFILE = /^[A-Za-z0-9][A-Za-z0-9._:@/-]*$/
+
+export function isShellSafeAWSProfile(value: string | null | undefined): value is string {
+  return typeof value === 'string' && SHELL_SAFE_AWS_PROFILE.test(value)
+}
+
+// Returns ` --profile <name>` for embedding in an aws CLI hint, or '' when no
+// profile is pinned or the name fails the allowlist — the hint then falls
+// back to the ambient profile rather than offering nothing.
+export function awsProfileFlag(profile: string | null | undefined): string {
+  return isShellSafeAWSProfile(profile) ? ` --profile ${profile}` : ''
+}

package/src/utils/topology-namespace.test.ts

@@ -0,0 +1,64 @@
+import { describe, expect, it } from 'vitest'
+import type { TopologyNode } from '@skyhook-io/k8s-ui/types/core'
+import { isInNamespaceScope, scopeNodesToNamespaces } from './topology-namespace'
+
+function node(id: string, kind: string, namespace?: string): TopologyNode {
+  return {
+    id,
+    kind,
+    name: id,
+    status: 'healthy',
+    data: namespace === undefined ? {} : { namespace },
+  } as TopologyNode
+}
+
+const nodes = [
+  node('web', 'Deployment', 'prod'),
+  node('ing', 'Ingress', 'staging'),
+  node('db', 'StatefulSet', 'prod'),
+  node('node-1', 'Node'),          // cluster-scoped
+  node('pv-1', 'PersistentVolume'), // cluster-scoped
+]
+
+describe('scopeNodesToNamespaces', () => {
+  it('returns every node when no namespace is selected', () => {
+    expect(scopeNodesToNamespaces(nodes, [])).toHaveLength(5)
+  })
+
+  it('keeps only the selected namespace, plus cluster-scoped nodes', () => {
+    const scoped = scopeNodesToNamespaces(nodes, ['prod'])
+    expect(scoped.map(n => n.id)).toEqual(['web', 'db', 'node-1', 'pv-1'])
+  })
+
+  it('drops a kind that exists only outside the scope', () => {
+    const scoped = scopeNodesToNamespaces(nodes, ['prod'])
+    expect(scoped.some(n => n.kind === 'Ingress')).toBe(false)
+  })
+
+  it('accepts several namespaces at once', () => {
+    const scoped = scopeNodesToNamespaces(nodes, ['prod', 'staging'])
+    expect(scoped).toHaveLength(5)
+  })
+
+  it('returns the same array identity when the scope is empty', () => {
+    expect(scopeNodesToNamespaces(nodes, [])).toBe(nodes)
+  })
+})
+
+describe('isInNamespaceScope', () => {
+  it('passes everything for a null scope', () => {
+    expect(isInNamespaceScope(node('x', 'Pod', 'any'), null)).toBe(true)
+  })
+
+  it('always passes a node with no namespace', () => {
+    expect(isInNamespaceScope(node('node-1', 'Node'), new Set(['prod']))).toBe(true)
+  })
+
+  it('treats an empty-string namespace as cluster-scoped', () => {
+    expect(isInNamespaceScope(node('n', 'Node', ''), new Set(['prod']))).toBe(true)
+  })
+
+  it('rejects a namespaced node outside the scope', () => {
+    expect(isInNamespaceScope(node('ing', 'Ingress', 'staging'), new Set(['prod']))).toBe(false)
+  })
+})

package/src/utils/topology-namespace.ts

@@ -0,0 +1,18 @@
+import type { TopologyNode } from '@skyhook-io/k8s-ui/types/core'
+
+// A node with no namespace is cluster-scoped (Node, PersistentVolume,
+// Namespace, ...) and stays visible in every scope.
+export function isInNamespaceScope(node: TopologyNode, nsSet: Set<string> | null): boolean {
+  if (!nsSet) return true
+  const ns = node.data?.namespace as string | undefined
+  return !ns || nsSet.has(ns)
+}
+
+// Shared by the topology graph and the filter sidebar so the two cannot
+// disagree about which nodes are in scope. Namespace carve-out only — kind
+// filtering stays on the graph.
+export function scopeNodesToNamespaces(nodes: TopologyNode[], namespaces: string[]): TopologyNode[] {
+  if (namespaces.length === 0) return nodes
+  const nsSet = new Set(namespaces)
+  return nodes.filter(node => isInNamespaceScope(node, nsSet))
+}