@skyhook-io/radar-app 0.2.2 → 0.3.1

package/src/components/resources/renderers/ServiceAccountRenderer.tsx

@@ -1 +1,28 @@
-export * from '@skyhook-io/k8s-ui/components/resources/renderers/ServiceAccountRenderer'
+import { ServiceAccountRenderer as BaseServiceAccountRenderer } from '@skyhook-io/k8s-ui/components/resources/renderers/ServiceAccountRenderer'
+import type { ResourceRef } from '@skyhook-io/k8s-ui'
+import { useRBACSubject } from '../../../api/rbac'
+
+interface ServiceAccountRendererProps {
+  data: any
+  onNavigate?: (ref: ResourceRef) => void
+}
+
+export function ServiceAccountRenderer({ data, onNavigate }: ServiceAccountRendererProps) {
+  const namespace = data?.metadata?.namespace ?? ''
+  const name = data?.metadata?.name ?? ''
+  const { data: rbacData, isLoading, error } = useRBACSubject(
+    'ServiceAccount',
+    namespace,
+    name,
+    !!name,
+  )
+  return (
+    <BaseServiceAccountRenderer
+      data={data}
+      rbacData={rbacData ?? null}
+      rbacLoading={isLoading}
+      rbacError={error as Error | null}
+      onNavigate={onNavigate}
+    />
+  )
+}

package/src/components/resources/renderers/ServiceRenderer.tsx

@@ -1,26 +1,99 @@
+import { useMemo, useState, useCallback } from 'react'
 import { ServiceRenderer as BaseServiceRenderer } from '@skyhook-io/k8s-ui/components/resources/renderers/ServiceRenderer'
 import { PortForwardInlineButton } from '../../portforward/PortForwardButton'
+import { CurlButton, CurlPanel, isHttpishPort, defaultScheme, defaultPathForPort } from '../../curl/ServiceCurlButton'
+import { useResources } from '../../../api/client'
+import { useNamespacedCapabilities, useIsLocalDeployment } from '../../../contexts/CapabilitiesContext'
+import type { ResourceRef } from '../../../types'
 
 interface ServiceRendererProps {
   data: any
   onCopy: (text: string, label: string) => void
   copied: string | null
+  onNavigate?: (ref: ResourceRef) => void
 }
 
-export function ServiceRenderer({ data, onCopy, copied }: ServiceRendererProps) {
+export function ServiceRenderer({ data, onCopy, copied, onNavigate }: ServiceRendererProps) {
+  const namespace = data.metadata?.namespace
+  const serviceName = data.metadata?.name
+  const { canPortForward } = useNamespacedCapabilities(namespace)
+  const isLocal = useIsLocalDeployment()
+  // Offer the port-forward affordance when a live forward is possible (local +
+  // RBAC) OR when we're not local — in-cluster/Cloud can't bind a local listener,
+  // but we still surface a copy-paste `kubectl port-forward` command.
+  const showPortForward = canPortForward || !isLocal
+  // Curl dials the Service directly from in-cluster, so it's only available when
+  // Radar runs in-cluster/Cloud — locally you'd port-forward instead.
+  const showCurl = !isLocal
+  // Which port's inline curl panel is open (one at a time). `closing` keeps the
+  // panel mounted through its collapse animation before we drop it.
+  const [curl, setCurl] = useState<{ port: number; closing: boolean } | null>(null)
+  const closeCurl = useCallback(() => {
+    setCurl((p) => (p ? { ...p, closing: true } : null))
+    // Only drop the panel if it's still the one closing. Opening another port
+    // (which sets closing:false) before this fires must not clear the new panel.
+    window.setTimeout(() => setCurl((p) => (p?.closing ? null : p)), 220)
+  }, [])
+  const spec = data.spec || {}
+  const shouldLoadEndpointSlices = Boolean(
+    namespace &&
+    serviceName &&
+    spec.type !== 'ExternalName' &&
+    (!spec.selector || Object.keys(spec.selector).length === 0)
+  )
+  const { data: endpointSlices, isLoading: endpointSlicesLoading } = useResources<any>(
+    'endpointslices',
+    namespace,
+    'discovery.k8s.io',
+    { enabled: shouldLoadEndpointSlices, refetchInterval: 30000 }
+  )
+  const matchingEndpointSlices = useMemo(
+    () => (endpointSlices || []).filter((slice: any) => slice.metadata?.labels?.['kubernetes.io/service-name'] === serviceName),
+    [endpointSlices, serviceName]
+  )
+
   return (
     <BaseServiceRenderer
       data={data}
       onCopy={onCopy}
       copied={copied}
-      renderPortAction={({ namespace, serviceName, port, protocol }) => (
-        <PortForwardInlineButton
-          namespace={namespace}
-          serviceName={serviceName}
-          port={port}
-          protocol={protocol}
-        />
+      endpointSlices={matchingEndpointSlices}
+      endpointSlicesLoading={endpointSlicesLoading}
+      onNavigate={onNavigate}
+      renderPortAction={({ port, name, appProtocol, protocol }) => (
+        <>
+          {showCurl && isHttpishPort(port, name, appProtocol, protocol) && (
+            <CurlButton
+              active={curl?.port === port && !curl.closing}
+              onClick={() => {
+                if (curl?.port === port && !curl.closing) closeCurl()
+                else setCurl({ port, closing: false })
+              }}
+            />
+          )}
+          {showPortForward && (
+            <PortForwardInlineButton
+              namespace={namespace}
+              serviceName={serviceName}
+              port={port}
+              protocol={protocol}
+            />
+          )}
+        </>
       )}
+      renderPortPanel={({ port, name, appProtocol }) =>
+        curl?.port === port ? (
+          <CurlPanel
+            namespace={namespace}
+            serviceName={serviceName}
+            port={port}
+            initialScheme={defaultScheme(port, name, appProtocol)}
+            initialPath={defaultPathForPort(port, name, appProtocol)}
+            open={!curl.closing}
+            onClose={closeCurl}
+          />
+        ) : null
+      }
     />
   )
 }

package/src/components/resources/renderers/WorkloadRenderer.tsx

@@ -1,7 +1,11 @@
 import { WorkloadRenderer as BaseWorkloadRenderer } from '@skyhook-io/k8s-ui/components/resources/renderers/WorkloadRenderer'
 import { useNavigate } from 'react-router-dom'
-import { useScaleWorkload } from '../../../api/client'
-import { useQueryClient } from '@tanstack/react-query'
+import { useScaleWorkload, fetchJSON } from '../../../api/client'
+import { useRBACSubject } from '../../../api/rbac'
+import { useQueries, useQueryClient } from '@tanstack/react-query'
+import { kindToPlural } from '@skyhook-io/k8s-ui/utils/navigation'
+import type { Relationships, ResourceRef, ResourceWithRelationships } from '../../../types'
+import type { ScalerDiagnosis } from '@skyhook-io/k8s-ui/components/resources/renderers/WorkloadRenderer'
 
 // Map plural lowercase kind to singular PascalCase for ownerReferences matching
 function getOwnerKind(kind: string): string {
@@ -18,10 +22,12 @@ function getOwnerKind(kind: string): string {
 interface WorkloadRendererProps {
   kind: string
   data: any
-  onNavigate?: (ref: { kind: string; namespace: string; name: string }) => void
+  onNavigate?: (ref: ResourceRef) => void
+  relationships?: Relationships
+  scaleBlockedBy?: ResourceRef[]
 }
 
-export function WorkloadRenderer({ kind, data, onNavigate }: WorkloadRendererProps) {
+export function WorkloadRenderer({ kind, data, onNavigate, scaleBlockedBy }: WorkloadRendererProps) {
   const navigate = useNavigate()
   const queryClient = useQueryClient()
   const scaleMutation = useScaleWorkload()
@@ -29,12 +35,53 @@ export function WorkloadRenderer({ kind, data, onNavigate }: WorkloadRendererPro
   const metadata = data.metadata || {}
   const viewPodsUrl = `/resources/pods?ownerKind=${encodeURIComponent(getOwnerKind(kind))}&ownerName=${encodeURIComponent(metadata.name || '')}&namespace=${encodeURIComponent(metadata.namespace || '')}`
 
+  // SA reverse-lookup for the workload's pod template. "default" when unset
+  // (matches PodRenderer's semantics — the SA every Pod uses by default).
+  const saName = data?.spec?.template?.spec?.serviceAccountName || 'default'
+  const namespace = metadata.namespace ?? ''
+  const { data: rbacData, isLoading: rbacLoading, error: rbacError } = useRBACSubject(
+    'ServiceAccount', namespace, saName, !!namespace,
+  )
+  const hpaRefs = (scaleBlockedBy ?? []).filter(ref => {
+    const refKind = ref.kind.toLowerCase()
+    return refKind === 'horizontalpodautoscaler' || refKind === 'hpa'
+  })
+  const hpaQueries = useQueries({
+    queries: hpaRefs.map(ref => ({
+      queryKey: ['resource', kindToPlural(ref.kind), ref.namespace, ref.name, ref.group],
+      queryFn: () => {
+        const ns = ref.namespace || '_'
+        const params = new URLSearchParams()
+        if (ref.group) params.set('group', ref.group)
+        const query = params.toString()
+        return fetchJSON<ResourceWithRelationships<any>>(`/resources/${kindToPlural(ref.kind)}/${ns}/${ref.name}${query ? `?${query}` : ''}`)
+      },
+      enabled: Boolean(ref.kind && ref.name),
+      staleTime: 10000,
+      retry: false,
+    })),
+  })
+  const scalerDiagnostics: ScalerDiagnosis[] = hpaRefs.map((ref, index) => {
+    const query = hpaQueries[index]
+    return {
+      ref,
+      diagnosis: query.data?.hpaDiagnosis,
+      loading: query.isLoading,
+      error: query.isError ? (query.error instanceof Error ? query.error.message : 'Failed to fetch HPA') : undefined,
+    }
+  })
+
   return (
     <BaseWorkloadRenderer
       kind={kind}
       data={data}
       onNavigate={onNavigate}
       onViewPods={() => navigate(viewPodsUrl)}
+      rbacData={rbacData ?? null}
+      rbacLoading={rbacLoading}
+      rbacError={rbacError as Error | null}
+      scaleBlockedBy={scaleBlockedBy}
+      scalerDiagnostics={scalerDiagnostics}
       onScale={async (replicas) => {
         await scaleMutation.mutateAsync({
           kind,

package/src/components/resources/renderers/index.ts

@@ -7,6 +7,7 @@ export { ConfigMapRenderer } from './ConfigMapRenderer'
 export { SecretRenderer } from './SecretRenderer'
 export { JobRenderer } from './JobRenderer'
 export { CronJobRenderer } from './CronJobRenderer'
+export { CronWorkflowRenderer } from './CronWorkflowRenderer'
 export { HPARenderer } from './HPARenderer'
 export { NodeRenderer } from './NodeRenderer'
 export { PVCRenderer } from './PVCRenderer'
@@ -28,6 +29,7 @@ export { WorkflowTemplateRenderer } from './WorkflowTemplateRenderer'
 export { NetworkPolicyRenderer } from './NetworkPolicyRenderer'
 export { PodDisruptionBudgetRenderer } from './PodDisruptionBudgetRenderer'
 export { ServiceAccountRenderer } from './ServiceAccountRenderer'
+export { NamespaceRenderer } from './NamespaceRenderer'
 export { RoleRenderer } from './RoleRenderer'
 export { RoleBindingRenderer } from './RoleBindingRenderer'
 export { EventRenderer } from './EventRenderer'

package/src/components/resources/resource-utils.ts

@@ -1,5 +1,6 @@
 // Re-export all resource utilities from the shared @skyhook-io/k8s-ui package.
 export * from '@skyhook-io/k8s-ui/components/resources/resource-utils'
 
-// Backward compatibility: re-export formatBytes (previously re-exported here)
+// formatBytes lives in utils/format but is re-exported here so consumers
+// can import it from the same module as the rest of the resource utilities.
 export { formatBytes } from '@skyhook-io/k8s-ui/utils/format'