@skyhook-io/k8s-ui 1.14.5 → 1.14.6

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

@@ -0,0 +1,277 @@
+import { Info, SlidersHorizontal } from 'lucide-react'
+import { Section, ResourceLink } from '../../ui/drawer-components'
+import { Tooltip } from '../../ui/Tooltip'
+import { LookupFailureNote } from './LookupFailureNote'
+import { isForbiddenError } from '../../../types/fetch-error'
+
+// A LimitRange declares the defaults and constraints the API server applies to
+// pods, containers and PVCs admitted into a namespace. It has no status, so
+// there is nothing to diagnose here — only the declared rules, shown as
+// written.
+
+interface LimitRangeFacet {
+  key: 'min' | 'max' | 'defaultRequest' | 'default' | 'maxLimitRequestRatio'
+  label: string
+  hint: string
+}
+
+const FACETS: LimitRangeFacet[] = [
+  { key: 'min', label: 'Min', hint: 'Lowest value accepted at admission.' },
+  { key: 'max', label: 'Max', hint: 'Highest value accepted at admission.' },
+  { key: 'defaultRequest', label: 'Default request', hint: 'Request applied when the resource omits one.' },
+  { key: 'default', label: 'Default limit', hint: 'Limit applied when the resource omits one.' },
+  {
+    key: 'maxLimitRequestRatio',
+    label: 'Max limit/request',
+    hint: 'Largest allowed limit ÷ request. A ratio, not a quantity — it carries no unit.',
+  },
+]
+
+const TYPE_SCOPE: Record<string, string> = {
+  Container: 'each container, individually',
+  Pod: 'the pod’s resource requests and limits',
+  PersistentVolumeClaim: 'each PersistentVolumeClaim',
+}
+
+type QuantityMap = Record<string, unknown>
+
+function facetMap(item: any, key: LimitRangeFacet['key']): QuantityMap {
+  const value = item?.[key]
+  return value && typeof value === 'object' ? (value as QuantityMap) : {}
+}
+
+/** Resource names this entry mentions anywhere, so a resource constrained by
+ *  only one facet still gets a row. */
+function entryResourceNames(item: any): string[] {
+  const names = new Set<string>()
+  for (const facet of FACETS) {
+    for (const name of Object.keys(facetMap(item, facet.key))) names.add(name)
+  }
+  return [...names].sort()
+}
+
+/** Facets this entry actually declares. An absent facet is not a zero, so it is
+ *  dropped rather than rendered as an empty column. */
+function entryFacets(item: any): LimitRangeFacet[] {
+  return FACETS.filter(facet => Object.keys(facetMap(item, facet.key)).length > 0)
+}
+
+function limitRangeItems(data: any): any[] {
+  const limits = data?.spec?.limits
+  return Array.isArray(limits) ? limits : []
+}
+
+export function LimitRangeRenderer({ data }: { data: any }) {
+  const items = limitRangeItems(data)
+
+  return (
+    <Section title="Defaults & Constraints" icon={SlidersHorizontal}>
+      {items.length === 0 ? (
+        <div className="text-xs text-theme-text-secondary">
+          This LimitRange declares no entries, so it constrains nothing.
+        </div>
+      ) : (
+        <div className="space-y-3">
+          {items.map((item: any, index: number) => (
+            <LimitRangeEntry key={`${item?.type ?? 'entry'}-${index}`} item={item} />
+          ))}
+        </div>
+      )}
+    </Section>
+  )
+}
+
+function LimitRangeEntry({ item }: { item: any }) {
+  const type = typeof item?.type === 'string' && item.type ? item.type : 'Unknown'
+  const scope = TYPE_SCOPE[type]
+  const facets = entryFacets(item)
+  const resources = entryResourceNames(item)
+
+  return (
+    <div className="card-inner">
+      <div className="flex flex-wrap items-baseline gap-x-2 gap-y-0.5 mb-2">
+        <span className="text-xs font-medium text-theme-text-primary">{type}</span>
+        {scope && <span className="text-xs text-theme-text-tertiary">applies to {scope}</span>}
+      </div>
+      {resources.length === 0 ? (
+        <div className="text-xs text-theme-text-secondary">No resources constrained by this entry.</div>
+      ) : (
+        <div className="overflow-x-auto">
+          <table className="w-full text-xs">
+            <thead>
+              <tr className="text-theme-text-tertiary text-left">
+                <th className="font-normal pr-3 pb-1">Resource</th>
+                {facets.map(facet => (
+                  <th key={facet.key} className="font-normal pr-3 pb-1 text-right whitespace-nowrap">
+                    <Tooltip content={facet.hint} delay={150}>
+                      <span className="border-b border-dotted border-theme-text-tertiary cursor-help">{facet.label}</span>
+                    </Tooltip>
+                  </th>
+                ))}
+              </tr>
+            </thead>
+            <tbody>
+              {resources.map(name => (
+                <tr key={name} className="border-t border-theme-border">
+                  <td className="pr-3 py-1 text-theme-text-secondary break-all">{name}</td>
+                  {facets.map(facet => {
+                    const raw = facetMap(item, facet.key)[name]
+                    const set = raw !== undefined && raw !== null
+                    return (
+                      <td
+                        key={facet.key}
+                        className="pr-3 py-1 text-right tabular-nums whitespace-nowrap text-theme-text-primary"
+                      >
+                        {set ? String(raw) : <span className="text-theme-text-tertiary" title="Not set">—</span>}
+                      </td>
+                    )
+                  })}
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      )}
+    </div>
+  )
+}
+
+// ============================================================================
+// NAMESPACE SECTION
+// ============================================================================
+// Namespace-level summary: which LimitRanges exist and what each one declares,
+// linking out to the full tables. Reached from the namespace an operator is
+// already troubleshooting, which is where the question "what gets applied to
+// pods here?" actually comes up.
+
+export function NamespaceLimitRangesSection({
+  limitRanges,
+  loading,
+  error,
+  namespace,
+  onNavigate,
+}: {
+  limitRanges?: any[]
+  loading?: boolean
+  error?: unknown
+  namespace: string
+  onNavigate?: (ref: { kind: string; namespace: string; name: string }) => void
+}) {
+  const denied = isForbiddenError(error)
+  const showCached = !!error && !denied && !!limitRanges?.length
+  const empty = !error && !loading && limitRanges?.length === 0
+
+  return (
+    <Section
+      key={`${namespace}-${empty ? 'empty' : 'rules'}`}
+      title={empty ? 'Limit Ranges (0)' : 'Limit Ranges'}
+      icon={SlidersHorizontal}
+      defaultExpanded={!empty}
+    >
+      {error != null && (
+        <div className="mb-2">
+          <LookupFailureNote errors={[error]} what="this namespace’s LimitRanges" />
+          {showCached && (
+            <div className="mt-1 text-xs text-theme-text-secondary">
+              Showing previously loaded rules. They may have changed.
+            </div>
+          )}
+        </div>
+      )}
+      {error && !showCached ? null : !limitRanges ? (
+        <div className="text-xs text-theme-text-secondary">
+          {loading ? 'Loading limit ranges…' : 'Limit ranges have not been read yet.'}
+        </div>
+      ) : limitRanges.length === 0 ? (
+        <div className="text-xs text-theme-text-secondary">
+          No LimitRanges found in this namespace. Other admission policies may still apply.
+        </div>
+      ) : (
+        <div className="space-y-2">
+          {limitRanges.map((lr: any, index: number) => {
+            const name = lr?.metadata?.name ?? `limitrange-${index}`
+            const items = limitRangeItems(lr)
+            return (
+              <div key={name} className="card-inner">
+                <div className="text-xs font-medium text-theme-text-primary">
+                  <ResourceLink
+                    name={name}
+                    kind="limitranges"
+                    namespace={lr?.metadata?.namespace || namespace}
+                    onNavigate={onNavigate}
+                  />
+                </div>
+                {items.length === 0 ? (
+                  <div className="mt-1 text-xs text-theme-text-tertiary">No entries.</div>
+                ) : (
+                  <div className="mt-1 space-y-0.5">
+                    {items.map((item: any, itemIndex: number) => {
+                      const facets = entryFacets(item)
+                      return (
+                        <div key={`${item?.type ?? 'entry'}-${itemIndex}`} className="text-xs text-theme-text-tertiary">
+                          <span className="text-theme-text-secondary">{item?.type || 'Unknown'}</span>
+                          {facets.length > 0 && ` · ${facets.map(f => f.label.toLowerCase()).join(', ')}`}
+                        </div>
+                      )
+                    })}
+                  </div>
+                )}
+              </div>
+            )
+          })}
+        </div>
+      )}
+    </Section>
+  )
+}
+
+// ============================================================================
+// CONTEXTUAL LINK (Pod / workload resource sections)
+// ============================================================================
+
+const SCOPE_CAVEAT: Record<'pod' | 'workload', string> = {
+  pod: 'The namespace’s current rules for admitting pods — not a record of what was applied to this pod. Other admission plugins may also change a pod’s resources.',
+  workload:
+    'The namespace’s current rules for admitting this workload’s pods, not the workload object itself. Other admission plugins may also change a pod’s resources.',
+}
+
+/** Small pointer from a resource's requests/limits to the namespace rules that
+ *  govern them. Renders nothing until the host has names to show, so a pending
+ *  or unreadable lookup makes no claim either way. */
+export function NamespaceLimitRangeLink({
+  namespace,
+  names,
+  scope,
+  onNavigate,
+}: {
+  namespace: string
+  names?: string[] | null
+  scope: 'pod' | 'workload'
+  onNavigate?: (ref: { kind: string; namespace: string; name: string }) => void
+}) {
+  if (!names?.length) return null
+
+  return (
+    <div className="mt-3 pt-2 border-t border-theme-border text-xs text-theme-text-tertiary">
+      <div>
+        Namespace defaults &amp; constraints:{' '}
+        {names.map((name, index) => (
+          <span key={name}>
+            {index > 0 && ', '}
+            <ResourceLink name={name} kind="limitranges" namespace={namespace} onNavigate={onNavigate} />
+          </span>
+        ))}
+        {' '}
+        <Tooltip content={SCOPE_CAVEAT[scope]}>
+          <button
+            type="button"
+            aria-label="About namespace defaults and constraints"
+            className="inline-flex align-middle text-theme-text-tertiary hover:text-theme-text-secondary"
+          >
+            <Info className="w-3 h-3" />
+          </button>
+        </Tooltip>
+      </div>
+    </div>
+  )
+}

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

@@ -4,6 +4,7 @@ import { Section, PropertyList, Property, ResourceLink } from '../../ui/drawer-c
 import type { RBACNamespaceResponse, RBACBindingWithSubjects, RBACSubject, ResourceRef } from '../../../types'
 import { rbacKindBadgeClass } from '../../../utils/rbac-badges'
 import { RBACErrorSection } from './RBACErrorSection'
+import { NamespaceLimitRangesSection } from './LimitRangeRenderer'
 import { SEVERITY_TEXT, SEVERITY_DOT } from '../../../utils/badge-colors'
 import { parseCPUToNanocores, parseMemoryToBytes, parseQuantityToNumber } from '../../../utils/format'
 
@@ -30,10 +31,21 @@ interface NamespaceRendererProps {
    * fetch 500/503s isn't mistaken for quota-free. (403 stays hidden upstream.)
    */
   quotaError?: Error | null
+  /**
+   * LimitRange objects for this namespace (from /api/resources/limitranges
+   * ?namespace=). Undefined when the host hasn't wired the fetch (section
+   * omitted) or while the read is in flight — an empty array is a real answer
+   * ("nothing constrains this namespace") and must not be confused with it.
+   */
+  limitRangeData?: any[]
+  limitRangeLoading?: boolean
+  /** Passed through including 403: a denial reads as "you can't check", which
+   *  is a different statement from "there are none". */
+  limitRangeError?: unknown
   onNavigate?: (ref: ResourceRef) => void
 }
 
-export function NamespaceRenderer({ data, rbacData, rbacLoading, rbacError, quotaData, quotaError, onNavigate }: NamespaceRendererProps) {
+export function NamespaceRenderer({ data, rbacData, rbacLoading, rbacError, quotaData, quotaError, limitRangeData, limitRangeLoading, limitRangeError, onNavigate }: NamespaceRendererProps) {
   const metadata = data.metadata || {}
   const status = data.status || {}
   const phase = status.phase
@@ -69,6 +81,17 @@ export function NamespaceRenderer({ data, rbacData, rbacLoading, rbacError, quot
         <NamespaceQuotaSection quotas={quotaData ?? []} error={quotaError ?? null} />
       )}
 
+      {/* LimitRange rules — only when host wired the fetch. */}
+      {(limitRangeData !== undefined || limitRangeLoading || limitRangeError != null) && (
+        <NamespaceLimitRangesSection
+          limitRanges={limitRangeData}
+          loading={limitRangeLoading}
+          error={limitRangeError}
+          namespace={metadata.name ?? ''}
+          onNavigate={onNavigate}
+        />
+      )}
+
       {/* RBAC summary — only when host wired the fetch. */}
       {rbacData !== undefined && (
         <NamespaceRBACSection

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

@@ -6,6 +6,8 @@ import {
   NETWORK_POLICY_PEER_STYLES,
   type NetworkPolicyPeerType,
 } from './network-policy-peer-styles'
+import { effectivePolicyTypes, formatNetworkPolicyPort } from '../../../utils/network-policy'
+import { formatKubernetesLabelSelector } from '../resource-utils-calico'
 
 interface NetworkPolicyDiagramProps {
   spec: any
@@ -20,16 +22,12 @@ interface NetworkPolicyDiagramProps {
  */
 export function NetworkPolicyDiagram({ spec, staged = false }: NetworkPolicyDiagramProps) {
   const podSelector = spec.podSelector || {}
-  const matchLabels = podSelector.matchLabels || {}
-  const policyTypes: string[] = spec.policyTypes || []
   const ingress: any[] | undefined = spec.ingress
   const egress: any[] | undefined = spec.egress
 
-  const hasIngress = policyTypes.includes('Ingress')
-  const hasEgress = policyTypes.includes('Egress')
-  const targetLabel = Object.keys(matchLabels).length > 0
-    ? Object.entries(matchLabels).map(([k, v]) => `${k}=${v}`).join(', ')
-    : 'All pods'
+  const { ingress: hasIngress, egress: hasEgress } = effectivePolicyTypes(spec)
+  const target = formatSelector(podSelector)
+  const targetLabel = target === 'all' ? 'All pods' : target
 
   const ingressDenied = hasIngress && (!ingress || ingress.length === 0)
   const egressDenied = hasEgress && (!egress || egress.length === 0)
@@ -159,18 +157,13 @@ function extractPeers(peers: any[] | undefined): PeerInfo[] {
 
 function extractPorts(ports: any[] | undefined): string[] {
   if (!ports || ports.length === 0) return []
-  return ports.map((p: any) => {
-    const proto = p.protocol || 'TCP'
-    const port = p.port || '*'
-    const endPort = p.endPort
-    return endPort ? `${proto}/${port}-${endPort}` : `${proto}/${port}`
-  })
+  return ports.map(formatNetworkPolicyPort)
 }
 
+// matchExpressions select too; a selector made only of them is not "all".
 function formatSelector(selector: any): string {
-  const labels = selector?.matchLabels || {}
-  if (Object.keys(labels).length === 0) return 'all'
-  return Object.entries(labels).map(([k, v]) => `${k}=${v}`).join(', ')
+  const text = formatKubernetesLabelSelector(selector)
+  return text === 'all workloads' ? 'all' : text
 }
 
 function FlowRow({

package/src/components/resources/renderers/NetworkPolicyRenderer.test.tsx

@@ -0,0 +1,75 @@
+import { describe, expect, it } from 'vitest'
+import { renderToString } from 'react-dom/server'
+import { NetworkPolicyRenderer } from './NetworkPolicyRenderer'
+import { NetworkPolicyDiagram } from './NetworkPolicyDiagram'
+
+const render = (spec: any) => renderToString(<NetworkPolicyRenderer data={{ kind: 'NetworkPolicy', spec }} />)
+const renderDiagram = (spec: any) => renderToString(<NetworkPolicyDiagram spec={spec} />)
+
+describe('NetworkPolicyRenderer', () => {
+  it('shows a policy without policyTypes as isolating ingress, and says the type was defaulted', () => {
+    const html = render({ podSelector: {} })
+    expect(html).toContain('Ingress Rules')
+    expect(html).toContain('Deny all ingress')
+    expect(html).toContain('policyTypes not set')
+    expect(html).not.toContain('Egress Rules')
+  })
+
+  it('does not call an explicitly typed policy defaulted', () => {
+    const html = render({ podSelector: {}, policyTypes: ['Ingress'] })
+    expect(html).toContain('Deny all ingress')
+    expect(html).not.toContain('policyTypes not set')
+  })
+
+  it('renders both selectors of a peer that sets podSelector and namespaceSelector', () => {
+    const html = render({
+      podSelector: { matchLabels: { app: 'prometheus' } },
+      policyTypes: ['Ingress'],
+      ingress: [{
+        from: [{
+          podSelector: { matchLabels: { app: 'radar' } },
+          namespaceSelector: { matchLabels: { 'kubernetes.io/metadata.name': 'radar' } },
+        }],
+      }],
+    })
+    expect(html).toContain('podSelector')
+    expect(html).toContain('in namespaceSelector')
+    expect(html).toContain('kubernetes.io/metadata.name')
+  })
+
+  it('renders matchExpressions rather than calling the selector empty', () => {
+    const html = render({
+      podSelector: { matchExpressions: [{ key: 'tier', operator: 'In', values: ['web', 'api'] }] },
+      policyTypes: ['Ingress'],
+      ingress: [{ from: [{ podSelector: { matchExpressions: [{ key: 'role', operator: 'Exists' }] } }] }],
+    })
+    expect(html).toContain('tier')
+    expect(html).toContain('In')
+    expect(html).toContain('role')
+    expect(html).not.toContain('All pods in namespace')
+  })
+
+  it('renders endPort ranges in the rule port list', () => {
+    const html = render({
+      podSelector: {},
+      policyTypes: ['Ingress'],
+      ingress: [{ ports: [{ port: 9000, endPort: 9100 }, { protocol: 'UDP', port: 53 }] }],
+    })
+    expect(html).toContain('TCP/9000-9100')
+    expect(html).toContain('UDP/53')
+  })
+
+  it('diagram: reads matchExpressions, shows ranges, and treats an empty selector as all pods', () => {
+    const html = renderDiagram({
+      podSelector: { matchExpressions: [{ key: 'tier', operator: 'In', values: ['web'] }] },
+      ingress: [{ ports: [{ port: 9000, endPort: 9100 }] }],
+    })
+    expect(html).toContain('tier In (web)')
+    expect(html).toContain('TCP/9000-9100')
+    expect(html).not.toContain('All pods')
+
+    const empty = renderDiagram({ podSelector: {} })
+    expect(empty).toContain('All pods')
+    expect(empty).not.toContain('all workloads')
+  })
+})

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

@@ -2,6 +2,7 @@ import { Shield, ArrowDownToLine, ArrowUpFromLine, GitFork } from 'lucide-react'
 import { clsx } from 'clsx'
 import { Section, LabelSelectorDisplay } from '../../ui/drawer-components'
 import { NetworkPolicyDiagram } from './NetworkPolicyDiagram'
+import { effectivePolicyTypeNames, effectivePolicyTypes, formatNetworkPolicyPort } from '../../../utils/network-policy'
 
 interface NetworkPolicyRendererProps {
   data: any
@@ -11,12 +12,13 @@ interface NetworkPolicyRendererProps {
 export function NetworkPolicyRenderer({ data, staged = false }: NetworkPolicyRendererProps) {
   const spec = data.spec || {}
   const podSelector = spec.podSelector || {}
-  const policyTypes: string[] = spec.policyTypes || []
   const ingress: any[] | undefined = spec.ingress
   const egress: any[] | undefined = spec.egress
 
-  const hasIngress = policyTypes.includes('Ingress')
-  const hasEgress = policyTypes.includes('Egress')
+  const types = effectivePolicyTypes(spec)
+  const policyTypes = effectivePolicyTypeNames(spec)
+  const hasIngress = types.ingress
+  const hasEgress = types.egress
 
   const hasDiagramContent = hasIngress || hasEgress
 
@@ -33,26 +35,29 @@ export function NetworkPolicyRenderer({ data, staged = false }: NetworkPolicyRen
           <div className="text-xs text-theme-text-tertiary mb-1">Pod Selector</div>
           <LabelSelectorDisplay selector={podSelector} emptyText="All pods in namespace" />
         </div>
-        {policyTypes.length > 0 && (
-          <div className="mt-2">
-            <div className="text-xs text-theme-text-tertiary mb-1">Policy Types</div>
-            <div className="flex flex-wrap gap-1">
-              {policyTypes.map((type) => (
-                <span
-                  key={type}
-                  className={clsx(
-                    'badge',
-                    type === 'Ingress'
-                      ? 'status-blue'
-                      : 'status-purple'
-                  )}
-                >
-                  {type}
-                </span>
-              ))}
-            </div>
+        <div className="mt-2">
+          <div className="text-xs text-theme-text-tertiary mb-1">Policy Types</div>
+          <div className="flex flex-wrap items-center gap-1">
+            {policyTypes.map((type) => (
+              <span
+                key={type}
+                className={clsx(
+                  'badge',
+                  type === 'Ingress'
+                    ? 'status-blue'
+                    : 'status-purple'
+                )}
+              >
+                {type}
+              </span>
+            ))}
+            {!types.explicit && (
+              <span className="text-xs text-theme-text-tertiary">
+                by default — policyTypes not set
+              </span>
+            )}
           </div>
-        )}
+        </div>
       </Section>
 
       {hasIngress && (
@@ -118,7 +123,7 @@ function IngressEgressRuleCard({
                 key={j}
                 className="badge bg-theme-elevated text-theme-text-secondary"
               >
-                {port.protocol || 'TCP'}/{port.port}
+                {formatNetworkPolicyPort(port)}
               </span>
             ))}
           </div>
@@ -135,20 +140,29 @@ function IngressEgressRuleCard({
 }
 
 function PeerEntry({ peer }: { peer: any }) {
-  if (peer.podSelector) {
+  // podSelector and namespaceSelector on one peer are ANDed: the peer is the
+  // pods matching the first inside the namespaces matching the second. Both
+  // have to be shown, or a narrow cross-namespace grant reads as a broad
+  // same-namespace one.
+  const hasPod = peer.podSelector !== undefined
+  const hasNs = peer.namespaceSelector !== undefined
+  if (hasPod || hasNs) {
     return (
-      <div className="text-sm">
-        <span className="text-theme-text-secondary text-xs">podSelector: </span>
-        <LabelSelectorDisplay selector={peer.podSelector} emptyText="all pods" inline />
-      </div>
-    )
-  }
-
-  if (peer.namespaceSelector) {
-    return (
-      <div className="text-sm">
-        <span className="text-theme-text-secondary text-xs">namespaceSelector: </span>
-        <LabelSelectorDisplay selector={peer.namespaceSelector} emptyText="all namespaces" inline />
+      <div className="text-sm space-y-0.5">
+        {hasPod && (
+          <div>
+            <span className="text-theme-text-secondary text-xs">podSelector: </span>
+            <LabelSelectorDisplay selector={peer.podSelector} emptyText="all pods" inline />
+          </div>
+        )}
+        {hasNs && (
+          <div>
+            <span className="text-theme-text-secondary text-xs">
+              {hasPod ? 'in namespaceSelector: ' : 'namespaceSelector: '}
+            </span>
+            <LabelSelectorDisplay selector={peer.namespaceSelector} emptyText="all namespaces" inline />
+          </div>
+        )}
       </div>
     )
   }

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

@@ -14,6 +14,7 @@ import {
 import { resolvedEnvFromKey } from '../../../utils/env-from'
 import { detectBlastRadius, rulePermissivenessScore } from '../../../utils/rbac-blast-radius'
 import { RBACErrorSection, isRBACUnavailable } from './RBACErrorSection'
+import { NamespaceLimitRangeLink } from './LimitRangeRenderer'
 import type {
   PodEnvironmentResponse,
   PodEnvironmentRevealResponse,
@@ -114,6 +115,9 @@ interface PodRendererProps {
   policyData?: PolicyResourceResponse | null
   policyLoading?: boolean
   policyError?: Error | null
+  /** Names of the LimitRanges in this Pod's namespace. Absent while the lookup
+   *  is pending or unreadable, which leaves the contextual link unrendered. */
+  namespaceLimitRangeNames?: string[] | null
 }
 
 // ── Env vars section — extracted to use hooks (useState for reveal) ──────────
@@ -296,6 +300,7 @@ export function PodRenderer({
   policyData,
   policyLoading,
   policyError,
+  namespaceLimitRangeNames,
 }: PodRendererProps) {
   const containerStatuses = data.status?.containerStatuses || []
   const containers = data.spec?.containers || []
@@ -763,6 +768,12 @@ export function PodRenderer({
             )
           })}
         </div>
+        <NamespaceLimitRangeLink
+          namespace={namespace || ''}
+          names={namespaceLimitRangeNames}
+          scope="pod"
+          onNavigate={onNavigate}
+        />
       </Section>
 
       {/* Environment Variables */}