@skyhook-io/radar-app 1.8.0 → 1.8.2

package/src/components/helm/HelmReleaseDrawer.tsx

@@ -1,18 +1,18 @@
 import { useState, useCallback, useEffect, useRef } from 'react'
 import { flushSync } from 'react-dom'
-import { FetchResult, useDockReservedHeight } from '@skyhook-io/k8s-ui'
+import { FetchResult, useDockReservedHeight, compareVersions } from '@skyhook-io/k8s-ui'
 import { startViewTransitionSafe } from '@skyhook-io/k8s-ui/utils/view-transition'
 import { TRANSITION_DRAWER } from '../../utils/animation'
 import { useRefreshAnimation } from '../../hooks/useRefreshAnimation'
-import { X, Copy, Check, RefreshCw, Package, Code, History, FileText, Settings, Link2, Anchor, GitFork, BookOpen, ArrowUpCircle, Trash2, GitBranch } from 'lucide-react'
+import { X, Copy, Check, RefreshCw, Package, Code, History, FileText, Settings, Link2, Anchor, GitFork, BookOpen, ArrowUpCircle, Trash2, GitBranch, AlertTriangle, RotateCcw, Clock } from 'lucide-react'
 import { useNavigate } from 'react-router-dom'
 import { clsx } from 'clsx'
-import { useHelmRelease, useHelmManifest, useHelmValues, useHelmManifestDiff, useHelmUpgradeInfo, useHelmUninstall, upgradeWithProgress, rollbackWithProgress } from '../../api/client'
+import { useHelmRelease, useHelmManifest, useHelmValues, useHelmManifestDiff, useHelmUpgradeInfo, useHelmReleaseVersions, useHelmUninstall, upgradeWithProgress, rollbackWithProgress } from '../../api/client'
 import { useQueryClient } from '@tanstack/react-query'
 import { ConfirmDialog } from '../ui/ConfirmDialog'
 import { Tooltip } from '../ui/Tooltip'
 import { Markdown } from '../ui/Markdown'
-import type { SelectedHelmRelease, HelmHook, ChartDependency } from '../../types'
+import type { SelectedHelmRelease, HelmHook, ChartDependency, HelmOperation } from '../../types'
 import type { NavigateToResource } from '../../utils/navigation'
 import { formatDate } from './helm-utils'
 import { getHelmStatusColor, SEVERITY_BADGE, SEVERITY_TEXT } from '../../utils/badge-colors'
@@ -23,6 +23,7 @@ import { ManifestViewer } from './ManifestViewer'
 import { ValuesViewer } from './ValuesViewer'
 import { OwnedResources } from './OwnedResources'
 import { ManifestDiffViewer } from './ManifestDiffViewer'
+import { TrackChartSourceDialog } from './TrackChartSourceDialog'
 
 interface HelmReleaseDrawerProps {
   release: SelectedHelmRelease
@@ -50,6 +51,8 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
   const [rollbackRevision, setRollbackRevision] = useState<number | null>(null)
   const [showUninstallConfirm, setShowUninstallConfirm] = useState(false)
   const [showUpgradeConfirm, setShowUpgradeConfirm] = useState(false)
+  const [showTrackSource, setShowTrackSource] = useState(false)
+  const [selectedVersion, setSelectedVersion] = useState<string | null>(null)
   const resizeStartX = useRef(0)
   const resizeStartWidth = useRef(DEFAULT_WIDTH)
   const { allowed: canHelmWrite, reason: helmActReason } = useCanHelmAct()
@@ -99,6 +102,17 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
   )
   const upgradeErrorMessage = upgradeError instanceof Error ? upgradeError.message : 'Upgrade check failed'
 
+  // Available versions for the upgrade dialog's picker — only fetched while the
+  // confirm dialog is open. Default the selection to latest when it opens.
+  const { data: availableVersions } = useHelmReleaseVersions(helmNamespace, release.name, showUpgradeConfirm)
+  const targetVersion = selectedVersion ?? upgradeInfo?.latestVersion ?? ''
+  // Semver compare, not list-position: the installed version may be older than
+  // the newest-N versions the picker shows, so it isn't always in the list.
+  const isDowngrade = Boolean(
+    targetVersion && upgradeInfo?.currentVersion &&
+    compareVersions(targetVersion, upgradeInfo.currentVersion) === -1
+  )
+
   // Mutations for actions
   const uninstallMutation = useHelmUninstall()
   const queryClient = useQueryClient()
@@ -234,7 +248,7 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
   }
 
   const handleUpgradeConfirm = async () => {
-    if (!upgradeInfo?.latestVersion) return
+    if (!targetVersion) return
     setIsUpgrading(true)
     setUpgradeProgress([])
 
@@ -242,8 +256,8 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
       await upgradeWithProgress(
         helmNamespace,
         release.name,
-        upgradeInfo.latestVersion,
-        upgradeInfo.repositoryName,
+        targetVersion,
+        upgradeInfo?.repositoryName,
         (event) => {
           if (event.type === 'progress' && event.message) {
             setUpgradeProgress(prev => [...prev, {
@@ -256,7 +270,7 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
 
       setUpgradeProgress(prev => [...prev, {
         phase: 'complete',
-        message: `Successfully upgraded to ${upgradeInfo.latestVersion}`,
+        message: `Successfully upgraded to ${targetVersion}`,
       }])
 
       // Invalidate queries
@@ -268,6 +282,7 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
       setTimeout(() => {
         setShowUpgradeConfirm(false)
         setUpgradeProgress([])
+        setSelectedVersion(null)
         refetch()
         switchTab('resources')
       }, 1500)
@@ -342,8 +357,18 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
                 upgrade check failed
               </span>
               </Tooltip>
+            ) : upgradeInfo?.updateAvailable && releaseDetail?.managedByFluxHelmRelease ? (
+              // Route-only for GitOps-managed releases: a direct `helm upgrade`
+              // would be reverted at the next reconcile, so surface the available
+              // version as info and point at GitOps rather than offer the upgrade.
+              <Tooltip content={`${upgradeInfo.latestVersion} available — managed by Flux, upgrade via the GitOps view (a direct upgrade would be reverted at the next reconcile).`}>
+              <span className={clsx('badge', SEVERITY_BADGE.warning, 'opacity-90')}>
+                <ArrowUpCircle className="w-3 h-3" />
+                {upgradeInfo.latestVersion}
+              </span>
+              </Tooltip>
             ) : upgradeInfo?.updateAvailable ? (
-              <Tooltip content={canHelmWrite ? `Click to upgrade: ${upgradeInfo.currentVersion} → ${upgradeInfo.latestVersion}${upgradeInfo.repositoryName ? ` (${upgradeInfo.repositoryName})` : ''}` : helmActReason}>
+              <Tooltip content={canHelmWrite ? `Click to upgrade: ${upgradeInfo.currentVersion} → ${upgradeInfo.latestVersion}${upgradeInfo.repositoryName ? ` (${upgradeInfo.repositoryName})` : upgradeInfo.sourceType === 'oci' ? ' (OCI)' : ''}` : helmActReason}>
               <button
                 onClick={() => setShowUpgradeConfirm(true)}
                 disabled={!canHelmWrite}
@@ -363,13 +388,39 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
               </span>
               </Tooltip>
             ) : upgradeInfo?.error ? (
-              <Tooltip content={upgradeInfo.error}>
-              <span
-                className="badge bg-theme-hover/50 text-theme-text-secondary"
-              >
-                upstream unknown
-              </span>
-              </Tooltip>
+              releaseDetail?.managedByFluxHelmRelease ? (
+                // Managed by Flux — the "Managed by Flux" badge routes to GitOps,
+                // where the chart source lives. Don't push a Helm source here.
+                <Tooltip content="Chart source is managed by Flux — track upgrades from the GitOps view.">
+                <span className="badge bg-theme-hover/50 text-theme-text-secondary">
+                  source via GitOps
+                </span>
+                </Tooltip>
+              ) : upgradeInfo.untracked ? (
+                // Helm doesn't record the install source. Offer to register one so
+                // Radar can track upgrades for the user's own (e.g. OCI) charts.
+                <Tooltip content={canHelmWrite ? "Radar can't tell where this chart was installed from. Register your chart source to track upgrades." : upgradeInfo.error}>
+                <button
+                  onClick={() => canHelmWrite && setShowTrackSource(true)}
+                  disabled={!canHelmWrite}
+                  className={clsx(
+                    'badge transition-colors disabled:pointer-events-none bg-theme-hover/50 text-theme-text-secondary',
+                    canHelmWrite ? 'hover:bg-theme-hover cursor-pointer' : 'opacity-50 cursor-not-allowed'
+                  )}
+                >
+                  <Link2 className="w-3 h-3" />
+                  source not tracked
+                </button>
+                </Tooltip>
+              ) : (
+                // Repo-side error (stale/broken index, classic ambiguity) — not an
+                // OCI tracking issue, so surface it without steering to registration.
+                <Tooltip content={upgradeInfo.error}>
+                <span className="badge bg-theme-hover/50 text-theme-text-secondary">
+                  upgrade source unresolved
+                </span>
+                </Tooltip>
+              )
             ) : null}
           </div>
           <div className="flex items-center gap-1">
@@ -462,6 +513,10 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
           <FetchResult loading={isLoading} error={releaseError} notFoundMessage="Release not found" className="h-32" />
         ) : (
           <>
+            <HelmOperationBanner
+              operation={releaseDetail.lastOperation}
+              managedByFluxHelmRelease={releaseDetail.managedByFluxHelmRelease}
+            />
             {activeTab === 'overview' && (
               <OverviewTab release={releaseDetail} onCopy={copyToClipboard} copied={copied} />
             )}
@@ -469,6 +524,7 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
               <RevisionHistory
                 history={releaseDetail.history}
                 currentRevision={releaseDetail.revision}
+                operations={mergeHelmOperations(releaseDetail.operations, releaseDetail.lastOperation)}
                 onViewRevision={handleViewRevision}
                 onCompare={handleCompareRevisions}
                 onRollback={canHelmWrite ? handleRollbackRequest : undefined}
@@ -572,6 +628,7 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
         onClose={() => {
           setShowUpgradeConfirm(false)
           setUpgradeProgress([])
+          setSelectedVersion(null)
           if (isUpgrading) {
             // Upgrade continues server-side — switch to resources tab to monitor
             setIsUpgrading(false)
@@ -580,18 +637,56 @@ export function HelmReleaseDrawer({ release, onClose, onNavigateToResource, isOp
         }}
         onConfirm={handleUpgradeConfirm}
         title="Upgrade Release"
-        message={`Upgrade "${release.name}" to version ${upgradeInfo?.latestVersion}?`}
+        message={`Upgrade "${release.name}" to version ${targetVersion}?`}
         details={upgradeProgress.length === 0
-          ? `This will upgrade the chart from version ${upgradeInfo?.currentVersion} to ${upgradeInfo?.latestVersion}. Your existing values will be preserved. The upgrade will be applied to your cluster immediately.`
+          ? `The chart will move from version ${upgradeInfo?.currentVersion} to ${targetVersion}. Your existing values will be preserved. The change is applied to your cluster immediately.`
           : undefined
         }
-        confirmLabel="Upgrade"
+        confirmLabel={isDowngrade ? 'Downgrade' : 'Upgrade'}
         variant="warning"
         isLoading={isUpgrading}
         isClosable
       >
+        {upgradeProgress.length === 0 && availableVersions && availableVersions.length > 1 && (
+          <div className="mb-1">
+            <label htmlFor="upgrade-version" className="block text-sm font-medium text-theme-text-secondary mb-1.5">
+              Target version
+            </label>
+            <select
+              id="upgrade-version"
+              value={targetVersion}
+              onChange={(e) => setSelectedVersion(e.target.value)}
+              disabled={isUpgrading}
+              className="w-full px-3 py-2 bg-theme-elevated border border-theme-border-light rounded-lg text-sm text-theme-text-primary focus:outline-none focus:ring-2 focus:ring-accent disabled:opacity-50"
+            >
+              {availableVersions.map((v) => (
+                <option key={v} value={v}>
+                  {v}
+                  {v === upgradeInfo?.latestVersion ? ' (latest)' : ''}
+                  {v === upgradeInfo?.currentVersion ? ' (current)' : ''}
+                </option>
+              ))}
+            </select>
+            {isDowngrade && (
+              <p className="mt-1 text-xs text-amber-600 dark:text-amber-400">
+                This is a downgrade from {upgradeInfo?.currentVersion}.
+              </p>
+            )}
+            {availableVersions.length >= 50 && (
+              <p className="mt-1 text-xs text-theme-text-tertiary">
+                Showing the 50 newest versions. Type to filter.
+              </p>
+            )}
+          </div>
+        )}
         {upgradeProgress.length > 0 && <ProgressLog entries={upgradeProgress} />}
       </ConfirmDialog>
+
+      <TrackChartSourceDialog
+        open={showTrackSource}
+        onClose={() => setShowTrackSource(false)}
+        chartName={releaseDetail?.chart}
+      />
     </div>
   )
 }
@@ -623,6 +718,125 @@ function ProgressLog({ entries }: { entries: { phase: string; message: string }[
   )
 }
 
+function mergeHelmOperations(operations: HelmOperation[] | undefined, lastOperation: HelmOperation | undefined): HelmOperation[] {
+  const merged: HelmOperation[] = []
+  const seen = new Set<string>()
+  for (const op of [...(operations || []), ...(lastOperation ? [lastOperation] : [])]) {
+    const key = helmOperationKey(op)
+    if (seen.has(key)) continue
+    seen.add(key)
+    merged.push(op)
+  }
+  return merged
+}
+
+function helmOperationKey(operation: HelmOperation): string {
+  return [
+    operation.kind,
+    operation.status,
+    operation.revision || 0,
+    operation.failedRevision || 0,
+    operation.rollbackRevision || 0,
+    operation.targetRevision || 0,
+  ].join(':')
+}
+
+function HelmOperationBanner({
+  operation,
+  managedByFluxHelmRelease,
+}: {
+  operation?: HelmOperation
+  managedByFluxHelmRelease?: string
+}) {
+  if (!operation || !shouldShowOperationBanner(operation)) {
+    return null
+  }
+
+  const isFailure = operation.status === 'failed'
+  const isPending = operation.status === 'stuck_pending'
+  const tone: 'error' | 'warning' | 'info' = isFailure ? 'error' : operation.kind === 'rollback' ? 'info' : 'warning'
+  const Icon = operation.kind === 'upgrade_rolled_back' || operation.kind === 'rollback' ? RotateCcw : isPending ? Clock : AlertTriangle
+  const title = operationTitle(operation)
+
+  return (
+    <div className="m-4 mb-0 card-inner-lg">
+      <div className="flex items-start gap-3">
+        <Icon className={clsx('mt-0.5 h-5 w-5 shrink-0', SEVERITY_TEXT[tone])} />
+        <div className="min-w-0 flex-1">
+          <div className="flex flex-wrap items-center gap-2">
+            <span className="text-sm font-medium text-theme-text-primary">{title}</span>
+            <span className={clsx('badge-sm', SEVERITY_BADGE[tone])}>{operation.status.replace(/_/g, ' ')}</span>
+            <OperationRevisionChips operation={operation} />
+          </div>
+          <p className="mt-1 text-sm text-theme-text-secondary">{operation.message}</p>
+          {operation.failureDescription && (
+            <p className="mt-1 text-xs text-theme-text-tertiary truncate">
+              {operation.failureDescription}
+            </p>
+          )}
+          {operation.kind === 'upgrade_rolled_back' && (
+            <p className="mt-1 text-xs text-theme-text-tertiary">
+              Helm history does not record whether <code className="inline-code text-[11px]">--atomic</code> was set; the rollback is inferred from adjacent release revisions.
+            </p>
+          )}
+          {managedByFluxHelmRelease && (
+            <p className="mt-1 text-xs text-theme-text-tertiary">
+              This release is managed by Flux HelmRelease {managedByFluxHelmRelease}; direct Helm changes may be reconciled back.
+            </p>
+          )}
+        </div>
+      </div>
+    </div>
+  )
+}
+
+function shouldShowOperationBanner(operation: HelmOperation): boolean {
+  return operation.kind === 'upgrade_rolled_back' || operation.kind === 'rollback' || operation.status === 'failed' || operation.status === 'stuck_pending'
+}
+
+function operationTitle(operation: HelmOperation): string {
+  switch (operation.kind) {
+    case 'upgrade_rolled_back':
+      return 'Helm rolled back after failed upgrade'
+    case 'rollback':
+      return 'Helm rollback applied'
+    case 'pending':
+      return 'Helm operation may be stuck'
+    case 'upgrade_failed':
+      return 'Helm upgrade failed'
+    case 'release_failed':
+      return 'Helm release failed'
+    default:
+      return 'Helm operation'
+  }
+}
+
+function OperationRevisionChips({ operation }: { operation: HelmOperation }) {
+  const chips: Array<{ key: string; label: string; className: string }> = []
+  if (operation.failedRevision) {
+    chips.push({ key: 'failed', label: `failed rev ${operation.failedRevision}`, className: SEVERITY_BADGE.error })
+  }
+  if (operation.rollbackRevision) {
+    chips.push({ key: 'rollback', label: `rollback rev ${operation.rollbackRevision}`, className: SEVERITY_BADGE.warning })
+  }
+  if (operation.targetRevision) {
+    chips.push({ key: 'target', label: `target rev ${operation.targetRevision}`, className: SEVERITY_BADGE.info })
+  }
+  if (!operation.failedRevision && !operation.rollbackRevision && operation.revision) {
+    chips.push({ key: 'revision', label: `rev ${operation.revision}`, className: SEVERITY_BADGE.neutral })
+  }
+  if (chips.length === 0) {
+    return null
+  }
+  return (
+    <>
+      {chips.map((chip) => (
+        <span key={chip.key} className={clsx('badge-sm', chip.className)}>{chip.label}</span>
+      ))}
+    </>
+  )
+}
+
 // Overview tab content
 interface OverviewTabProps {
   release: {

package/src/components/helm/HelmView.tsx

@@ -1,12 +1,12 @@
 import { useState, useMemo, useRef, useEffect, useCallback, forwardRef } from 'react'
 import { useRefreshAnimation } from '../../hooks/useRefreshAnimation'
 import { useRegisterShortcuts } from '../../hooks/useKeyboardShortcuts'
-import { Package, Search, RefreshCw, ArrowUpCircle, LayoutGrid, List, Shield, GitBranch, ChevronRight } from 'lucide-react'
+import { Package, Search, RefreshCw, ArrowUpCircle, LayoutGrid, List, Shield, GitBranch, ChevronRight, RotateCcw, Clock } from 'lucide-react'
 import { PaneLoader, PageHeader } from '@skyhook-io/k8s-ui'
 import { clsx } from 'clsx'
 import { useHelmReleases, useHelmBatchUpgradeInfo, isForbiddenError } from '../../api/client'
-import type { HelmRelease, SelectedHelmRelease, UpgradeInfo, ChartSource } from '../../types'
-import { getStatusColor, formatAge, truncate, isHelmReleaseActionable } from './helm-utils'
+import type { HelmOperation, HelmRelease, SelectedHelmRelease, UpgradeInfo, ChartSource } from '../../types'
+import { getStatusColor, formatAge, isHelmReleaseActionable } from './helm-utils'
 import { SEVERITY_BADGE } from '../../utils/badge-colors'
 import { Tooltip } from '../ui/Tooltip'
 import { ChartBrowser } from './ChartBrowser'
@@ -291,22 +291,22 @@ export function HelmView({ namespaces, selectedRelease, onReleaseClick }: HelmVi
                 <table className="w-full table-fixed">
                   <thead className="bg-theme-surface sticky top-0 z-10">
                     <tr>
-                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide">
+                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-[28%]">
                         Name
                       </th>
-                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-32">
+                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-[18%]">
                         Namespace
                       </th>
-                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-48">
+                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-[22%]">
                         Chart
                       </th>
                       <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-24 hidden xl:table-cell">
                         App Version
                       </th>
-                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-28">
+                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-40">
                         Status
                       </th>
-                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-20">
+                      <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-16">
                         Rev
                       </th>
                       <th className="text-left px-4 py-3 text-xs font-medium text-theme-text-secondary uppercase tracking-wide w-24">
@@ -411,8 +411,74 @@ function getActionableTooltip(issue: string | undefined, summary: string | undef
   )
 }
 
+function getListOperation(release: HelmRelease): HelmOperation | undefined {
+  if (release.lastOperation) {
+    const releaseStatus = release.status.toLowerCase()
+    if (release.lastOperation.status === 'failed' && releaseStatus === 'failed') {
+      return undefined
+    }
+    if (isListOperation(release.lastOperation)) {
+      return release.lastOperation
+    }
+  }
+  return release.operations?.find(isListOperation)
+}
+
+function isListOperation(operation: HelmOperation): boolean {
+  return operation.kind === 'upgrade_rolled_back' || operation.kind === 'rollback' || operation.status === 'stuck_pending'
+}
+
+function HelmOperationChip({ operation }: { operation: HelmOperation }) {
+  const isPending = operation.status === 'stuck_pending'
+  const isRollback = operation.kind === 'upgrade_rolled_back' || operation.kind === 'rollback'
+  const Icon = isRollback ? RotateCcw : Clock
+  const tone: keyof typeof SEVERITY_BADGE = operation.kind === 'rollback' ? 'info' : isPending ? 'warning' : 'alert'
+  const label = operation.kind === 'upgrade_rolled_back'
+    ? 'rolled back'
+    : operation.kind === 'rollback'
+      ? 'rollback'
+      : 'stuck'
+
+  return (
+    <Tooltip content={
+      <div className="max-w-xs">
+        <div className="font-medium text-theme-text-primary">{operationSummary(operation)}</div>
+        <div className="mt-1 text-[10px] text-theme-text-secondary">{operation.message}</div>
+        {operation.failureDescription && (
+          <div className="mt-1.5 border-t border-theme-border pt-1.5 text-[10px] text-theme-text-tertiary">
+            {operation.failureDescription}
+          </div>
+        )}
+      </div>
+    }>
+      <span className={clsx('badge-sm shrink-0', SEVERITY_BADGE[tone])} aria-label={operationSummary(operation)}>
+        <Icon className="h-3 w-3" />
+        <span className="sr-only">{label}</span>
+        <span className="hidden 2xl:inline" aria-hidden="true">{label}</span>
+      </span>
+    </Tooltip>
+  )
+}
+
+function operationSummary(operation: HelmOperation): string {
+  switch (operation.kind) {
+    case 'upgrade_rolled_back':
+      return 'Helm rolled back after failed upgrade'
+    case 'rollback':
+      return 'Helm rollback applied'
+    case 'pending':
+      return 'Helm operation may be stuck'
+    case 'upgrade_failed':
+      return 'Helm upgrade failed'
+    default:
+      return 'Helm release failed'
+  }
+}
+
 const ReleaseRow = forwardRef<HTMLTableRowElement, ReleaseRowProps>(
   function ReleaseRow({ release, upgradeInfo, isSelected, isHighlighted, onClick, onMouseEnter }, ref) {
+  const listOperation = getListOperation(release)
+
   // Health badge styling
   const getHealthBadge = () => {
     if (!release.resourceHealth || release.resourceHealth === 'unknown') return null
@@ -454,10 +520,11 @@ const ReleaseRow = forwardRef<HTMLTableRowElement, ReleaseRowProps>(
       )}
     >
       <td className="px-4 py-3">
-        <div className="flex items-center gap-2">
+        <div className="flex min-w-0 items-center gap-2">
           <Package className="w-4 h-4 text-theme-text-tertiary shrink-0" />
-          <span className="text-sm text-theme-text-primary font-medium truncate">{release.name}</span>
+          <span className="min-w-0 truncate text-sm font-medium text-theme-text-primary">{release.name}</span>
           {getHealthBadge()}
+          {listOperation && <HelmOperationChip operation={listOperation} />}
           {release.managedByFluxHelmRelease && (
             <Tooltip content={`Installed by Flux helm-controller via HelmRelease ${release.managedByFluxHelmRelease}. Changes here will be reverted at the next reconcile — manage via the GitOps tab.`}>
               <span className="badge-sm shrink-0 border border-theme-border bg-theme-elevated text-theme-text-secondary">
@@ -475,13 +542,15 @@ const ReleaseRow = forwardRef<HTMLTableRowElement, ReleaseRowProps>(
           )}
         </div>
       </td>
-      <td className="px-4 py-3 w-32">
-        <span className="text-sm text-theme-text-secondary">{release.namespace}</span>
+      <td className="px-4 py-3 w-[18%]">
+        <Tooltip content={release.namespace}>
+          <span className="block truncate text-sm text-theme-text-secondary">{release.namespace}</span>
+        </Tooltip>
       </td>
-      <td className="px-4 py-3 w-48">
+      <td className="px-4 py-3 w-[22%]">
         <Tooltip content={`${release.chart}-${release.chartVersion}`}>
           <span className="text-sm text-theme-text-secondary truncate block">
-            {truncate(`${release.chart}-${release.chartVersion}`, 35)}
+            {release.chart}-{release.chartVersion}
           </span>
         </Tooltip>
       </td>
@@ -494,7 +563,7 @@ const ReleaseRow = forwardRef<HTMLTableRowElement, ReleaseRowProps>(
           </Tooltip>
         )}
       </td>
-      <td className="px-4 py-3 w-28">
+      <td className="px-4 py-3 w-40">
         {isHelmReleaseActionable(release.status) ? (
           <Tooltip content="Click row to view rollback / history / logs and recover">
             <span
@@ -515,7 +584,7 @@ const ReleaseRow = forwardRef<HTMLTableRowElement, ReleaseRowProps>(
           </span>
         )}
       </td>
-      <td className="px-4 py-3 w-20">
+      <td className="px-4 py-3 w-16">
         <span className="text-sm text-theme-text-secondary">{release.revision}</span>
       </td>
       <td className="px-4 py-3 w-24">

package/src/components/helm/InstallWizard.tsx

@@ -191,7 +191,7 @@ export function InstallWizard({ repo, chartName, version, source, repoUrl, defau
     } finally {
       setIsInstalling(false)
     }
-  }, [releaseName, namespace, chartName, version, repo, valuesYaml, createNamespace, onSuccess, isLocal, artifactHubDetail, queryClient])
+  }, [releaseName, namespace, chartName, version, repo, repoUrl, valuesYaml, createNamespace, onSuccess, isLocal, artifactHubDetail, queryClient])
 
   // Validate release name + namespace before letting the user
   // advance. Without this, a name like "Invalid Name With Spaces!"

package/src/components/helm/RevisionHistory.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react'
 import { History, Eye, GitCompare, Check, RotateCcw } from 'lucide-react'
 import { clsx } from 'clsx'
-import type { HelmRevision } from '../../types'
+import type { HelmOperation, HelmRevision } from '../../types'
 import { getStatusColor, formatDate, formatAge } from './helm-utils'
 import { SEVERITY_BADGE } from '../../utils/badge-colors'
 import { Tooltip } from '../ui/Tooltip'
@@ -9,12 +9,13 @@ import { Tooltip } from '../ui/Tooltip'
 interface RevisionHistoryProps {
   history: HelmRevision[]
   currentRevision: number
+  operations?: HelmOperation[]
   onViewRevision: (revision: number) => void
   onCompare: (rev1: number, rev2: number) => void
   onRollback?: (revision: number) => void
 }
 
-export function RevisionHistory({ history, currentRevision, onViewRevision, onCompare, onRollback }: RevisionHistoryProps) {
+export function RevisionHistory({ history, currentRevision, operations = [], onViewRevision, onCompare, onRollback }: RevisionHistoryProps) {
   const [selectedForCompare, setSelectedForCompare] = useState<number | null>(null)
 
   const handleCompareClick = (revision: number) => {
@@ -63,6 +64,7 @@ export function RevisionHistory({ history, currentRevision, onViewRevision, onCo
         {history.map((revision, index) => {
           const isCurrent = revision.revision === currentRevision
           const isSelectedForCompare = selectedForCompare === revision.revision
+          const annotations = operationAnnotationsForRevision(operations, revision.revision)
 
           return (
             <div
@@ -106,6 +108,11 @@ export function RevisionHistory({ history, currentRevision, onViewRevision, onCo
                         Current
                       </span>
                     )}
+                    {annotations.map((annotation) => (
+                      <span key={annotation.label} className={clsx('badge-sm', annotation.className)}>
+                        {annotation.label}
+                      </span>
+                    ))}
                   </div>
 
                   <div className="flex items-center gap-4 mt-1 text-xs text-theme-text-tertiary">
@@ -166,3 +173,40 @@ export function RevisionHistory({ history, currentRevision, onViewRevision, onCo
     </div>
   )
 }
+
+function operationAnnotationsForRevision(operations: HelmOperation[], revision: number): Array<{ label: string; className: string }> {
+  const annotations: Array<{ label: string; className: string }> = []
+  const seen = new Set<string>()
+  const add = (label: string, className: string) => {
+    if (seen.has(label)) return
+    seen.add(label)
+    annotations.push({ label, className })
+  }
+
+  for (const op of operations) {
+    if (op.failedRevision === revision) {
+      add('Failed upgrade', SEVERITY_BADGE.error)
+    }
+    if (op.rollbackRevision === revision) {
+      add('Rollback revision', SEVERITY_BADGE.warning)
+    }
+    if (op.revision === revision) {
+      switch (op.kind) {
+        case 'upgrade_failed':
+          add('Failed upgrade', SEVERITY_BADGE.error)
+          break
+        case 'release_failed':
+          add('Failed', SEVERITY_BADGE.error)
+          break
+        case 'rollback':
+          add('Rollback', SEVERITY_BADGE.warning)
+          break
+        case 'pending':
+          add('Pending', SEVERITY_BADGE.warning)
+          break
+      }
+    }
+  }
+
+  return annotations
+}