@skyhook-io/radar-app 1.13.4 → 1.14.0

package/src/api/quotas.test.ts

@@ -0,0 +1,26 @@
+import { describe, expect, it } from 'vitest'
+import { podLimitRangeNames } from './quotas'
+
+describe('Pod-relevant LimitRanges', () => {
+  it('excludes PVC-only rules and retains Pod, Container and mixed rules', () => {
+    const rules = [
+      { metadata: { name: 'storage-only' }, spec: { limits: [{ type: 'PersistentVolumeClaim' }] } },
+      { metadata: { name: 'container-defaults' }, spec: { limits: [{ type: 'Container' }] } },
+      { metadata: { name: 'pod-total' }, spec: { limits: [{ type: 'Pod' }] } },
+      { metadata: { name: 'mixed' }, spec: { limits: [{ type: 'PersistentVolumeClaim' }, { type: 'Container' }] } },
+    ]
+    expect(podLimitRangeNames(rules)).toEqual(['container-defaults', 'pod-total', 'mixed'])
+  })
+
+  it('ignores LimitRanges with no declared entries', () => {
+    expect(podLimitRangeNames([
+      { metadata: { name: 'null-entries' }, spec: { limits: null } },
+      { metadata: { name: 'empty-entries' }, spec: { limits: [] } },
+    ])).toEqual([])
+  })
+
+  it('has no contextual links before data is available or for an empty namespace', () => {
+    expect(podLimitRangeNames(undefined)).toEqual([])
+    expect(podLimitRangeNames([])).toEqual([])
+  })
+})

package/src/api/quotas.ts

@@ -14,3 +14,23 @@ export function useNamespaceQuotas(namespace: string, enabled = true) {
     staleTime: 15000,
   })
 }
+
+// useNamespaceLimitRanges fetches a namespace's LimitRange objects via
+// /api/resources/limitranges?namespace=<ns> (a bare array). Backs the
+// NamespaceRenderer rules section and the contextual link on Pod/workload
+// details — the defaults and constraints applied at admission are otherwise
+// only visible by reading the object.
+export function useNamespaceLimitRanges(namespace: string, enabled = true) {
+  return useQuery<any[]>({
+    queryKey: ['limitranges', namespace],
+    queryFn: () => fetchJSON<any[]>(`/resources/limitranges?namespace=${encodeURIComponent(namespace)}`),
+    enabled: enabled && !!namespace,
+    staleTime: 15000,
+  })
+}
+
+export function podLimitRangeNames(limitRanges: any[] | undefined): string[] {
+  return (limitRanges ?? [])
+    .filter(lr => lr.spec.limits?.some((entry: { type: string }) => entry.type === 'Container' || entry.type === 'Pod'))
+    .map(lr => lr.metadata.name)
+}

package/src/api/workloadMetrics.test.ts

@@ -0,0 +1,40 @@
+import { describe, expect, it, vi } from 'vitest'
+import type { WorkloadMetrics } from './workloadMetrics'
+
+vi.mock('@tanstack/react-query', () => ({ useQuery: (options: unknown) => options }))
+vi.mock('./client', () => ({
+  useClusterInfo: () => ({ data: { context: 'cluster-a' } }),
+  fetchJSON: vi.fn(),
+  ApiError: class extends Error {},
+}))
+vi.mock('./config', () => ({ getApiBase: () => '/api' }))
+const { useWorkloadMetrics: workloadQueryOptions } = await import('./workloadMetrics')
+
+describe('workload source-switch placeholders', () => {
+  const options = () => workloadQueryOptions('Deployment', 'shop', 'api', '1h', 'istio', true) as unknown as {
+    queryKey: unknown[]
+    placeholderData: (data: WorkloadMetrics, query: { queryKey: unknown[] }) => WorkloadMetrics | undefined
+    refetchInterval: (query: { state: { data: WorkloadMetrics } }) => number
+  }
+  const data: WorkloadMetrics = {
+    state: 'available', sources: [], pods: 1, podsTotal: 1,
+    history: {}, comparison: {},
+    start: 0, end: 60, stepSeconds: 60, rateWindowSeconds: 300, panels: {},
+  }
+  it('keeps the previous payload when only the observer changes', () => {
+    const query = options()
+    const key = [...query.queryKey]
+    key[key.length - 1] = 'beyla'
+    expect(query.placeholderData(data, { queryKey: key })).toBe(data)
+  })
+  it('polls pending current attribution even while history is available', () => {
+    expect(options().refetchInterval({ state: { data } })).toBe(30_000)
+    expect(options().refetchInterval({ state: { data: { ...data, comparison: { cpu: { state: 'detecting', unit: 'cores', series: [] } } } } })).toBe(3_000)
+  })
+  it.each([1, 2, 3, 4, 5, 6])('drops the previous payload when identity field %s changes', (index) => {
+    const query = options()
+    const key = [...query.queryKey]
+    key[index] = 'different'
+    expect(query.placeholderData(data, { queryKey: key })).toBeUndefined()
+  })
+})

package/src/api/workloadMetrics.ts

@@ -0,0 +1,68 @@
+import { useQuery } from "@tanstack/react-query";
+import type { TimeSeries } from "@skyhook-io/k8s-ui/components/charts";
+import { ApiError, fetchJSON, useClusterInfo, type PrometheusTimeRange } from "./client";
+import { getApiBase } from "./config";
+
+export type WorkloadMetricState =
+  "available" | "partial" | "stale" | "unavailable" | "error" | "detecting";
+export type WorkloadRequestSource = "beyla" | "istio";
+
+export interface WorkloadMetricPanel {
+  state: WorkloadMetricState;
+  reason?: string;
+  unit: string;
+  series: TimeSeries[];
+}
+
+export interface WorkloadMetrics {
+	 history: Partial<Record<"cpu" | "memory" | "throttling" | "requests", { mode: "workload-history" | "current-pods" | "unavailable"; reason?: string }>>;
+	 comparison: Partial<Record<"cpu" | "memory" | "throttling", WorkloadMetricPanel>>;
+  scopeNotice?: string;
+  attribution?: Record<string, string>;
+  state: WorkloadMetricState;
+  reason?: string;
+  source?: WorkloadRequestSource;
+  sources: {
+    id: WorkloadRequestSource;
+    label: string;
+    state: WorkloadMetricState;
+  }[];
+  pods: number;
+  podsTotal: number;
+  end: number;
+  start: number;
+  stepSeconds: number;
+  rateWindowSeconds: number;
+  panels: Partial<
+    Record<
+      "requests" | "errors" | "p50" | "p95" | "throttling" | "cpu" | "memory" | "observedPods",
+      WorkloadMetricPanel
+    >
+  >;
+}
+
+export function useWorkloadMetrics(
+  kind: string,
+  namespace: string,
+  name: string,
+  range: PrometheusTimeRange,
+  source: WorkloadRequestSource | "",
+  enabled: boolean,
+) {
+  const { data: cluster } = useClusterInfo();
+  const identity = ["workload-metrics", getApiBase(), cluster?.context, kind, namespace, name, range];
+  return useQuery<WorkloadMetrics>({
+    queryKey: [...identity, source],
+    placeholderData: (previous, previousQuery) =>
+      identity.every((value, index) => previousQuery?.queryKey[index] === value) ? previous : undefined,
+    queryFn: ({ signal }) =>
+      fetchJSON<WorkloadMetrics>(
+        `/prometheus/workload/${encodeURIComponent(kind)}/${encodeURIComponent(namespace)}/${encodeURIComponent(name)}?${new URLSearchParams({ range, source })}`,
+        signal,
+      ),
+    enabled,
+    staleTime: 30_000,
+    refetchInterval: (query) => query.state.data?.state === "detecting" || Object.values(query.state.data?.comparison ?? {}).some((panel) => panel.state === "detecting") ? 3_000 : 30_000,
+    retry: (failureCount, error) => failureCount < 1 && error instanceof ApiError && error.status === 409,
+  });
+}

package/src/components/CloudConnectFlow.tsx

@@ -1,6 +1,7 @@
-import { useRef, useState } from 'react'
+import { type ReactNode, useRef, useState } from 'react'
 import { useMutation } from '@tanstack/react-query'
 import { AlertTriangle, ArrowUpRight, Check, ExternalLink, GitBranch, Info, Loader2, ShieldAlert, X } from 'lucide-react'
+import type { BlockedExit } from './cloudConnectHandoff'
 import { Collapse, CollapseChevron } from '@skyhook-io/k8s-ui/components/ui/Collapse'
 import {
   ApiError,
@@ -19,20 +20,20 @@ import { showApiError } from './ui/Toast'
 export function CloudConnectFlow({
   status,
   blocked,
-  signupUrl,
+  exit,
   onStatus,
   onExit,
 }: {
   status: CloudInstallStatus
   blocked: CloudInstallBlocked | null
-  signupUrl: string
+  exit: BlockedExit
   // Push a mutation's status response into the shared query state.
   onStatus: (st: CloudInstallStatus) => void
   // Leave the flow view (back to the pitch, or close after dismiss).
   onExit: () => void
 }) {
   if (blocked) {
-    return <BlockedView blocked={blocked} signupUrl={signupUrl} onExit={onExit} />
+    return <BlockedView blocked={blocked} exit={exit} onExit={onExit} />
   }
 
   switch (status.state) {
@@ -66,13 +67,14 @@ export function CloudConnectFlow({
 
 function BlockedView({
   blocked,
-  signupUrl,
+  exit,
   onExit,
 }: {
   blocked: CloudInstallBlocked
-  signupUrl: string
+  exit: BlockedExit
   onExit: () => void
 }) {
+  const copy = blockedCopy(blocked, exit)
   const icon =
     blocked.reason === 'gitops' ? (
       <GitBranch className="w-4 h-4 shrink-0 mt-0.5 text-emerald-600 dark:text-emerald-400" />
@@ -81,48 +83,33 @@ function BlockedView({
     ) : (
       <AlertTriangle className="w-4 h-4 shrink-0 mt-0.5 text-amber-500" />
     )
-  const title =
-    blocked.reason === 'gitops'
-      ? 'This install is managed by GitOps'
-      : blocked.reason === 'preflight'
-        ? 'Your Kubernetes identity can’t install this'
-        : 'This cluster can’t be connected from here'
   return (
     <div className="px-8 pt-6 pb-5">
       <div className="card-inner-lg flex gap-2.5">
         {icon}
-        <div className="min-w-0">
-          <div className="text-[13px] font-semibold text-theme-text-primary">{title}</div>
-          <p className="mt-1 text-[12px] leading-relaxed text-theme-text-secondary">{blocked.message}</p>
-          {blocked.blocking && blocked.blocking.length > 0 && (
-            <ul className="mt-2 space-y-1 text-[11.5px] text-theme-text-tertiary">
-              {blocked.blocking.map((line) => (
-                <li key={line} className="flex items-start gap-1.5">
-                  <span className="mt-[6px] w-1 h-1 rounded-full bg-amber-500 shrink-0" />
-                  {line}
-                </li>
-              ))}
-            </ul>
-          )}
+        <div className="min-w-0 space-y-3">
+          <div className="text-[13px] font-semibold text-theme-text-primary">{copy.title}</div>
+          <BlockedSection label="What Radar tried">{copy.tried}</BlockedSection>
+          <BlockedSection label="Why it stopped">
+            {copy.why}
+            {blocked.blocking && blocked.blocking.length > 0 && <BlockingLines lines={blocked.blocking} />}
+          </BlockedSection>
+          <BlockedSection label="What to do">{copy.next}</BlockedSection>
         </div>
       </div>
       <div className="mt-4 flex items-center gap-4">
-        {/* Only a preflight denial has a legitimate browser alternative —
-            someone with more Kubernetes permission can run the wizard. GitOps
-            and unsupported refusals named a specific reason and target that a
-            generic signup link cannot carry, so offering it would contradict
-            the message directly above. */}
-        {blocked.reason === 'preflight' && (
-          <a
-            href={signupUrl}
-            target="_blank"
-            rel="noopener noreferrer"
-            className="text-[12.5px] font-semibold text-emerald-600 dark:text-emerald-400 hover:underline underline-offset-2"
-          >
-            Connect through the browser wizard instead →
-          </a>
-        )}
-        <button onClick={onExit} className="text-[12.5px] text-theme-text-tertiary hover:text-theme-text-primary transition-colors">
+        <a
+          href={exit.href}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="px-5 py-2 rounded-[10px] bg-emerald-500 hover:bg-emerald-400 text-emerald-950 text-[13.5px] font-bold shadow-[0_0_22px_rgba(16,185,129,0.35)] hover:shadow-[0_0_30px_rgba(16,185,129,0.5)] hover:-translate-y-px transition-all"
+        >
+          {exit.label}
+        </a>
+        <button
+          onClick={onExit}
+          className="ml-auto text-[12.5px] text-theme-text-tertiary hover:text-theme-text-primary transition-colors"
+        >
           Back
         </button>
       </div>
@@ -130,6 +117,156 @@ function BlockedView({
   )
 }
 
+function BlockedSection({ label, children }: { label: string; children: ReactNode }) {
+  return (
+    <div>
+      <div className="text-[10.5px] font-semibold uppercase tracking-wide text-theme-text-tertiary">{label}</div>
+      <div className="mt-0.5 text-[12px] leading-relaxed text-theme-text-secondary">{children}</div>
+    </div>
+  )
+}
+
+function BlockingLines({ lines }: { lines: string[] }) {
+  return (
+    <ul className="mt-1.5 space-y-1 text-[11.5px] text-theme-text-tertiary">
+      {lines.map((line) => (
+        <li key={line} className="flex items-start gap-1.5">
+          <span className="mt-[6px] w-1 h-1 rounded-full bg-amber-500 shrink-0" />
+          {line}
+        </li>
+      ))}
+    </ul>
+  )
+}
+
+// The blocked card stands in for the plan card the person never saw, so it
+// carries what Radar did first, then why it stopped, then the way forward.
+// Three short labeled parts, not one paragraph. Every card ends the same way
+// — an admin with cluster access, in Radar Cloud — and the exit says whether
+// that is a deep-linked install command or Radar Cloud itself.
+function blockedCopy(blocked: CloudInstallBlocked, exit: BlockedExit): { title: string; tried: ReactNode; why: ReactNode; next: ReactNode } {
+  const a = blocked.attempted
+  const release = a && (
+    <>
+      release <code className="font-mono text-[11px] text-theme-text-primary">{a.release}</code> in namespace{' '}
+      <code className="font-mono text-[11px] text-theme-text-primary">{a.namespace}</code>
+    </>
+  )
+  const operation = a?.mode === 'adopt' ? 'a Helm upgrade of your existing' : 'a fresh Helm install of'
+  // What Radar did is told by the stage it reached, not by the plan it had:
+  // a target can be known from discovery before any chart was rendered or
+  // dry-run, and the card must not claim work that did not happen.
+  const tried =
+    !a ? (
+      <>Radar was looking for an existing Radar install in this cluster, as your kubeconfig identity. Nothing was changed.</>
+    ) : a.mode === 'gitops' ? (
+      <>Radar found {release} and traced how it is managed before planning anything. Nothing was changed.</>
+    ) : a.stage === 'inspect' ? (
+      a.mode === 'adopt' ? (
+        <>
+          Radar found {release} and was reading its Helm state, as your kubeconfig identity, before planning anything.
+          Nothing was changed.
+        </>
+      ) : (
+        <>
+          Radar found no Radar running anywhere in this cluster and was checking Helm’s release records in namespace{' '}
+          <code className="font-mono text-[11px] text-theme-text-primary">{a.namespace}</code>, as your kubeconfig
+          identity, before planning anything. Nothing was changed.
+        </>
+      )
+    ) : a.stage === 'prepare' ? (
+      <>
+        Radar planned {operation} {release} with the Cloud connection enabled and was preparing the chart, as your
+        kubeconfig identity. Nothing was changed.
+      </>
+    ) : (
+      <>
+        Radar prepared {operation} {release} with the Cloud connection enabled, and dry-ran it against the cluster as
+        your kubeconfig identity. Nothing was changed.
+      </>
+    )
+
+  // Where the exit is an install command, Radar Cloud asks for a cluster name
+  // first, then shows the instructions — say so, rather than promising a
+  // command on the next screen.
+  const installNext = (
+    <>
+      Have an admin with cluster access get the install command from Radar Cloud: it asks for a cluster name, then
+      shows the Helm, Argo CD or Flux instructions to review before running.
+    </>
+  )
+  const genericNext = (
+    <>
+      Have an admin with cluster access resolve the issue above, then connect — or recover — this cluster from Radar
+      Cloud.
+    </>
+  )
+  const unknownNext = (
+    <>
+      Have an admin with cluster access connect it from Radar Cloud.{' '}
+      {a?.partialScan ? (
+        <>
+          Radar could only check namespace{' '}
+          <code className="font-mono text-[11px] text-theme-text-primary">{a.namespace}</code> for an existing install,
+          so they should check the rest of the cluster first.
+        </>
+      ) : (
+        <>Radar couldn’t tell whether it is already installed here, so they should check first.</>
+      )}
+    </>
+  )
+
+  if (blocked.reason === 'gitops') {
+    return {
+      title: 'This install is managed by GitOps',
+      tried,
+      why: blocked.message,
+      next: exit.install ? (
+        <>
+          Have an admin with repo access get the values patch from Radar Cloud: it asks for a cluster name, then shows
+          the patch for your controller and the one command that creates the token Secret.
+        </>
+      ) : (
+        genericNext
+      ),
+    }
+  }
+  if (blocked.reason === 'unsupported') {
+    return { title: 'Radar can’t connect this cluster from here', tried, why: blocked.message, next: genericNext }
+  }
+  // Fresh offered on "nothing running" alone: say what was not confirmed.
+  const unconfirmedNext = (
+    <>
+      Radar found no Radar running in this cluster but couldn’t read Helm’s release records, so an admin with cluster
+      access should confirm nothing is installed before running a fresh install. {installNext}
+    </>
+  )
+  const next = exit.install ? (a?.releaseUnread ? unconfirmedNext : installNext) : unknownNext
+  switch (blocked.cause) {
+    case 'permissions':
+      return {
+        title: 'Your Kubernetes identity can’t do this install',
+        tried,
+        why: 'Your credentials lack permissions this needs (below). Anyone with them can complete this exact install.',
+        next,
+      }
+    case 'verification':
+      return {
+        title: 'This version of Radar can’t install this chart version from here',
+        tried,
+        why: 'The chart renders something this Radar build can’t check before applying, so it won’t install it unseen. A limitation of this Radar, not of your cluster or your access.',
+        next,
+      }
+    default:
+      return {
+        title: 'The cluster blocked part of this install',
+        tried,
+        why: 'The cluster refused: something already there conflicts with the install, or a policy rejects it. More permission wouldn’t change that.',
+        next: exit.install ? <>After the refusals above are resolved: {installNext}</> : next,
+      }
+  }
+}
+
 function PlanCard({
   status,
   onStatus,
@@ -348,7 +485,7 @@ function ConsentRow({
   checked: boolean
   onChange: (v: boolean) => void
   tone: 'emerald' | 'amber'
-  children: React.ReactNode
+  children: ReactNode
 }) {
   return (
     <label className="mt-3 flex items-start gap-2 cursor-pointer">