@skyhook-io/k8s-ui 1.3.2 → 1.4.0

package/src/components/workload/WorkloadView.tsx

@@ -121,6 +121,12 @@ interface WorkloadViewProps {
   renderMetricsTab?: (props: { kind: string; namespace: string; name: string }) => ReactNode
   /** Whether metrics are available for this resource kind */
   isMetricsAvailable?: (kind: string, resource: any) => boolean
+  /** Render extra content at the bottom of the overview tab (e.g. audit findings) */
+  renderOverviewExtra?: (props: { kind: string; namespace: string; name: string }) => ReactNode
+
+  // ── Duplicate ────────────────────────────────────────────────────────────
+  /** Duplicate handler — opens create dialog with this resource's YAML */
+  onDuplicate?: (params: { kind: string; namespace: string; name: string; yaml: string }) => void
 
   // ── ResourceActionsBar props (passed through) ────────────────────────────
   /** All props for the actions bar (forwarded as-is) */
@@ -166,6 +172,9 @@ export function WorkloadView({
   renderLogsTab,
   renderMetricsTab,
   isMetricsAvailable,
+  // Duplicate
+  onDuplicate,
+  renderOverviewExtra,
   // Actions bar
   actionsBarProps,
   // Renderer overrides
@@ -430,22 +439,30 @@ export function WorkloadView({
               onSave={onUpdateResource}
               isSaving={isUpdatingResource}
               saveError={updateResourceError}
+              onDuplicate={onDuplicate}
             />
           ) : (
-            <ResourceRendererDispatch
-              resource={selectedResource}
-              data={resource}
-              relationships={relationships}
-              certificateInfo={certificateInfo}
-              onCopy={copyToClipboard}
-              copied={copied}
-              onNavigate={onNavigateToResource ? (ref) => onNavigateToResource(refToSelectedResource(ref)) : undefined}
-              onSaveSecretValue={canUpdateSecrets ? handleSaveSecretValue : undefined}
-              isSavingSecret={isUpdatingResource}
-              rendererOverrides={rendererOverrides}
-              resolvedEnvFrom={resolvedEnvFrom}
-              renderMetrics={renderMetricsTab}
-            />
+            <>
+              <ResourceRendererDispatch
+                resource={selectedResource}
+                data={resource}
+                relationships={relationships}
+                certificateInfo={certificateInfo}
+                onCopy={copyToClipboard}
+                copied={copied}
+                onNavigate={onNavigateToResource ? (ref) => onNavigateToResource(refToSelectedResource(ref)) : undefined}
+                onSaveSecretValue={canUpdateSecrets ? handleSaveSecretValue : undefined}
+                isSavingSecret={isUpdatingResource}
+                rendererOverrides={rendererOverrides}
+                resolvedEnvFrom={resolvedEnvFrom}
+                renderMetrics={renderMetricsTab}
+              />
+              {renderOverviewExtra && (
+                <div className="px-4 pb-4">
+                  {renderOverviewExtra({ kind, namespace, name })}
+                </div>
+              )}
+            </>
           )}
         </div>
       </div>
@@ -571,21 +588,22 @@ export function WorkloadView({
       {/* Tab Content */}
       <div className="flex-1 overflow-hidden relative">
         {activeTab === 'overview' && (
-          <InfoTab
-            resource={resource}
-            selectedResource={selectedResource}
-            relationships={relationships}
-            isLoading={resourceLoading}
-            onNavigate={onNavigateToResource}
-            onCopy={copyToClipboard}
-            copied={copied}
-            onSaveSecretValue={canUpdateSecrets ? handleSaveSecretValue : undefined}
-            isSavingSecret={isUpdatingResource}
-            onOpenLogs={handleOpenLogs}
-            onSwitchToTimeline={() => handleSetTab('timeline')}
-            rendererOverrides={rendererOverrides}
-            resolvedEnvFrom={resolvedEnvFrom}
-          />
+            <InfoTab
+              resource={resource}
+              selectedResource={selectedResource}
+              relationships={relationships}
+              isLoading={resourceLoading}
+              onNavigate={onNavigateToResource}
+              onCopy={copyToClipboard}
+              copied={copied}
+              onSaveSecretValue={canUpdateSecrets ? handleSaveSecretValue : undefined}
+              isSavingSecret={isUpdatingResource}
+              onOpenLogs={handleOpenLogs}
+              onSwitchToTimeline={() => handleSetTab('timeline')}
+              rendererOverrides={rendererOverrides}
+              resolvedEnvFrom={resolvedEnvFrom}
+              extraContent={renderOverviewExtra && renderOverviewExtra({ kind, namespace, name })}
+            />
         )}
         {activeTab === 'timeline' && (
           <EventsTab
@@ -635,6 +653,7 @@ export function WorkloadView({
                 onSave={onUpdateResource}
                 isSaving={isUpdatingResource}
                 saveError={updateResourceError}
+                onDuplicate={onDuplicate}
               />
             )}
           </div>
@@ -1068,6 +1087,7 @@ function InfoTab({
   onSwitchToTimeline,
   rendererOverrides,
   resolvedEnvFrom,
+  extraContent,
 }: {
   resource: any
   selectedResource: SelectedResource
@@ -1082,6 +1102,7 @@ function InfoTab({
   onSwitchToTimeline?: () => void
   rendererOverrides?: RendererOverrides
   resolvedEnvFrom?: ResolvedEnvFrom
+  extraContent?: ReactNode
 }) {
   if (isLoading) {
     return (
@@ -1132,6 +1153,11 @@ function InfoTab({
           </div>
         )}
       />
+      {extraContent && (
+        <div className="px-4 pb-4">
+          {extraContent}
+        </div>
+      )}
     </div>
   )
 }

package/src/index.ts

@@ -33,3 +33,6 @@ export * from './components/dock'
 
 // Topology (TopologyGraph, TopologySearch, TopologyFilterSidebar, layout utilities)
 export * from './components/topology'
+
+// Cluster audit (AuditCard, AuditAlerts, AuditFindingsTable)
+export * from './components/audit'

package/src/types/core.ts

@@ -145,6 +145,7 @@ export interface TopologyEdge {
   type: EdgeType
   label?: string
   skipIfKindVisible?: string // Hide this edge if this kind is visible (for shortcut edges)
+  policyEffect?: 'allowed' | 'blocked' | 'unprotected'
 }
 
 export interface Topology {
@@ -846,7 +847,7 @@ export interface TrafficFilters {
 }
 
 // Main view type now includes 'traffic' and 'cost'
-export type ExtendedMainView = MainView | 'traffic' | 'cost'
+export type ExtendedMainView = MainView | 'traffic' | 'cost' | 'audit'
 
 // ============================================================================
 // Image Filesystem Types

package/src/utils/badge-colors.ts

@@ -52,6 +52,13 @@ export const HELM_STATUS_COLORS: Record<string, string> = {
   uninstalled: BADGE_SEVERITY_COLORS.neutral,
 }
 
+// Best practices category colors
+export const BP_CATEGORY_BADGE: Record<string, string> = {
+  Security: 'bg-purple-50 text-purple-700 border-purple-200 dark:bg-purple-950/40 dark:text-purple-400 dark:border-purple-800/40',
+  Reliability: 'bg-sky-50 text-sky-700 border-sky-200 dark:bg-sky-950/40 dark:text-sky-400 dark:border-sky-800/40',
+  Efficiency: 'bg-emerald-50 text-emerald-700 border-emerald-200 dark:bg-emerald-950/40 dark:text-emerald-400 dark:border-emerald-800/40',
+}
+
 // Default fallback color
 export const DEFAULT_BADGE_COLOR = 'bg-theme-elevated text-theme-text-secondary'
 

package/src/utils/index.ts

@@ -8,3 +8,5 @@ export * from './resource-hierarchy'
 export * from './log-format'
 export * from './download'
 export * from './api-resources'
+export * from './skeleton-yaml'
+export * from './k8s-errors'

package/src/utils/k8s-errors.ts

@@ -0,0 +1,142 @@
+// Human-friendly summaries for common Kubernetes API error patterns.
+// Falls back to null when no known pattern matches — caller shows raw error.
+
+interface FriendlyError {
+  summary: string
+  suggestion: string
+}
+
+const patterns: Array<{ test: (msg: string) => boolean; friendly: (msg: string) => FriendlyError }> = [
+  // Admission webhook timeout
+  {
+    test: (msg) => /failed calling webhook.*context deadline exceeded/i.test(msg),
+    friendly: (msg) => {
+      const webhook = msg.match(/webhook "([^"]+)"/)?.[1] ?? 'unknown'
+      const service = webhook.split('.')[0] || webhook
+      return {
+        summary: `Admission webhook timed out (${service})`,
+        suggestion: 'A cluster validation webhook failed to respond. This is usually a temporary cluster issue, not a problem with your YAML. Try again or contact your cluster admin.',
+      }
+    },
+  },
+  // Admission webhook rejected
+  {
+    test: (msg) => /admission webhook.*denied the request/i.test(msg),
+    friendly: (msg) => {
+      const webhook = msg.match(/webhook "([^"]+)"/)?.[1] ?? 'unknown'
+      return {
+        summary: `Rejected by admission policy (${webhook.split('.')[0]})`,
+        suggestion: 'A cluster admission webhook rejected this resource. Check that your YAML meets the cluster\'s policies, or contact your cluster admin.',
+      }
+    },
+  },
+  // Validation error — invalid field value
+  {
+    test: (msg) => /is invalid:.*Invalid value/i.test(msg),
+    friendly: (msg) => {
+      const fields = [...msg.matchAll(/(\S+): Invalid value/g)].map(m => m[1])
+      const fieldList = fields.length > 0 ? fields.join(', ') : 'unknown field'
+      return {
+        summary: `Validation failed: invalid value for ${fieldList}`,
+        suggestion: 'One or more field values don\'t match what Kubernetes expects. Check the highlighted fields in the error details.',
+      }
+    },
+  },
+  // Validation error — selector doesn't match labels
+  {
+    test: (msg) => /`selector` does not match template `labels`/i.test(msg),
+    friendly: () => ({
+      summary: 'Selector doesn\'t match template labels',
+      suggestion: 'The spec.selector.matchLabels must match spec.template.metadata.labels exactly.',
+    }),
+  },
+  // Validation error — required field
+  {
+    test: (msg) => /Required value|is required/i.test(msg),
+    friendly: (msg) => {
+      const field = msg.match(/(\S+): Required value/)?.[1] ?? msg.match(/(\S+) is required/)?.[1] ?? ''
+      return {
+        summary: `Missing required field${field ? `: ${field}` : ''}`,
+        suggestion: 'Add the missing required field to your YAML.',
+      }
+    },
+  },
+  // RBAC forbidden — use "is forbidden:" to avoid matching "Forbidden: field is immutable" or "forbidden: exceeded quota"
+  {
+    test: (msg) => /is forbidden:|cannot .* in the namespace/i.test(msg),
+    friendly: (msg) => {
+      const verb = msg.match(/cannot (\w+)/)?.[1] ?? 'perform this action on'
+      return {
+        summary: `Permission denied`,
+        suggestion: `Your cluster role doesn't allow you to ${verb} this resource. Contact your cluster admin for access.`,
+      }
+    },
+  },
+  // Already exists (create mode)
+  {
+    test: (msg) => /already exists/i.test(msg),
+    friendly: () => ({
+      summary: 'Resource already exists',
+      suggestion: 'Switch to Apply mode to update the existing resource, or change the name to create a new one.',
+    }),
+  },
+  // Quota exceeded
+  {
+    test: (msg) => /exceeded quota|quota.*exceeded|forbidden.*quota/i.test(msg),
+    friendly: () => ({
+      summary: 'Resource quota exceeded',
+      suggestion: 'The namespace has reached its resource quota limit. Request a quota increase or reduce resource requests.',
+    }),
+  },
+  // Namespace not found
+  {
+    test: (msg) => /namespace.*not found|namespaces.*not found/i.test(msg),
+    friendly: (msg) => {
+      const ns = msg.match(/namespace[s]? "([^"]+)"/)?.[1] ?? ''
+      return {
+        summary: `Namespace "${ns}" not found`,
+        suggestion: 'Create the namespace first or change the namespace in your YAML.',
+      }
+    },
+  },
+  // Immutable field
+  {
+    test: (msg) => /field is immutable/i.test(msg),
+    friendly: () => ({
+      summary: 'Cannot change immutable field',
+      suggestion: 'Some fields can\'t be modified after creation. Delete and recreate the resource, or remove the immutable field change.',
+    }),
+  },
+  // Connection refused / cluster unreachable
+  {
+    test: (msg) => /connection refused|no such host|cluster.*unreachable/i.test(msg),
+    friendly: () => ({
+      summary: 'Cannot reach the cluster',
+      suggestion: 'The Kubernetes API server is unreachable. Check your cluster connection.',
+    }),
+  },
+]
+
+// Strip the "failed to apply resource: " / "failed to create resource: " prefix our backend adds
+function stripPrefix(msg: string): string {
+  return msg.replace(/^failed to (apply|create) resource:\s*/i, '')
+}
+
+export function getFriendlyError(rawError: string): { summary: string; suggestion: string; raw: string } | null {
+  const cleaned = stripPrefix(rawError)
+  for (const pattern of patterns) {
+    if (pattern.test(cleaned)) {
+      const { summary, suggestion } = pattern.friendly(cleaned)
+      return { summary, suggestion, raw: cleaned }
+    }
+  }
+  return null
+}
+
+// Always returns something displayable — friendly if matched, raw if not
+export function formatApplyError(rawError: string): { summary: string; suggestion?: string; raw: string } {
+  const friendly = getFriendlyError(rawError)
+  if (friendly) return friendly
+  const cleaned = stripPrefix(rawError)
+  return { summary: cleaned, raw: rawError }
+}

package/src/utils/resource-icons.ts

@@ -80,6 +80,9 @@ const KIND_ICON_MAP: Record<string, LucideIcon> = {
   service: Plug,
   ingress: DoorOpen,
   networkpolicy: ShieldCheck,
+  ciliumnetworkpolicy: ShieldCheck,
+  ciliumclusterwidenetworkpolicy: ShieldCheck,
+  clusternetworkpolicy: ShieldCheck,
   endpoints: Radio,
   endpointslice: Radio,
   gateway: DoorOpen,

package/src/utils/skeleton-yaml.ts

@@ -0,0 +1,302 @@
+// Skeleton YAML templates for common Kubernetes resource kinds.
+// Used by the Create Resource dialog to pre-fill the editor.
+
+const skeletons: Record<string, string> = {
+  Pod: `apiVersion: v1
+kind: Pod
+metadata:
+  name: my-pod
+  namespace: default
+spec:
+  containers:
+    - name: app
+      image: nginx:latest
+      ports:
+        - containerPort: 80`,
+
+  Deployment: `apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: my-deployment
+  namespace: default
+spec:
+  replicas: 1
+  selector:
+    matchLabels:
+      app: my-deployment
+  template:
+    metadata:
+      labels:
+        app: my-deployment
+    spec:
+      containers:
+        - name: app
+          image: nginx:latest
+          ports:
+            - containerPort: 80`,
+
+  Service: `apiVersion: v1
+kind: Service
+metadata:
+  name: my-service
+  namespace: default
+spec:
+  selector:
+    app: my-app
+  ports:
+    - port: 80
+      targetPort: 80
+  type: ClusterIP`,
+
+  ConfigMap: `apiVersion: v1
+kind: ConfigMap
+metadata:
+  name: my-configmap
+  namespace: default
+data:
+  key: value`,
+
+  Secret: `apiVersion: v1
+kind: Secret
+metadata:
+  name: my-secret
+  namespace: default
+type: Opaque
+stringData:
+  key: value`,
+
+  Namespace: `apiVersion: v1
+kind: Namespace
+metadata:
+  name: my-namespace`,
+
+  Job: `apiVersion: batch/v1
+kind: Job
+metadata:
+  name: my-job
+  namespace: default
+spec:
+  template:
+    spec:
+      containers:
+        - name: job
+          image: busybox:latest
+          command: ["echo", "hello"]
+      restartPolicy: Never
+  backoffLimit: 3`,
+
+  CronJob: `apiVersion: batch/v1
+kind: CronJob
+metadata:
+  name: my-cronjob
+  namespace: default
+spec:
+  schedule: "*/5 * * * *"
+  jobTemplate:
+    spec:
+      template:
+        spec:
+          containers:
+            - name: job
+              image: busybox:latest
+              command: ["echo", "hello"]
+          restartPolicy: Never`,
+
+  Ingress: `apiVersion: networking.k8s.io/v1
+kind: Ingress
+metadata:
+  name: my-ingress
+  namespace: default
+spec:
+  rules:
+    - host: example.com
+      http:
+        paths:
+          - path: /
+            pathType: Prefix
+            backend:
+              service:
+                name: my-service
+                port:
+                  number: 80`,
+
+  PersistentVolumeClaim: `apiVersion: v1
+kind: PersistentVolumeClaim
+metadata:
+  name: my-pvc
+  namespace: default
+spec:
+  accessModes:
+    - ReadWriteOnce
+  resources:
+    requests:
+      storage: 1Gi`,
+
+  ServiceAccount: `apiVersion: v1
+kind: ServiceAccount
+metadata:
+  name: my-service-account
+  namespace: default`,
+
+  StatefulSet: `apiVersion: apps/v1
+kind: StatefulSet
+metadata:
+  name: my-statefulset
+  namespace: default
+spec:
+  replicas: 1
+  selector:
+    matchLabels:
+      app: my-statefulset
+  serviceName: my-statefulset
+  template:
+    metadata:
+      labels:
+        app: my-statefulset
+    spec:
+      containers:
+        - name: app
+          image: nginx:latest
+          ports:
+            - containerPort: 80`,
+
+  DaemonSet: `apiVersion: apps/v1
+kind: DaemonSet
+metadata:
+  name: my-daemonset
+  namespace: default
+spec:
+  selector:
+    matchLabels:
+      app: my-daemonset
+  template:
+    metadata:
+      labels:
+        app: my-daemonset
+    spec:
+      containers:
+        - name: app
+          image: nginx:latest`,
+}
+
+// Returns skeleton YAML for a known kind, or a generic template for unknown kinds.
+export function getSkeletonYaml(kind: string, group?: string): string {
+  const skeleton = skeletons[kind]
+  if (skeleton) return skeleton
+
+  // For unknown/CRD kinds, provide a minimal template
+  let apiVersion = 'v1'
+  if (group) {
+    apiVersion = `${group}/v1`
+  }
+
+  return `apiVersion: ${apiVersion}
+kind: ${kind}
+metadata:
+  name: my-${kind.toLowerCase()}
+  namespace: default`
+}
+
+// Strips cluster-managed metadata from a resource YAML for duplication.
+export function cleanYamlForDuplicate(yamlContent: string): string {
+  const lines = yamlContent.split('\n')
+  const result: string[] = []
+  let skipUntilDedent = false
+  let skipIndent = 0
+
+  const stripTopLevelKeys = new Set([
+    'status:',
+  ])
+
+  const stripMetadataKeys = new Set([
+    'resourceVersion:',
+    'uid:',
+    'creationTimestamp:',
+    'generation:',
+    'managedFields:',
+    'selfLink:',
+  ])
+
+  const stripAnnotationKeys = [
+    'kubectl.kubernetes.io/last-applied-configuration:',
+  ]
+
+  let inMetadata = false
+  let inAnnotations = false
+  let metadataIndent = 0
+  let annotationsIndent = 0
+
+  for (const line of lines) {
+    const trimmed = line.trimStart()
+    const indent = line.length - trimmed.length
+
+    // Handle skip mode (for multi-line values like managedFields or status)
+    if (skipUntilDedent) {
+      if (indent > skipIndent || trimmed === '' || trimmed.startsWith('-')) {
+        continue
+      }
+      skipUntilDedent = false
+    }
+
+    // Track metadata section
+    if (trimmed === 'metadata:') {
+      inMetadata = true
+      metadataIndent = indent
+      result.push(line)
+      continue
+    }
+
+    if (inMetadata && indent <= metadataIndent && trimmed !== '' && trimmed !== 'metadata:') {
+      inMetadata = false
+      inAnnotations = false
+    }
+
+    // Track annotations within metadata
+    if (inMetadata && trimmed === 'annotations:') {
+      inAnnotations = true
+      annotationsIndent = indent
+      result.push(line)
+      continue
+    }
+
+    if (inAnnotations && indent <= annotationsIndent && trimmed !== '' && trimmed !== 'annotations:') {
+      inAnnotations = false
+    }
+
+    // Strip top-level keys (status)
+    if (indent === 0 && stripTopLevelKeys.has(trimmed.split(' ')[0])) {
+      skipUntilDedent = true
+      skipIndent = indent
+      continue
+    }
+
+    // Strip metadata keys
+    if (inMetadata && !inAnnotations) {
+      const key = trimmed.split(' ')[0]
+      if (stripMetadataKeys.has(key)) {
+        if (key === 'managedFields:') {
+          skipUntilDedent = true
+          skipIndent = indent
+        }
+        continue
+      }
+      // Clear the name value (user needs to provide a new one)
+      if (trimmed.startsWith('name:')) {
+        result.push(line.replace(/name:.*/, 'name: '))
+        continue
+      }
+    }
+
+    // Strip specific annotations
+    if (inAnnotations) {
+      const shouldStrip = stripAnnotationKeys.some(key => trimmed.startsWith(key))
+      if (shouldStrip) {
+        continue
+      }
+    }
+
+    result.push(line)
+  }
+
+  return result.join('\n')
+}