@skyhook-io/radar-app 1.8.2 → 1.8.3

package/src/components/helm/ManifestDiffViewer.tsx

@@ -8,19 +8,21 @@ interface ManifestDiffViewerProps {
   revision1: number
   revision2: number
   onClose: () => void
+  title?: string
+  emptyLabel?: string
 }
 
-export function ManifestDiffViewer({ diff, isLoading, revision1, revision2, onClose }: ManifestDiffViewerProps) {
+export function ManifestDiffViewer({ diff, isLoading, revision1, revision2, onClose, title, emptyLabel }: ManifestDiffViewerProps) {
   if (isLoading) {
     return <PaneLoader label="Computing diff…" className="h-32" />
   }
 
-  if (!diff) {
+  if (!hasDiffBodyChange(diff)) {
     return (
       <div className="p-4">
         <div className="flex flex-col items-center justify-center h-32 text-theme-text-tertiary gap-2">
           <GitCompare className="w-8 h-8 text-theme-text-disabled" />
-          <span>No differences found</span>
+          <span>{emptyLabel || 'No differences found'}</span>
         </div>
       </div>
     )
@@ -32,7 +34,7 @@ export function ManifestDiffViewer({ diff, isLoading, revision1, revision2, onCl
         <div className="flex items-center gap-2">
           <GitCompare className="w-4 h-4 text-theme-text-secondary" />
           <span className="text-sm font-medium text-theme-text-secondary">
-            Comparing Revision {revision1} → {revision2}
+            {title || `Comparing Revision ${revision1} → ${revision2}`}
           </span>
         </div>
         <button
@@ -67,6 +69,15 @@ export function ManifestDiffViewer({ diff, isLoading, revision1, revision2, onCl
   )
 }
 
+function hasDiffBodyChange(diff: string): boolean {
+  return diff.split('\n').some((line) => {
+    if (!line || line.startsWith('---') || line.startsWith('+++') || line.startsWith('@@')) {
+      return false
+    }
+    return line.startsWith('+') || line.startsWith('-')
+  })
+}
+
 function DiffLine({ line }: { line: string }) {
   const isAddition = line.startsWith('+') && !line.startsWith('+++')
   const isRemoval = line.startsWith('-') && !line.startsWith('---')

package/src/components/helm/OwnedResources.tsx

@@ -1,5 +1,5 @@
 import { useState, useCallback } from 'react'
-import { Link2, ExternalLink, AlertCircle, Terminal, FileText, Plug, X, Loader2 } from 'lucide-react'
+import { Link2, ExternalLink, AlertCircle, Terminal, FileText, X, Loader2 } from 'lucide-react'
 import { getResourceIcon } from '../../utils/resource-icons'
 import { clsx } from 'clsx'
 import type { HelmOwnedResource } from '../../types'
@@ -8,10 +8,10 @@ import { kindToPlural, apiVersionToGroup } from '../../utils/navigation'
 import { getResourceStatusColor, SEVERITY_BADGE } from '../../utils/badge-colors'
 import { useQueryClient } from '@tanstack/react-query'
 import { useOpenTerminal, useOpenLogs } from '../dock'
-import { useStartPortForward } from '../portforward/PortForwardManager'
+import { PortForwardInlineButton } from '../portforward/PortForwardButton'
 import { useAvailablePorts } from '../../api/client'
 import { apiUrl, getAuthHeaders, getCredentialsMode } from '../../api/config'
-import { useNamespacedCapabilities } from '../../contexts/CapabilitiesContext'
+import { useNamespacedCapabilities, useIsLocalDeployment } from '../../contexts/CapabilitiesContext'
 import { pluralize } from '@skyhook-io/k8s-ui'
 import { Tooltip } from '../ui/Tooltip'
 
@@ -312,11 +312,14 @@ function PodQuickActions({ namespace, podName, isRunning }: PodQuickActionsProps
   const queryClient = useQueryClient()
   const openTerminal = useOpenTerminal()
   const openLogs = useOpenLogs()
-  const startPortForward = useStartPortForward()
   const { data: portsData, isLoading: portsLoading } = useAvailablePorts('pod', namespace, podName)
 
   // Capabilities (namespace-scoped: re-checks RBAC if globally denied)
   const { canExec, canViewLogs, canPortForward } = useNamespacedCapabilities(namespace)
+  // Live forward (local + RBAC) or the kubectl copy-command (in-cluster/Cloud);
+  // PortForwardInlineButton picks which by deployment mode.
+  const isLocal = useIsLocalDeployment()
+  const showPortForward = canPortForward || !isLocal
 
   const [isLoadingAction, setIsLoadingAction] = useState(false)
 
@@ -374,14 +377,6 @@ function PodQuickActions({ namespace, podName, isRunning }: PodQuickActionsProps
     }
   }, [namespace, podName, openLogs, fetchPodData])
 
-  const handlePortForward = useCallback((port: number) => {
-    startPortForward.mutate({
-      namespace,
-      podName,
-      podPort: port,
-    })
-  }, [namespace, podName, startPortForward])
-
   const ports = portsData?.ports || []
 
   return (
@@ -414,21 +409,9 @@ function PodQuickActions({ namespace, podName, isRunning }: PodQuickActionsProps
         </Tooltip>
       )}
 
-      {/* Port Forward */}
-      {canPortForward && !portsLoading && ports.length > 0 && (
-        <Tooltip content={`Port forward :${ports[0].port}`}>
-        <button
-          onClick={(e) => { e.stopPropagation(); handlePortForward(ports[0].port) }}
-          disabled={startPortForward.isPending}
-          className="p-1 text-theme-text-tertiary hover:text-blue-400 hover:bg-blue-500/10 rounded transition-colors disabled:opacity-50 disabled:pointer-events-none"
-        >
-          {startPortForward.isPending ? (
-            <Loader2 className="w-3.5 h-3.5 animate-spin" />
-          ) : (
-            <Plug className="w-3.5 h-3.5" />
-          )}
-        </button>
-        </Tooltip>
+      {/* Port Forward (live locally; kubectl copy-command in-cluster/Cloud) */}
+      {showPortForward && !portsLoading && ports.length > 0 && (
+        <PortForwardInlineButton namespace={namespace} podName={podName} port={ports[0].port} />
       )}
     </div>
   )
@@ -441,37 +424,18 @@ interface ServiceQuickActionsProps {
 }
 
 function ServiceQuickActions({ namespace, serviceName }: ServiceQuickActionsProps) {
-  const startPortForward = useStartPortForward()
   const { data: portsData, isLoading: portsLoading } = useAvailablePorts('service', namespace, serviceName)
   const { canPortForward } = useNamespacedCapabilities(namespace)
-
-  const handlePortForward = useCallback((port: number) => {
-    startPortForward.mutate({
-      namespace,
-      serviceName,
-      podPort: port,
-    })
-  }, [namespace, serviceName, startPortForward])
+  const isLocal = useIsLocalDeployment()
+  const showPortForward = canPortForward || !isLocal
 
   const ports = portsData?.ports || []
 
-  if (!canPortForward || portsLoading || ports.length === 0) return null
+  if (!showPortForward || portsLoading || ports.length === 0) return null
 
   return (
     <div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
-      <Tooltip content={`Port forward :${ports[0].port}`}>
-      <button
-        onClick={(e) => { e.stopPropagation(); handlePortForward(ports[0].port) }}
-        disabled={startPortForward.isPending}
-        className="p-1 text-theme-text-tertiary hover:text-blue-400 hover:bg-blue-500/10 rounded transition-colors disabled:opacity-50 disabled:pointer-events-none"
-      >
-        {startPortForward.isPending ? (
-          <Loader2 className="w-3.5 h-3.5 animate-spin" />
-        ) : (
-          <Plug className="w-3.5 h-3.5" />
-        )}
-      </button>
-      </Tooltip>
+      <PortForwardInlineButton namespace={namespace} serviceName={serviceName} port={ports[0].port} />
     </div>
   )
 }

package/src/components/helm/RevisionHistory.tsx

@@ -64,7 +64,7 @@ export function RevisionHistory({ history, currentRevision, operations = [], onV
         {history.map((revision, index) => {
           const isCurrent = revision.revision === currentRevision
           const isSelectedForCompare = selectedForCompare === revision.revision
-          const annotations = operationAnnotationsForRevision(operations, revision.revision)
+          const annotations = operationAnnotationsForRevision(operations, revision.revision, revision.status)
 
           return (
             <div
@@ -174,7 +174,7 @@ export function RevisionHistory({ history, currentRevision, operations = [], onV
   )
 }
 
-function operationAnnotationsForRevision(operations: HelmOperation[], revision: number): Array<{ label: string; className: string }> {
+function operationAnnotationsForRevision(operations: HelmOperation[], revision: number, revisionStatus: string): Array<{ label: string; className: string }> {
   const annotations: Array<{ label: string; className: string }> = []
   const seen = new Set<string>()
   const add = (label: string, className: string) => {
@@ -182,10 +182,14 @@ function operationAnnotationsForRevision(operations: HelmOperation[], revision:
     seen.add(label)
     annotations.push({ label, className })
   }
+  const addFailure = (label: string) => {
+    if (revisionStatus.toLowerCase() === 'failed') return
+    add(label, SEVERITY_BADGE.error)
+  }
 
   for (const op of operations) {
     if (op.failedRevision === revision) {
-      add('Failed upgrade', SEVERITY_BADGE.error)
+      addFailure('Failed upgrade')
     }
     if (op.rollbackRevision === revision) {
       add('Rollback revision', SEVERITY_BADGE.warning)
@@ -193,10 +197,10 @@ function operationAnnotationsForRevision(operations: HelmOperation[], revision:
     if (op.revision === revision) {
       switch (op.kind) {
         case 'upgrade_failed':
-          add('Failed upgrade', SEVERITY_BADGE.error)
+          addFailure('Failed upgrade')
           break
         case 'release_failed':
-          add('Failed', SEVERITY_BADGE.error)
+          addFailure('Failed')
           break
         case 'rollback':
           add('Rollback', SEVERITY_BADGE.warning)

package/src/components/helm/ValuesViewer.tsx

@@ -1,4 +1,4 @@
-import { useState, useCallback } from 'react'
+import { useState, useCallback, useEffect } from 'react'
 import { Copy, Check, Settings, Pencil, X, Eye, Play, Loader2 } from 'lucide-react'
 import { PaneLoader } from '@skyhook-io/k8s-ui'
 import { clsx } from 'clsx'
@@ -21,6 +21,8 @@ interface ValuesViewerProps {
   // Required for editing
   namespace?: string
   name?: string
+  revision?: number
+  currentRevision?: number
   onApplySuccess?: () => void
 }
 
@@ -33,6 +35,8 @@ export function ValuesViewer({
   copied,
   namespace,
   name,
+  revision,
+  currentRevision,
   onApplySuccess,
 }: ValuesViewerProps) {
   const [isEditing, setIsEditing] = useState(false)
@@ -44,8 +48,9 @@ export function ValuesViewer({
   const previewMutation = useHelmPreviewValues()
   const applyMutation = useHelmApplyValues()
   const { allowed: canHelmWrite, reason: helmActReason } = useCanHelmAct()
+  const isHistoricalRevision = typeof revision === 'number' && typeof currentRevision === 'number' && revision !== currentRevision
 
-  const canEdit = Boolean(namespace && name) && canHelmWrite
+  const canEdit = Boolean(namespace && name) && canHelmWrite && !isHistoricalRevision
 
   const displayValues = showAllValues && values?.computed ? values.computed : values?.userSupplied
   const isEmpty = !displayValues || Object.keys(displayValues).length === 0
@@ -72,6 +77,12 @@ export function ValuesViewer({
     setShowPreview(false)
   }, [])
 
+  useEffect(() => {
+    if (isHistoricalRevision && isEditing) {
+      handleCancelEdit()
+    }
+  }, [isHistoricalRevision, isEditing, handleCancelEdit])
+
   // Parse YAML and validate
   const parseYaml = useCallback((yamlStr: string): Record<string, unknown> | null => {
     try {
@@ -86,7 +97,7 @@ export function ValuesViewer({
 
   // Preview changes
   const handlePreview = useCallback(async () => {
-    if (!namespace || !name) return
+    if (!namespace || !name || isHistoricalRevision) return
     const parsed = parseYaml(editedYaml)
     if (!parsed) return
 
@@ -101,11 +112,11 @@ export function ValuesViewer({
     } catch {
       // Error is handled by mutation
     }
-  }, [namespace, name, editedYaml, parseYaml, previewMutation])
+  }, [namespace, name, isHistoricalRevision, editedYaml, parseYaml, previewMutation])
 
   // Apply changes
   const handleApply = useCallback(async () => {
-    if (!namespace || !name) return
+    if (!namespace || !name || isHistoricalRevision) return
     const parsed = parseYaml(editedYaml)
     if (!parsed) return
 
@@ -120,11 +131,11 @@ export function ValuesViewer({
     } catch {
       // Error is handled by mutation
     }
-  }, [namespace, name, editedYaml, parseYaml, applyMutation, handleCancelEdit, onApplySuccess])
+  }, [namespace, name, isHistoricalRevision, editedYaml, parseYaml, applyMutation, handleCancelEdit, onApplySuccess])
 
   // Apply from preview modal
   const handleApplyFromPreview = useCallback(async () => {
-    if (!previewData || !namespace || !name) return
+    if (!previewData || !namespace || !name || isHistoricalRevision) return
     try {
       await applyMutation.mutateAsync({
         namespace,
@@ -137,7 +148,7 @@ export function ValuesViewer({
     } catch {
       // Error is handled by mutation
     }
-  }, [previewData, namespace, name, applyMutation, handleCancelEdit, onApplySuccess])
+  }, [previewData, namespace, name, isHistoricalRevision, applyMutation, handleCancelEdit, onApplySuccess])
 
   if (isLoading) {
     return <PaneLoader label="Loading values…" className="h-32" />
@@ -147,7 +158,12 @@ export function ValuesViewer({
     return (
       <div className="p-4">
         <div className="flex items-center justify-between mb-3">
-          <span className="text-sm font-medium text-theme-text-secondary">Values</span>
+          <div className="flex items-center gap-2">
+            <span className="text-sm font-medium text-theme-text-secondary">Values</span>
+            {isHistoricalRevision && (
+              <span className="badge-sm bg-theme-hover/50 text-theme-text-secondary">revision {revision}</span>
+            )}
+          </div>
           <div className="flex items-center gap-2">
             <ToggleButton showAll={showAllValues} onToggle={onToggleAllValues} disabled={isEditing} />
             {canEdit && (
@@ -161,6 +177,11 @@ export function ValuesViewer({
             )}
           </div>
         </div>
+        {isHistoricalRevision && (
+          <div className="mb-3 rounded border border-theme-border bg-theme-elevated/40 px-3 py-2 text-xs text-theme-text-secondary">
+            Viewing historical values. Switch back to the latest revision before editing or applying changes.
+          </div>
+        )}
         <div className="flex flex-col items-center justify-center h-32 text-theme-text-tertiary gap-2">
           <Settings className="w-8 h-8 text-theme-text-disabled" />
           <span>{showAllValues ? 'No computed values' : 'No user-supplied values'}</span>
@@ -179,6 +200,9 @@ export function ValuesViewer({
           <span className="text-sm font-medium text-theme-text-secondary">
             {isEditing ? 'Editing Values' : showAllValues ? 'All Values (Computed)' : 'User-Supplied Values'}
           </span>
+          {isHistoricalRevision && !isEditing && (
+            <span className="badge-sm bg-theme-hover/50 text-theme-text-secondary">revision {revision}</span>
+          )}
           {isEditing && (
             <span className="badge-sm bg-amber-500/20 text-amber-400 border-amber-500/30">
               unsaved
@@ -218,7 +242,7 @@ export function ValuesViewer({
               </button>
               <button
                 onClick={handlePreview}
-                disabled={!!yamlError || previewMutation.isPending}
+                disabled={!!yamlError || previewMutation.isPending || isHistoricalRevision}
                 className="flex items-center gap-1 px-2 py-1 text-xs text-theme-text-secondary hover:text-theme-text-primary hover:bg-theme-elevated rounded border border-theme-border disabled:opacity-50 disabled:cursor-not-allowed"
               >
                 {previewMutation.isPending ? (
@@ -231,7 +255,7 @@ export function ValuesViewer({
               <Tooltip content={!canHelmWrite ? helmActReason : ''}>
               <button
                 onClick={handleApply}
-                disabled={!!yamlError || applyMutation.isPending || !canHelmWrite}
+                disabled={!!yamlError || applyMutation.isPending || !canHelmWrite || isHistoricalRevision}
                 className="flex items-center gap-1 px-2.5 py-1 text-xs btn-brand rounded disabled:cursor-not-allowed disabled:pointer-events-none"
               >
                 {applyMutation.isPending ? (
@@ -247,6 +271,12 @@ export function ValuesViewer({
         </div>
       </div>
 
+      {isHistoricalRevision && (
+        <div className="mb-3 rounded border border-theme-border bg-theme-elevated/40 px-3 py-2 text-xs text-theme-text-secondary">
+          Viewing historical values. Switch back to the latest revision before editing or applying changes.
+        </div>
+      )}
+
       {/* Error message */}
       {yamlError && (
         <div className="mb-3 px-3 py-2 text-xs text-red-400 bg-red-500/10 border border-red-500/30 rounded">

package/src/components/home/mcpToolCatalog.ts

@@ -109,9 +109,9 @@ export const MCP_TOOL_CATALOG: MCPToolInfo[] = [
   },
   {
     name: 'diagnose',
-    desc: 'One-call root-cause bundle. Workloads get spec + resourceContext + current AND previous logs across pods + warning events + startup blockers; GitOps reconcilers get status summary + parsed related issues.',
+    desc: 'One-call root-cause bundle. Workloads get spec + resourceContext + current AND previous logs across pods + warning events + startup blockers; GitOps reconcilers, including Flux HelmRelease, get status summary + parsed related issues.',
     params: [
-      { arg: 'kind', required: true, desc: 'pod, deployment, statefulset, daemonset, application, kustomization, or helmrelease' },
+      { arg: 'kind', required: true, desc: 'pod, deployment, statefulset, daemonset, application, kustomization, or Flux HelmRelease' },
       { arg: 'namespace', required: true, desc: 'resource namespace' },
       { arg: 'name', required: true, desc: 'resource name' },
       { arg: 'container', desc: 'specific container (defaults to all)' },
@@ -126,7 +126,7 @@ export const MCP_TOOL_CATALOG: MCPToolInfo[] = [
   },
   {
     name: 'get_changes',
-    desc: 'Recent resource creates, updates, and deletes from the Kubernetes timeline. Helm release history is separate; use list_helm_releases or get_helm_release include=history,operations for failed upgrades and rollbacks.',
+    desc: 'Recent meaningful changes from the Kubernetes timeline plus native Helm deployment history (source=helm). Includes failed upgrades, rollbacks, and current Helm revisions; sourcesErrored marks partial source failures.',
     params: [
       { arg: 'namespace', desc: 'filter to a specific namespace' },
       { arg: 'kind', desc: 'filter to a resource kind (e.g. Deployment)' },
@@ -152,13 +152,13 @@ export const MCP_TOOL_CATALOG: MCPToolInfo[] = [
   },
   {
     name: 'get_helm_release',
-    desc: 'Detailed Helm release info with owned resources, health, Flux ownership, and current lastOperation; include history and operations for the full revision trail.',
+    desc: 'Detailed Helm release info with owned resources, health, Flux ownership, current lastOperation, hooks, and failed/running hook diagnostics with live Job/Pod/Event/redacted-log evidence when available.',
     params: [
       { arg: 'namespace', required: true, desc: 'Helm storage namespace; use storageNamespace from list_helm_releases when present' },
       { arg: 'name', required: true, desc: 'release name' },
-      { arg: 'include', desc: 'values, history, operations, diff' },
-      { arg: 'diff_revision_1', desc: 'first revision for diff' },
-      { arg: 'diff_revision_2', desc: 'second revision for diff (defaults to current)' },
+      { arg: 'include', desc: 'values, history, operations, diff, values_diff, notes_diff, resource_diff' },
+      { arg: 'diff_revision_1', desc: 'first revision for any diff include' },
+      { arg: 'diff_revision_2', desc: 'second revision for any diff include (defaults to current)' },
     ],
   },
   {
@@ -172,7 +172,7 @@ export const MCP_TOOL_CATALOG: MCPToolInfo[] = [
   },
   {
     name: 'issues',
-    desc: 'Ranked list of what is broken right now — failing workloads, dangling references, scheduling blockers, and false CRD conditions. Live operational state (distinct from get_cluster_audit posture).',
+    desc: 'Ranked list of what is broken right now — failing workloads, active native Helm release failures or stuck pending operations, dangling references, scheduling blockers, and false CRD conditions. Native Helm rows use group=helm.sh.',
     params: [
       { arg: 'namespace', desc: 'filter to one namespace' },
       { arg: 'severity', desc: 'comma-separated: critical, warning' },

package/src/components/portforward/PortForwardButton.tsx

@@ -1,8 +1,10 @@
 import { useState, useRef, useEffect } from 'react'
+import { createPortal } from 'react-dom'
 import { Plug, ChevronDown, Loader2, Globe, Monitor, Copy, Check, X, Terminal } from 'lucide-react'
 import { clsx } from 'clsx'
-import { useAvailablePorts, useClusterInfo, AvailablePort } from '../../api/client'
+import { useAvailablePorts, AvailablePort } from '../../api/client'
 import { useStartPortForward } from './PortForwardManager'
+import { useIsLocalDeployment } from '../../contexts/CapabilitiesContext'
 import { validatePort } from '@skyhook-io/k8s-ui/utils/validators'
 import { Tooltip } from '../ui/Tooltip'
 
@@ -22,6 +24,13 @@ interface KubectlDialogInfo {
   port: number
 }
 
+// kubectl port-forward (and the live forward, which uses the same transport) is
+// TCP-only — UDP/SCTP can't be forwarded (kubernetes/kubernetes#47862). Treat an
+// unset protocol as TCP.
+export function isPortForwardable(protocol?: string): boolean {
+  return (protocol || 'TCP').toUpperCase() === 'TCP'
+}
+
 function buildKubectlCommand(type: 'pod' | 'service', namespace: string, name: string, localPort: number, remotePort: number) {
   const resource = type === 'pod' ? `pod/${name}` : `svc/${name}`
   const portArg = localPort === remotePort ? `${remotePort}` : `${localPort}:${remotePort}`
@@ -70,17 +79,23 @@ function KubectlCommandDialog({
 
   useEffect(() => {
     const handleKeyDown = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') onClose()
+      if (e.key !== 'Escape') return
+      // Capture + stopPropagation so Escape closes only this dialog, not the
+      // drawer behind it (whose Escape shortcut listens in the bubble phase).
+      e.stopPropagation()
+      onClose()
     }
-    document.addEventListener('keydown', handleKeyDown)
-    return () => document.removeEventListener('keydown', handleKeyDown)
+    document.addEventListener('keydown', handleKeyDown, true)
+    return () => document.removeEventListener('keydown', handleKeyDown, true)
   }, [onClose])
 
   useEffect(() => {
     dialogRef.current?.focus()
   }, [])
 
-  return (
+  // Portal to <body>: the drawer is a transformed ancestor that would otherwise
+  // trap this position:fixed dialog inside the drawer instead of centering it.
+  return createPortal(
     <div className="fixed inset-0 z-50 flex items-center justify-center">
       <div className="absolute inset-0 bg-black/60 backdrop-blur-sm" onClick={onClose} />
       <div
@@ -103,7 +118,7 @@ function KubectlCommandDialog({
 
         <div className="p-4 space-y-3">
           <p className="text-sm text-theme-text-secondary">
-            Radar is running in-cluster, so port forwarding must be run from your local terminal.
+            Forward this port to your own machine — run it from your terminal:
           </p>
           <div className="flex flex-col gap-1">
             <div className="flex items-center gap-2 text-sm text-theme-text-secondary">
@@ -147,12 +162,13 @@ function KubectlCommandDialog({
               {copied ? 'Copied' : copyFallback ? 'Press Ctrl+C' : 'Copy'}
             </button>
           </div>
-          <p className="text-xs text-theme-text-secondary">
-            Requires kubectl and authentication to this cluster.
+          <p className="text-xs text-theme-text-tertiary">
+            You&apos;ll need <code className="inline-code">kubectl</code> and access to this cluster.
           </p>
         </div>
       </div>
-    </div>
+    </div>,
+    document.body,
   )
 }
 
@@ -168,12 +184,16 @@ export function PortForwardButton({
   const [listenAddress, setListenAddress] = useState<'127.0.0.1' | '0.0.0.0'>('127.0.0.1')
   const dropdownRef = useRef<HTMLDivElement>(null)
 
-  const { data: clusterInfo } = useClusterInfo()
+  const isLocal = useIsLocalDeployment()
   const { data, isLoading } = useAvailablePorts(type, namespace, name)
   const startPortForward = useStartPortForward()
 
   const ports = data?.ports || []
-  const inCluster = clusterInfo?.inCluster ?? false
+  // Decide copy-command vs live forward from the SAME deployment signal that
+  // gates whether the button shows at all — so the two can't disagree (and we
+  // don't race a separate /cluster-info fetch that defaults to "not in-cluster").
+  // Cloud runs in-cluster too, so anything not-local uses the copy command.
+  const inCluster = !isLocal
   const isPending = !inCluster && startPortForward.isPending
   const resourceName = type === 'service' ? (serviceName || name) : name
 
@@ -204,10 +224,15 @@ export function PortForwardButton({
   }
 
   function renderButton() {
-    // If no ports available, show disabled button
-    if (!isLoading && ports.length === 0) {
+    // kubectl port-forward is TCP-only — never offer UDP/SCTP ports as targets.
+    const forwardable = ports.filter((p) => isPortForwardable(p.protocol))
+
+    // No forwardable ports: disabled button. Distinguish "no ports at all" from
+    // "ports exist but are all UDP" so the operator isn't left guessing.
+    if (!isLoading && forwardable.length === 0) {
+      const udpOnly = ports.length > 0
       return (
-        <Tooltip content="No ports available">
+        <Tooltip content={udpOnly ? "kubectl port-forward doesn't support UDP" : 'No ports available'}>
         <button
           disabled
           className={clsx(
@@ -216,18 +241,18 @@ export function PortForwardButton({
           )}
         >
           <Plug className="w-4 h-4" />
-          No Ports
+          {udpOnly ? 'No TCP Ports' : 'No Ports'}
         </button>
         </Tooltip>
       )
     }
 
-    // If only one port, forward directly on click (most common case)
-    if (ports.length === 1) {
+    // If only one forwardable port, forward directly on click (most common case)
+    if (forwardable.length === 1) {
       return (
-        <Tooltip content={`Port forward to ${ports[0].port}`}>
+        <Tooltip content={`Port forward to ${forwardable[0].port}`}>
         <button
-          onClick={() => handlePortSelect(ports[0])}
+          onClick={() => handlePortSelect(forwardable[0])}
           disabled={isPending}
           className={clsx(
             'flex items-center gap-2 px-3 py-2 bg-theme-elevated text-theme-text-primary text-sm rounded-lg hover:bg-theme-hover transition-colors disabled:opacity-50 disabled:pointer-events-none',
@@ -239,7 +264,7 @@ export function PortForwardButton({
           ) : (
             <Plug className="w-4 h-4" />
           )}
-          Forward :{ports[0].port}
+          Forward :{forwardable[0].port}
         </button>
         </Tooltip>
       )
@@ -306,7 +331,7 @@ export function PortForwardButton({
             <div className="px-2 py-1.5 text-xs text-theme-text-disabled border-b border-theme-border">
               Select port to forward
             </div>
-            {ports.map((port, i) => (
+            {forwardable.map((port, i) => (
               <button
                 key={i}
                 onClick={() => handlePortSelect(port)}
@@ -355,11 +380,15 @@ export function PortForwardInlineButton({
   protocol = 'TCP',
   disabled = false,
 }: PortForwardInlineButtonProps) {
-  const { data: clusterInfo } = useClusterInfo()
+  const isLocal = useIsLocalDeployment()
   const startPortForward = useStartPortForward()
   const [dialogInfo, setDialogInfo] = useState<KubectlDialogInfo | null>(null)
 
-  const inCluster = clusterInfo?.inCluster ?? false
+  // Decide copy-command vs live forward from the SAME deployment signal that
+  // gates whether the button shows at all — so the two can't disagree (and we
+  // don't race a separate /cluster-info fetch that defaults to "not in-cluster").
+  // Cloud runs in-cluster too, so anything not-local uses the copy command.
+  const inCluster = !isLocal
   const isPending = !inCluster && startPortForward.isPending
 
   const handleClick = (e: React.MouseEvent) => {
@@ -378,15 +407,30 @@ export function PortForwardInlineButton({
     }
   }
 
+  // UDP/SCTP can't be port-forwarded — show a muted, non-interactive hint that
+  // explains why rather than a button that would copy a command that can't work.
+  if (!isPortForwardable(protocol)) {
+    return (
+      <Tooltip content="kubectl port-forward doesn't support UDP">
+        <span className="inline-flex items-center gap-1 px-1.5 py-0.5 bg-theme-elevated rounded text-xs text-theme-text-tertiary opacity-60 cursor-default">
+          {port}/{protocol}
+          <Plug className="w-3 h-3" />
+        </span>
+      </Tooltip>
+    )
+  }
+
   return (
     <>
-      <Tooltip content={`Port forward ${port}`}>
+      <Tooltip content={inCluster ? 'Copy a kubectl port-forward command' : `Port forward ${port}`}>
       <button
         onClick={handleClick}
         disabled={disabled || isPending}
         className="inline-flex items-center gap-1 px-1.5 py-0.5 bg-theme-elevated hover:bg-accent-muted rounded text-xs transition-colors disabled:opacity-50 disabled:hover:bg-theme-elevated disabled:pointer-events-none"
       >
-        {port}/{protocol}
+        {/* In-cluster this opens a copy-command dialog rather than forwarding now;
+            the trailing "…" signals "opens a dialog" (it doesn't fire immediately). */}
+        {port}/{protocol}{inCluster ? '…' : ''}
         {isPending ? (
           <Loader2 className="w-3 h-3 animate-spin" />
         ) : (