@skyhook-io/k8s-ui 1.17.0 → 1.18.0

package/src/components/gitops/insights/ArgoResourceDiff.test.tsx

@@ -0,0 +1,142 @@
+import { renderToStaticMarkup } from 'react-dom/server'
+import { describe, expect, test } from 'vitest'
+
+import type { GitOpsChange, GitOpsDrift, GitOpsInsight, GitOpsResourceDiff } from '../../../types'
+import { ArgoResourceDiff } from './ArgoResourceDiff'
+import { GitOpsChangesView } from './GitOpsInsightViews'
+
+// Shape seen live on Argo CD 3.5.2: the Deployment was scaled by hand (1 -> 3)
+// and a Git commit bumping the image hasn't synced yet. last-applied holds the
+// manifest from the last sync, so it only sees the scale.
+const lastApplied: GitOpsDrift = {
+  source: 'lastAppliedAnnotation',
+  entries: [{ path: 'spec.replicas', op: 'changed', desired: '1', live: '3' }],
+}
+
+const argoDiff: GitOpsResourceDiff = {
+  source: 'argocd-api',
+  desired: 'spec:\n  replicas: 1\n  image: nginx:1.28-alpine\n',
+  live: 'spec:\n  replicas: 3\n  image: nginx:1.27-alpine\n',
+  fieldEntries: [
+    { path: 'spec.replicas', op: 'changed', desired: '1', live: '3' },
+    { path: 'spec.template.spec.containers.[0].image', op: 'changed', desired: '"nginx:1.28-alpine"', live: '"nginx:1.27-alpine"' },
+  ],
+  redacted: false,
+  hook: false,
+}
+
+const IMAGE_PATH = 'spec.template.spec.containers.[0].image'
+
+const count = (html: string, needle: string) => html.split(needle).length - 1
+
+describe('ArgoResourceDiff field list', () => {
+  test("shows Argo's field list above the YAML diff, including the unsynced Git change", () => {
+    const html = renderToStaticMarkup(<ArgoResourceDiff diff={argoDiff} loading={false} fallbackDrift={lastApplied} />)
+    expect(html).toContain('Field diff')
+    expect(html).toContain(IMAGE_PATH)
+    expect(html).toContain('via Argo CD API')
+    expect(html.indexOf('Field diff')).toBeLessThan(html.indexOf('desired (Git-rendered)'))
+    // One list, not Argo's plus the last-applied fallback.
+    expect(count(html, 'Field diff')).toBe(1)
+  })
+
+  test('renders no field list box when Argo reports no field differences', () => {
+    const html = renderToStaticMarkup(<ArgoResourceDiff diff={{ ...argoDiff, fieldEntries: [] }} loading={false} fallbackDrift={lastApplied} />)
+    expect(html).not.toContain('Field diff')
+  })
+
+  test('treats a null field list (sent by older Radars) as empty instead of crashing', () => {
+    const html = renderToStaticMarkup(<ArgoResourceDiff diff={{ ...argoDiff, fieldEntries: null }} loading={false} fallbackDrift={lastApplied} />)
+    expect(html).not.toContain('Field diff')
+    expect(html).toContain('desired (Git-rendered)')
+  })
+
+  test('says the list was cut short instead of presenting the cap as the count', () => {
+    const html = renderToStaticMarkup(<ArgoResourceDiff diff={{ ...argoDiff, fieldEntriesTruncated: true }} loading={false} />)
+    expect(html).toContain('showing first 50 entries')
+    expect(html).not.toContain('2 fields')
+  })
+
+  test("falls back to the last-applied list when Argo's diff fails to load", () => {
+    const html = renderToStaticMarkup(<ArgoResourceDiff loading={false} error="Failed to fetch the diff from the Argo CD API server." fallbackDrift={lastApplied} />)
+    expect(html).toContain('Field diff')
+    expect(html).toContain('spec.replicas')
+    expect(html).not.toContain('via Argo CD API')
+    expect(html).toContain('Failed to fetch the diff from the Argo CD API server.')
+  })
+})
+
+describe('GitOpsChangesView expanded Argo row', () => {
+  const change: GitOpsChange = {
+    ref: { group: 'apps', kind: 'Deployment', namespace: 'web', name: 'web' },
+    category: 'OutOfSync',
+    sync: 'OutOfSync',
+    health: 'Healthy',
+    hasDesired: true,
+    hasLive: true,
+    drift: lastApplied,
+    partial: false,
+  }
+  const insight = (argoDiffAvailable: boolean): GitOpsInsight => ({
+    summary: { tool: 'argocd', kind: 'Application', namespace: 'argocd', name: 'web', sync: 'OutOfSync', health: 'Healthy' },
+    changes: [change],
+    capabilities: {
+      sync: true, refresh: true, terminate: false, suspend: false, resume: false,
+      syncWithSource: false, selectiveSync: true, rollback: false, argoDiffAvailable,
+    },
+  })
+
+  test('does not offer a live drawer for confirmed absence with unknown health', () => {
+    const data = insight(false)
+    data.changes = [{ ...change, missing: true, hasLive: false, health: 'Unknown', drift: undefined }]
+    const html = renderToStaticMarkup(<GitOpsChangesView insight={data} onOpenResource={() => {}} />)
+    expect(html).not.toContain('Open Deployment')
+    expect(html).toContain('No live resource')
+    expect(html).toContain('Not present in the cluster')
+  })
+
+  test('keeps unknown-health live objects navigable', () => {
+    const data = insight(false)
+    data.changes = [{ ...change, health: 'Unknown', drift: undefined }]
+    const html = renderToStaticMarkup(<GitOpsChangesView insight={data} onOpenResource={() => {}} />)
+    expect(html).toContain('Open Deployment')
+  })
+
+  test('does not report confirmed absence as healthy or tell a Synced resource to sync', () => {
+    const data = insight(false)
+    data.changes = [{ ...change, missing: true, hasLive: false, health: 'Healthy', sync: 'Synced', category: 'Synced', message: 'Controller diagnostic detail', drift: undefined }]
+    const html = renderToStaticMarkup(<GitOpsChangesView insight={data} onOpenResource={() => {}} />)
+    expect(html).not.toContain('1/1 resources healthy')
+    expect(html).toContain('Missing')
+    expect(html).toContain('Refresh the application')
+    expect(html).toContain('Controller diagnostic detail')
+    expect(html).not.toContain('Sync the application to create it')
+  })
+
+  test("hands the last-applied list to the Argo diff instead of rendering it alongside", () => {
+    let passed: GitOpsDrift | undefined
+    const html = renderToStaticMarkup(
+      <GitOpsChangesView
+        insight={insight(true)}
+        focusKey="Deployment/web/web"
+        renderResourceDiff={(_ref, fallbackDrift) => {
+          passed = fallbackDrift
+          return <div data-testid="argo-diff" />
+        }}
+      />,
+    )
+    expect(html).toContain('argo-diff')
+    expect(html).not.toContain('Field diff')
+    expect(passed).toEqual(lastApplied)
+    // The row's "N diff" badge counts the last-applied list, which can
+    // undercount here, so it isn't shown.
+    expect(html).not.toContain('1 diff')
+  })
+
+  test('without the Argo diff, the row still shows the last-applied list', () => {
+    const html = renderToStaticMarkup(<GitOpsChangesView insight={insight(false)} focusKey="Deployment/web/web" />)
+    expect(html).toContain('Field diff')
+    expect(html).toContain('spec.replicas')
+    expect(html).toContain('1 diff')
+  })
+})

package/src/components/gitops/insights/ArgoResourceDiff.tsx

@@ -2,18 +2,23 @@ import { useState } from 'react'
 import { createTwoFilesPatch } from 'diff'
 import { clsx } from 'clsx'
 import { FileText, GitCompare, Maximize2, Rows, ShieldOff, X } from 'lucide-react'
-import type { GitOpsResourceDiff } from '../../../types'
+import type { GitOpsDrift, GitOpsResourceDiff } from '../../../types'
 import { DiffLine, hasDiffBodyChange } from '../../shared/UnifiedDiff'
 import { CodeViewer } from '../../ui/CodeViewer'
 import { DialogPortal } from '../../ui/DialogPortal'
 import { YamlDiffEditor } from '../../ui/YamlEditor'
 import { Tooltip } from '../../ui/Tooltip'
+import { DriftPanel } from './DriftPanel'
 
 interface ArgoResourceDiffProps {
   diff?: GitOpsResourceDiff | null
   loading: boolean
   // Server error string ({"error"} body), surfaced inline — not a toast.
   error?: string | null
+  // The row's last-applied field list, shown only when Argo's diff can't be
+  // loaded. A loaded diff carries Argo's own field list, which also covers Git
+  // changes that haven't synced yet.
+  fallbackDrift?: GitOpsDrift | null
 }
 
 // ArgoResourceDiff renders the full Git-rendered desired-vs-live diff for a
@@ -21,7 +26,8 @@ interface ArgoResourceDiffProps {
 // fetch and passes data / loading / error. The inline view is a compact unified
 // preview; the maximize control opens the full view (Diff / Live manifest /
 // Desired manifest, with the Monaco-based YamlDiffEditor powering the Diff tab).
-export function ArgoResourceDiff({ diff, loading, error }: ArgoResourceDiffProps) {
+// Argo's per-field list sits above the preview, and only when it has entries.
+export function ArgoResourceDiff({ diff, loading, error, fallbackDrift }: ArgoResourceDiffProps) {
   const [maximized, setMaximized] = useState(false)
 
   if (loading) {
@@ -42,19 +48,30 @@ export function ArgoResourceDiff({ diff, loading, error }: ArgoResourceDiffProps
       </div>
     )
   }
+  const fallbackPanel = fallbackDrift && fallbackDrift.entries.length > 0 ? <DriftPanel drift={fallbackDrift} /> : null
   if (error) {
     return (
-      <div className="rounded-md border border-red-500/40 bg-red-500/5 px-3 py-2 text-xs text-red-700 dark:text-red-400">
-        {error}
+      <div className="space-y-3">
+        {fallbackPanel}
+        <div className="rounded-md border border-red-500/40 bg-red-500/5 px-3 py-2 text-xs text-red-700 dark:text-red-400">
+          {error}
+        </div>
       </div>
     )
   }
-  if (!diff) return null
+  if (!diff) return fallbackPanel
 
   const unchanged = !docsDiffer(diff.desired, diff.live)
+  // Older Radars send null for an empty list.
+  const fieldEntries = diff.fieldEntries ?? []
 
   return (
     <div>
+      {fieldEntries.length > 0 && (
+        <div className="mb-3">
+          <DriftPanel drift={{ entries: fieldEntries, source: diff.source, truncated: diff.fieldEntriesTruncated }} />
+        </div>
+      )}
       <div className="mb-2 flex items-center justify-between gap-2">
         <div className="flex items-center gap-2">
           <GitCompare className="h-3.5 w-3.5 shrink-0 text-theme-text-tertiary" />

package/src/components/gitops/insights/DriftPanel.tsx

@@ -0,0 +1,62 @@
+import type { GitOpsDrift, GitOpsDriftEntry } from '../../../types'
+
+// DriftPanel renders the structured per-field diff. Format mimics a
+// `diff -u` summary: removed paths in red, added in green, changed shown
+// inline as "old → new". Path is monospace; values are JSON-encoded and
+// pre-wrapped so structured values (objects, arrays) render readably.
+export function DriftPanel({ drift }: { drift: GitOpsDrift }) {
+  const sourceLabel = driftSourceLabel(drift.source)
+  return (
+    <div>
+      <div className="mb-2 flex items-baseline justify-between gap-2">
+        <h4 className="text-[11px] font-semibold uppercase tracking-wide text-theme-text-tertiary">Field diff</h4>
+        <span className="text-[10px] text-theme-text-tertiary">
+          desired (Git) → live ·
+          {drift.truncated ? ' showing first 50 entries' : ` ${drift.entries.length} field${drift.entries.length === 1 ? '' : 's'}`}
+          {sourceLabel && ` · ${sourceLabel}`}
+        </span>
+      </div>
+      <div className="space-y-1 font-mono text-[11px]">
+        {drift.entries.map((entry, i) => (
+          <DriftEntryRow key={`${entry.path}-${i}`} entry={entry} />
+        ))}
+      </div>
+    </div>
+  )
+}
+
+// Provenance label for a Drift's field entries. Only Argo-sourced drift gets an
+// explicit label; the built-in last-applied path renders without one (the
+// "desired (Git) → live" copy already implies it). Unknown sources (a library
+// consumer lagging the backend) fall through to no label rather than surfacing
+// a raw enum string.
+function driftSourceLabel(source: GitOpsDrift['source']): string {
+  return source === 'argocd-api' ? 'via Argo CD API' : ''
+}
+
+function DriftEntryRow({ entry }: { entry: GitOpsDriftEntry }) {
+  if (entry.op === 'removed') {
+    return (
+      <div>
+        <span className="text-red-600 dark:text-red-400">- {entry.path}</span>
+        {entry.desired && <span className="ml-2 text-theme-text-secondary">{entry.desired}</span>}
+      </div>
+    )
+  }
+  if (entry.op === 'added') {
+    return (
+      <div>
+        <span className="text-emerald-700 dark:text-emerald-400">+ {entry.path}</span>
+        {entry.live && <span className="ml-2 text-theme-text-secondary">{entry.live}</span>}
+      </div>
+    )
+  }
+  return (
+    <div>
+      <span className="text-amber-700 dark:text-amber-400">~ {entry.path}</span>
+      <span className="ml-2 text-theme-text-tertiary">{entry.desired}</span>
+      <span className="mx-1 text-theme-text-tertiary">→</span>
+      <span className="text-theme-text-primary">{entry.live}</span>
+    </div>
+  )
+}

package/src/components/gitops/insights/GitOpsInsightViews.tsx

@@ -2,7 +2,7 @@ import { AlertTriangle, ArrowUpDown, ChevronDown, ChevronRight, ChevronUp, Circl
 import { PaneLoader } from '../../ui/PaneLoader'
 import { clsx } from 'clsx'
 import { Fragment, useEffect, useRef, useState, type ReactNode } from 'react'
-import type { GitOpsChange, GitOpsHistoryItem, GitOpsInsight, GitOpsInsightRef, GitOpsIssue, GitOpsPlanItem, GitOpsRemediation, GitOpsResourceTree, GitOpsTreeNode } from '../../../types'
+import type { GitOpsChange, GitOpsDrift, GitOpsHistoryItem, GitOpsInsight, GitOpsInsightRef, GitOpsIssue, GitOpsPlanItem, GitOpsRemediation, GitOpsResourceTree, GitOpsTreeNode } from '../../../types'
 import { HealthStatusBadge, SyncStatusBadge } from '../GitOpsStatusBadge'
 import { radarHealthNote } from '../health-provenance'
 import { SEVERITY_BADGE, SEVERITY_TEXT } from '../../../utils/badge-colors'
@@ -23,13 +23,14 @@ import {
   healthStatusRank,
   isArgoResourceSyncEligible,
   messageToPhase,
-  normalizeHealthStatus,
+  missingResourceMessage,
   normalizeSyncStatus,
   resourceStatusCounts,
   syncStatusRank,
   type ResourceSortKey,
   type ResourceStatusFacet,
 } from './insights-helpers'
+import { DriftPanel } from './DriftPanel'
 
 interface GitOpsStatusStripProps {
   insight?: GitOpsInsight | null
@@ -222,7 +223,10 @@ function commitURLForRepo(source: string | undefined, revision: string): string
 // "did everything come up?" summary. All-healthy reads green and explicit
 // ("4/4 resources healthy"); mixed states list the unhealthy buckets so
 // the user sees at a glance what didn't make it.
-function buildHealthSummary(changes: GitOpsChange[]): { text: string; tone: string } | null {
+function buildHealthSummary(allChanges: GitOpsChange[]): { text: string; tone: string } | null {
+  // Dependencies are consumed, not deployed, so they don't count toward
+  // "did everything come up"; a failing one has its own Issue.
+  const changes = allChanges.filter((c) => !c.dependency)
   if (changes.length === 0) return null
   let healthy = 0
   let degraded = 0
@@ -233,7 +237,8 @@ function buildHealthSummary(changes: GitOpsChange[]): { text: string; tone: stri
     // Count HEALTH, not sync — a Synced resource can still be Degraded, so check
     // degraded/missing FIRST and never let a Synced sync-state mask it. A Synced
     // resource with no assessed health (ConfigMaps etc.) still reads as fine.
-    if (c.health === 'Degraded' || c.category === 'Degraded') degraded++
+    if (c.missing) missing++
+    else if (c.health === 'Degraded' || c.category === 'Degraded') degraded++
     else if (c.health === 'Missing' || c.category === 'Missing') missing++
     else if (c.health === 'Healthy' || c.category === 'Synced') healthy++
     else if (c.category === 'OutOfSync') outOfSync++
@@ -735,7 +740,10 @@ interface GitOpsChangesViewProps {
   // returns the loaded <ArgoResourceDiff/>. When present AND
   // insight.capabilities.argoDiffAvailable, resolvable rows expose a "Full
   // diff" toggle. Library consumers that don't wire it get no such affordance.
-  renderResourceDiff?: (ref: GitOpsInsightRef) => ReactNode
+  // fallbackDrift is the row's last-applied field list. The loaded diff shows
+  // Argo's own field list instead, and falls back to this one when the diff
+  // can't be loaded.
+  renderResourceDiff?: (ref: GitOpsInsightRef, fallbackDrift?: GitOpsDrift) => ReactNode
   // Opens the global Settings dialog. Backs the "Connect Argo CD" hint shown
   // when the root is an Argo Application without the diff integration.
   onOpenSettings?: () => void
@@ -1005,7 +1013,7 @@ export function GitOpsChangesView({ insight, error, onOpenResource, onSyncResour
             )}
           </div>
         )}
-        {totalCount > 0 && isArgoRoot && !insight.capabilities?.argoDiffAvailable && onOpenSettings && (
+        {totalCount > 0 && isArgoRoot && !insight.capabilities?.argoDiffAvailable && !insight.capabilities?.argoConnecting && onOpenSettings && (
           <div className="border-b border-theme-border bg-theme-base/40 px-4 py-2 text-[11px] text-theme-text-tertiary">
             {insight.capabilities?.argoConfigured ? (
               <>
@@ -1089,9 +1097,11 @@ export function GitOpsChangesView({ insight, error, onOpenResource, onSyncResour
                 const waveSet = !!planItem?.waveSet
                 const rowKey = refKey(change.ref)
                 const focused = focusKey === rowKey
-                const explanation = !change.syncError && !change.message
-                  ? explainChangeStatus(change.sync, change.health, insight.summary)
-                  : ''
+                const explanation = change.missing
+                  ? missingResourceMessage(change.sync)
+                  : !change.syncError && !change.message
+                    ? explainChangeStatus(change.sync, change.health, insight.summary)
+                    : ''
                 const hasInlineDetail = !!(
                   (change.drift && change.drift.entries.length > 0) ||
                   (change.recentEvents && change.recentEvents.length > 0)
@@ -1238,7 +1248,8 @@ function buildTreeExtras(nodes: GitOpsTreeNode[], declared: GitOpsChange[]): Git
       // had a controller verdict to be distinguished from.
       message: n.healthMessage,
       hasDesired: false,
-      hasLive: true,
+      hasLive: !n.missing,
+      missing: n.missing,
       partial: true,
       partialNote: 'Generated resource — not directly tracked by the GitOps controller (no drift / event diagnostics).',
     })
@@ -1330,7 +1341,7 @@ function ChangeRow({
   // When true, the expanded panel offers a "Full diff" toggle that mounts the
   // host-wired Argo CD diff loader for this resource.
   canFullDiff: boolean
-  renderResourceDiff?: (ref: GitOpsInsightRef) => ReactNode
+  renderResourceDiff?: (ref: GitOpsInsightRef, fallbackDrift?: GitOpsDrift) => ReactNode
   onOpenResource?: (ref: GitOpsChange['ref']) => void
   onSyncResource?: (ref: GitOpsChange['ref']) => void
   syncResourceDisabledReason?: string
@@ -1358,8 +1369,10 @@ function ChangeRow({
   // differently: hide the Open pill, suppress the drawer-open click path,
   // and offer "View in Git →" instead so the operator can read the
   // declared source instead of a non-existent live object.
-  const isAbsent = change.health === 'Missing' && !change.hasLive
-  const radarNote = radarHealthNote({ health: change.health, healthSource: change.healthSource, healthMessage: change.message })
+  const isAbsent = change.missing || (change.health === 'Missing' && !change.hasLive)
+  const radarNote = change.missing
+    ? 'Radar confirmed that this resource is not present in the cluster.'
+    : radarHealthNote({ health: change.health, healthSource: change.healthSource, healthMessage: change.message })
   const handleRowClick = () => {
     if (expandable) {
       setExpanded((v) => !v)
@@ -1422,8 +1435,11 @@ function ChangeRow({
             )}
             {/* Detail badges: surface that there's something to see in
                 the expanded panel. Without these the user has no signal
-                that clicking will reveal anything useful. */}
-            {driftEntries.length > 0 && (
+                that clicking will reveal anything useful. The field count
+                comes from the last-applied list, which can undercount on an
+                Argo row (Argo's own list loads only on expand), so it is
+                left off there. The OutOfSync badge already marks the row. */}
+            {!canFullDiff && driftEntries.length > 0 && (
               <Tooltip content={`${driftEntries.length} field${driftEntries.length === 1 ? '' : 's'} differ from Git`} delay={200} wrapperClassName="shrink-0">
                 <span className="rounded border border-amber-500/40 bg-amber-500/10 px-1.5 py-0.5 text-[10px] font-medium text-amber-700 dark:text-amber-400">
                   {driftEntries.length} diff
@@ -1453,7 +1469,7 @@ function ChangeRow({
             </Tooltip>
           )}
           {change.message && !change.syncError && <div className="ml-[18px] mt-1 line-clamp-2 text-xs text-theme-text-secondary">{change.message}</div>}
-          {!change.syncError && !change.message && explanation && (
+          {!change.syncError && (change.missing || !change.message) && explanation && (
             <div className="ml-[18px] mt-1 text-xs text-theme-text-tertiary">{explanation}</div>
           )}
         </button>
@@ -1467,7 +1483,7 @@ function ChangeRow({
           )}
         </div>
         <div className="flex flex-col items-start gap-1 self-start">
-          <HealthStatusBadge health={normalizeHealthStatus(change.health)} />
+          <HealthStatusBadge health={changeHealth(change)} />
           {radarNote && (
             <Tooltip content={radarNote} delay={200} wrapperClassName="inline-flex">
               <span className="cursor-help select-none rounded border border-theme-border bg-theme-elevated/70 px-1.5 py-0.5 text-[10px] leading-3 text-theme-text-tertiary">
@@ -1523,15 +1539,19 @@ function ChangeRow({
       {expandable && (
         <Collapse open={expanded} mountLazily>
           <div className="border-t border-theme-border bg-theme-base/40 px-4 py-3">
-            {driftEntries.length > 0 && <DriftPanel drift={change.drift!} />}
+            {/* The last-applied list only knows what was applied at the last
+                sync, so it misses a Git change that hasn't synced yet. When
+                Argo's diff can load, it owns the field list and shows this
+                one only if that load fails. */}
+            {!canFullDiff && driftEntries.length > 0 && <DriftPanel drift={change.drift!} />}
             {events.length > 0 && <RecentEventsPanel events={events} />}
             {/* Expanding a row IS the request to see its diff — render it inline
                 rather than behind a second "Full diff" click. The capability is
                 already gated on a live Argo connection, so this only mounts (and
                 fetches) when the diff can actually be served. */}
             {canFullDiff && (
-              <div className={clsx((driftEntries.length > 0 || events.length > 0) && 'mt-3')}>
-                {renderResourceDiff?.(change.ref)}
+              <div className={clsx(events.length > 0 && 'mt-3')}>
+                {renderResourceDiff?.(change.ref, change.drift)}
               </div>
             )}
           </div>
@@ -1541,67 +1561,6 @@ function ChangeRow({
   )
 }
 
-// DriftPanel renders the structured per-field diff. Format mimics a
-// `diff -u` summary: removed paths in red, added in green, changed shown
-// inline as "old → new". Path is monospace; values are JSON-encoded and
-// pre-wrapped so structured values (objects, arrays) render readably.
-function DriftPanel({ drift }: { drift: NonNullable<GitOpsChange['drift']> }) {
-  const sourceLabel = driftSourceLabel(drift.source)
-  return (
-    <div>
-      <div className="mb-2 flex items-baseline justify-between gap-2">
-        <h4 className="text-[11px] font-semibold uppercase tracking-wide text-theme-text-tertiary">Field diff</h4>
-        <span className="text-[10px] text-theme-text-tertiary">
-          desired (Git) → live ·
-          {drift.truncated ? ' showing first 50 entries' : ` ${drift.entries.length} field${drift.entries.length === 1 ? '' : 's'}`}
-          {sourceLabel && ` · ${sourceLabel}`}
-        </span>
-      </div>
-      <div className="space-y-1 font-mono text-[11px]">
-        {drift.entries.map((entry, i) => (
-          <DriftEntryRow key={`${entry.path}-${i}`} entry={entry} />
-        ))}
-      </div>
-    </div>
-  )
-}
-
-// Provenance label for a Drift's field entries. Only Argo-sourced drift gets an
-// explicit label; the built-in last-applied path renders without one (the
-// "desired (Git) → live" copy already implies it). Unknown sources (a library
-// consumer lagging the backend) fall through to no label rather than surfacing
-// a raw enum string.
-function driftSourceLabel(source: NonNullable<GitOpsChange['drift']>['source']): string {
-  return source === 'argocd-api' ? 'via Argo CD API' : ''
-}
-
-function DriftEntryRow({ entry }: { entry: NonNullable<GitOpsChange['drift']>['entries'][number] }) {
-  if (entry.op === 'removed') {
-    return (
-      <div>
-        <span className="text-red-600 dark:text-red-400">- {entry.path}</span>
-        {entry.desired && <span className="ml-2 text-theme-text-secondary">{entry.desired}</span>}
-      </div>
-    )
-  }
-  if (entry.op === 'added') {
-    return (
-      <div>
-        <span className="text-emerald-700 dark:text-emerald-400">+ {entry.path}</span>
-        {entry.live && <span className="ml-2 text-theme-text-secondary">{entry.live}</span>}
-      </div>
-    )
-  }
-  return (
-    <div>
-      <span className="text-amber-700 dark:text-amber-400">~ {entry.path}</span>
-      <span className="ml-2 text-theme-text-tertiary">{entry.desired}</span>
-      <span className="mx-1 text-theme-text-tertiary">→</span>
-      <span className="text-theme-text-primary">{entry.live}</span>
-    </div>
-  )
-}
-
 // RecentEventsPanel surfaces the last few events involving this resource.
 // Warning events get a red bar so the eye lands on them; normals are
 // muted. Aggregation count (when present) is a critical signal — "this

package/src/components/gitops/insights/insights-helpers.test.ts

@@ -3,6 +3,7 @@ import { SEVERITY_DOT } from '../../../utils/badge-colors'
 import type { GitOpsChange } from '../../../types'
 import {
   changeMatchesFacets,
+  changeHealth,
   changeMatchesSearch,
   compactSource,
   entryTone,
@@ -10,6 +11,7 @@ import {
   healthStatusRank,
   isArgoResourceSyncEligible,
   messageToPhase,
+  missingResourceMessage,
   phaseToTone,
   resourceStatusCounts,
   syncStatusRank,
@@ -19,6 +21,22 @@ function change(partial: Partial<GitOpsChange> & { ref: GitOpsChange['ref'] }):
   return { category: 'Unknown', hasDesired: true, hasLive: true, partial: false, ...partial }
 }
 
+describe('confirmed missing resources', () => {
+  it('counts, filters and enables sync independently of stale health and sync', () => {
+    const item = change({ ref: { kind: 'Secret', name: 'values' }, missing: true, hasLive: false, health: 'Healthy', sync: 'Synced' })
+    expect(changeHealth(item)).toBe('Missing')
+    expect(resourceStatusCounts([item]).missing).toBe(1)
+    expect(changeMatchesFacets(item, new Set(['missing']))).toBe(true)
+    expect(isArgoResourceSyncEligible(item, true)).toBe(true)
+  })
+
+  it('asks for a refresh when Argo still reports Synced', () => {
+    expect(missingResourceMessage('Synced')).toContain('Refresh')
+    expect(missingResourceMessage('Synced')).not.toContain('Sync the application')
+    expect(missingResourceMessage('OutOfSync')).toContain('Sync the application')
+  })
+})
+
 describe('gitopsToSeverity', () => {
   it.each([
     ['critical', 'error'],

package/src/components/gitops/insights/insights-helpers.ts

@@ -43,9 +43,16 @@ export function changeSync(change: GitOpsChange): SyncStatus {
 }
 
 export function changeHealth(change: GitOpsChange): GitOpsHealthStatus {
+  if (change.missing) return 'Missing'
   return normalizeHealthStatus(change.health)
 }
 
+export function missingResourceMessage(sync?: string): string {
+  return sync === 'Synced'
+    ? 'Argo reports this resource as synced, but it is not present in the cluster. Refresh the application to check its status.'
+    : 'Not present in the cluster. Sync the application to create it.'
+}
+
 export function isArgoResourceSyncEligible(change: GitOpsChange, declared: boolean, hook?: string): boolean {
   if (!declared || hook || change.hookPhase) return false
   return changeSync(change) === 'OutOfSync' || changeHealth(change) === 'Missing' || change.category === 'Missing'