openk8s 1.0.4 → 1.1.0

package/src/app/hooks/keyboard/shell-edit-handlers.ts

@@ -3,8 +3,10 @@ import { spawn } from "node:child_process";
 
 import type { AppAction } from "../../app-actions";
 import type { AppState, ResourceRef, ResourceKind, ResourceDetail, NotificationTone } from "../../../lib/k8s/types";
+import { isHelmRelease } from "../../../lib/kubectl/kubectl-helpers";
 import { statusLine } from "../../utils";
 import { KubectlService } from "../../../lib/kubectl/kubectl-service";
+import type { ToastOptions } from "../use-notifications";
 
 export function handleShellKeys(
   key: { name: string; shift?: boolean },
@@ -14,13 +16,13 @@ export function handleShellKeys(
   activeResourceRef: ResourceRef | undefined,
   selectedKind: ResourceKind | undefined,
   kubectl: KubectlService,
-  toastError: (error: unknown) => void,
+  toastError: (error: unknown, options?: ToastOptions) => void,
   setManualRefreshNonce: React.Dispatch<React.SetStateAction<number>>,
 ): boolean {
   if (state.overlay) return false;
 
   if (key.name === "x" && activeResourceRef && selectedKind && state.activeContext) {
-    if (activeResourceRef.kind.toLowerCase() === "helmreleases") {
+    if (isHelmRelease(activeResourceRef)) {
       dispatch({ type: "setStatusMessage", message: "Shell not supported for Helm releases" });
       return true;
     }
@@ -35,10 +37,22 @@ export function handleShellKeys(
     const target = activeResourceRef;
 
     const child = kubectl.startShell({ context, namespace, resourceRef: target, namespaced });
-    child.on("close", () => {
+
+    let stderrBuffer = "";
+    child.stderr?.on("data", (chunk: Buffer) => {
+      stderrBuffer += chunk.toString();
+    });
+
+    child.on("close", (code) => {
       renderer.resume();
       dispatch({ type: "setError", error: undefined });
-      dispatch({ type: "setStatusMessage", message: `Returned from shell in ${statusLine({ ref: target })}` });
+      if (code === 0) {
+        dispatch({ type: "setStatusMessage", message: `Returned from shell in ${statusLine({ ref: target })}` });
+      } else {
+        const msg = stderrBuffer.trim() || `Shell exited with code ${code}`;
+        toastError(new Error(msg));
+        dispatch({ type: "setStatusMessage", message: `Shell failed for ${statusLine({ ref: target })}` });
+      }
       setManualRefreshNonce((current) => current + 1);
     });
     child.on("error", (error) => {
@@ -61,8 +75,8 @@ export function handleEditKeys(
   selectedKind: ResourceKind | undefined,
   activeDetail: ResourceDetail | undefined,
   kubectl: KubectlService,
-  toast: (tone: NotificationTone, message: string) => void,
-  toastError: (error: unknown) => void,
+  toast: (tone: NotificationTone, message: string, options?: ToastOptions) => void,
+  toastError: (error: unknown, options?: ToastOptions) => void,
   setManualRefreshNonce: React.Dispatch<React.SetStateAction<number>>,
 ): boolean {
   if (state.overlay) return false;
@@ -72,7 +86,7 @@ export function handleEditKeys(
     const namespace = state.activeNamespace;
     const namespaced = selectedKind.namespaced;
     const target = activeResourceRef;
-    const isHelm = target.kind.toLowerCase() === "helmreleases";
+    const isHelm = isHelmRelease(target);
 
     if (isHelm) {
       const chartName = activeDetail?.helmChart ?? "";
@@ -99,7 +113,10 @@ export function handleEditKeys(
       const editor = process.env.EDITOR ?? process.env.VISUAL ?? "vi";
       const editorChild = spawn(editor, [tmpPath], { env: process.env, stdio: "inherit" });
 
-      editorChild.on("close", (code) => {
+      let editHandled = false;
+      const finishEdit = (code: number | null): void => {
+        if (editHandled) return;
+        editHandled = true;
         if (code === 0) {
           kubectl
             .helmUpgradeValues({ context, namespace, name: target.name, chart: chartName, valuesFile: tmpPath })
@@ -118,9 +135,15 @@ export function handleEditKeys(
           dispatch({ type: "setStatusMessage", message: "Edit cancelled" });
           cleanupTmp();
         }
+      };
+
+      editorChild.on("close", (code) => {
+        finishEdit(code);
       });
 
       editorChild.on("error", (err) => {
+        if (editHandled) return;
+        editHandled = true;
         renderer.resume();
         toastError(err);
         cleanupTmp();
@@ -132,7 +155,10 @@ export function handleEditKeys(
 
       const editChild = kubectl.editResource({ context, namespace, resourceRef: target, namespaced });
 
+      let editClosed = false;
       editChild.on("close", (code) => {
+        if (editClosed) return;
+        editClosed = true;
         renderer.resume();
         if (code === 0) {
           dispatch({ type: "setStatusMessage", message: `Saved ${statusLine({ ref: target })}` });
@@ -143,6 +169,8 @@ export function handleEditKeys(
       });
 
       editChild.on("error", (err) => {
+        if (editClosed) return;
+        editClosed = true;
         renderer.resume();
         toastError(err);
         dispatch({ type: "setStatusMessage", message: `Edit failed for ${statusLine({ ref: target })}` });
@@ -151,11 +179,6 @@ export function handleEditKeys(
     return true;
   }
 
-  // Shift+S → scale dialog
-  if (key.shift && key.name === "s" && activeResourceRef && selectedKind && state.activeContext && kubectl.canScale(activeResourceRef)) {
-    return false; // handled by scale handler
-  }
-
   return false;
 }
 
@@ -167,11 +190,16 @@ export function handleScaleKeys(
   selectedKind: ResourceKind | undefined,
   scaleReplicasInput: string,
   kubectl: KubectlService,
-  toastError: (error: unknown) => void,
+  toastError: (error: unknown, options?: ToastOptions) => void,
   setManualRefreshNonce: React.Dispatch<React.SetStateAction<number>>,
 ): boolean {
   if (state.overlay !== "scale") return false;
 
+  if (key.name === "escape") {
+    dispatch({ type: "setOverlay", overlay: undefined });
+    return true;
+  }
+
   if (key.name === "return" && activeResourceRef && selectedKind && state.activeContext) {
     const replicas = Number.parseInt(scaleReplicasInput, 10);
 
@@ -195,7 +223,7 @@ export function handleScaleKeys(
           setManualRefreshNonce((current) => current + 1);
         })
         .catch((error: unknown) => {
-          toastError(error);
+          toastError(error, { actions: [{ label: "retry", onAction: () => { void kubectl.scaleResource({ context, namespace, resourceRef: target, namespaced, replicas }).then(() => setManualRefreshNonce((c) => c + 1)).catch(toastError); } }] });
           dispatch({
             type: "setStatusMessage",
             message: `Scale failed for ${statusLine({ ref: target })}`,
@@ -215,7 +243,7 @@ export function handleRolloutRestartKeys(
   activeResourceRef: ResourceRef | undefined,
   selectedKind: ResourceKind | undefined,
   kubectl: KubectlService,
-  toastError: (error: unknown) => void,
+  toastError: (error: unknown, options?: ToastOptions) => void,
   setManualRefreshNonce: React.Dispatch<React.SetStateAction<number>>,
 ): boolean {
   if (state.overlay) return false;
@@ -237,7 +265,7 @@ export function handleRolloutRestartKeys(
           setManualRefreshNonce((current) => current + 1);
         })
         .catch((error: unknown) => {
-          toastError(error);
+          toastError(error, { actions: [{ label: "retry", onAction: () => { void kubectl.rolloutRestart({ context, namespace, resourceRef: target, namespaced }).then(() => setManualRefreshNonce((c) => c + 1)).catch(toastError); } }] });
           dispatch({
             type: "setStatusMessage",
             message: `Rollout restart failed for ${statusLine({ ref: target })}`,

package/src/app/hooks/use-app-keyboard.ts

@@ -7,6 +7,7 @@ import type { AppState } from "../../lib/k8s/types";
 import type { ActivePortForward, NotificationTone, ResourceDetail, ResourceKind, ResourceListItem, ResourceRef } from "../../lib/k8s/types";
 import type { LogsDialogActions } from "../components/overlays";
 import type { StartPortForwardLifecycleOptions } from "../utils";
+import type { ToastOptions } from "./use-notifications";
 import { KubectlService } from "../../lib/kubectl/kubectl-service";
 
 import { handleCtrlC } from "./keyboard/global-handlers";
@@ -54,8 +55,8 @@ export function useAppKeyboard(
   stopPortForward: (id: string) => void,
   startPortForward: (options: StartPortForwardLifecycleOptions) => void,
   openPortForwardOverlay: () => void,
-  toast: (tone: NotificationTone, message: string) => void,
-  toastError: (error: unknown) => void,
+  toast: (tone: NotificationTone, message: string, options?: ToastOptions) => void,
+  toastError: (error: unknown, options?: ToastOptions) => void,
   copyToClipboard: (text: string, label?: string) => void,
   handleToggleReveal: (id: string) => void,
   logsScrollRef: React.MutableRefObject<ScrollBoxRenderable | null>,
@@ -115,6 +116,25 @@ export function useAppKeyboard(
         if (handleContainerPicker(key, state, dispatch, overlayIndex, activeDetail?.containers)) return;
       }
 
+      if (state.overlay === "notification-history") {
+        if (key.name === "c" && !key.shift) {
+          dispatch({ type: "clearNotificationHistory" });
+          return;
+        }
+      }
+
+      if (state.overlay === "port-forward-list") {
+        if (key.name === "x" && !key.shift) {
+          const forward = state.activePortForwards[overlayIndex];
+          if (forward) stopPortForward(forward.id);
+          return;
+        }
+        if (key.name === "c" && !key.shift) {
+          for (const f of state.activePortForwards) stopPortForward(f.id);
+          return;
+        }
+      }
+
       return;
     }
 

package/src/app/hooks/use-app-side-effects.ts

@@ -5,25 +5,21 @@ import type { AppAction } from "../app-actions";
 import type { AppState } from "../../lib/k8s/types";
 import type { ResourceRef } from "../../lib/k8s/types";
 import { savePersistedState } from "../persistence";
+import { safeKill } from "../../lib/kubectl/spawn-utils";
 
 export function useAppSideEffects(
   state: AppState,
   dispatch: React.Dispatch<AppAction>,
   portForwardProcessesRef: React.MutableRefObject<Map<string, ChildProcess>>,
-  notificationTimersRef: React.MutableRefObject<Map<string, ReturnType<typeof setTimeout>>>,
   activeResourceRef: ResourceRef | undefined,
 ) {
-  // Kill all port-forward processes and cancel notification timers on unmount
+  // Kill all port-forward processes on unmount
   useEffect(() => {
     return () => {
       for (const child of portForwardProcessesRef.current.values()) {
-        child.kill("SIGINT");
+        safeKill(child, "SIGINT");
       }
       portForwardProcessesRef.current.clear();
-      for (const timer of notificationTimersRef.current.values()) {
-        clearTimeout(timer);
-      }
-      notificationTimersRef.current.clear();
     };
   }, []);
 
@@ -36,4 +32,11 @@ export function useAppSideEffects(
   useEffect(() => {
     dispatch({ type: "setLogsContainer", container: undefined });
   }, [activeResourceRef?.kind, activeResourceRef?.name, activeResourceRef?.namespace]);
+
+  // Close port-forward-list overlay when no forwards remain
+  useEffect(() => {
+    if (state.overlay === "port-forward-list" && state.activePortForwards.length === 0) {
+      dispatch({ type: "setOverlay", overlay: undefined });
+    }
+  }, [state.overlay, state.activePortForwards.length]);
 }

package/src/app/hooks/use-clipboard.ts

@@ -3,11 +3,11 @@ import { useCallback } from "react";
 
 import type { AppAction } from "../app-actions";
 import type { NotificationTone } from "../../lib/k8s/types";
-import { loadError } from "../utils";
+import type { ToastOptions } from "./use-notifications";
 
 export function useClipboard(
   dispatch: React.Dispatch<AppAction>,
-  toast: (tone: NotificationTone, message: string) => void,
+  toast: (tone: NotificationTone, message: string, options?: ToastOptions) => void,
 ) {
   const copyToClipboard = useCallback((text: string, label?: string): void => {
     let cmd: string;
@@ -16,12 +16,12 @@ export function useClipboard(
     if (process.env.WAYLAND_DISPLAY) {
       cmd = "wl-copy";
       args = [];
-    } else if (process.env.DISPLAY) {
-      cmd = "xclip";
-      args = ["-selection", "clipboard"];
     } else if (process.platform === "darwin") {
       cmd = "pbcopy";
       args = [];
+    } else if (process.env.DISPLAY) {
+      cmd = "xclip";
+      args = ["-selection", "clipboard"];
     } else {
       dispatch({ type: "setStatusMessage", message: "Clipboard not available on this platform" });
       return;
@@ -39,6 +39,8 @@ export function useClipboard(
       child.on("close", (code) => {
         if (code === 0) {
           toast("success", toastMessage);
+        } else {
+          dispatch({ type: "setStatusMessage", message: `Copy failed — is ${cmd} installed?` });
         }
       });
     } catch {
@@ -46,9 +48,5 @@ export function useClipboard(
     }
   }, [toast, dispatch]);
 
-  const toastError = useCallback((error: unknown): void => {
-    toast("danger", loadError(error).message);
-  }, [toast]);
-
-  return { copyToClipboard, toastError };
+  return { copyToClipboard };
 }

package/src/app/hooks/use-data-fetching.ts

@@ -183,7 +183,9 @@ export function useDataFetching(
     let cancelled = false;
 
     async function loadResources(): Promise<void> {
-      dispatch({ type: "setResourcesStatus", status: "loading" });
+      if (resourcesLengthRef.current === 0) {
+        dispatch({ type: "setResourcesStatus", status: "loading" });
+      }
 
       try {
         const resources = await kubectl.listResources({
@@ -335,23 +337,27 @@ export function useDataFetching(
 
   // Poll pod metrics when viewing pods (silent degradation on error)
   useEffect(() => {
+    let cancelled = false;
     const context = state.activeContext;
     if (!context || state.selectedKind !== "pods") return;
     void kubectl
       .getPodMetrics({ context, namespace: state.activeNamespace })
-      .then((metrics) => dispatch({ type: "setPodMetrics", metrics }))
+      .then((metrics) => { if (!cancelled) dispatch({ type: "setPodMetrics", metrics }); })
       .catch(() => {/* metrics-server absent — silent degradation */});
-  }, [state.activeContext, state.activeNamespace, state.selectedKind, metricsPollTick]);
+    return () => { cancelled = true; };
+  }, [state.activeContext, state.activeNamespace, state.selectedKind, metricsPollTick, manualRefreshNonce]);
 
   // Poll node metrics when viewing nodes (silent degradation on error)
   useEffect(() => {
+    let cancelled = false;
     const context = state.activeContext;
     if (!context || state.selectedKind !== "nodes") return;
     void kubectl
       .getNodeMetrics({ context })
-      .then((metrics) => dispatch({ type: "setNodeMetrics", metrics }))
+      .then((metrics) => { if (!cancelled) dispatch({ type: "setNodeMetrics", metrics }); })
       .catch(() => {/* metrics-server absent — silent degradation */});
-  }, [state.activeContext, state.selectedKind, metricsPollTick]);
+    return () => { cancelled = true; };
+  }, [state.activeContext, state.selectedKind, metricsPollTick, manualRefreshNonce]);
 
   return { resourcesLengthRef, selectedResourceNameRef, selectedResourceDetailRef, eventsLengthRef };
 }

package/src/app/hooks/use-log-stream.ts

@@ -5,6 +5,7 @@ import type { AppAction } from "../app-actions";
 import type { AppState, LoadStatus } from "../../lib/k8s/types";
 import { loadError } from "../utils";
 import { KubectlService } from "../../lib/kubectl/kubectl-service";
+import { stopPersistentProcess } from "../../lib/kubectl/spawn-utils";
 
 export function useLogStream(
   dispatch: React.Dispatch<AppAction>,
@@ -21,7 +22,7 @@ export function useLogStream(
 
     if (state.overlay !== "logs" || !context || !activeLogsTarget || !activeLogsRef || !activeLogsKey) {
       if (logStreamRef.current) {
-        logStreamRef.current.kill();
+        stopPersistentProcess(logStreamRef.current);
         logStreamRef.current = undefined;
       }
       return;
@@ -29,6 +30,7 @@ export function useLogStream(
 
     let cancelled = false;
     let flushTimer: ReturnType<typeof setTimeout> | undefined;
+    let errorSeen = false;
 
     try {
       const { target, child } = kubectl.streamLogs({
@@ -41,7 +43,7 @@ export function useLogStream(
       });
 
       if (logStreamRef.current) {
-        logStreamRef.current.kill();
+        stopPersistentProcess(logStreamRef.current);
       }
 
       logStreamRef.current = child;
@@ -76,6 +78,7 @@ export function useLogStream(
       child.stderr?.on("data", (chunk: Buffer | string) => {
         if (cancelled) return;
         buffer += chunk.toString();
+        errorSeen = true;
         scheduleFlush("error");
       });
 
@@ -85,7 +88,8 @@ export function useLogStream(
           clearTimeout(flushTimer);
           flushTimer = undefined;
         }
-        flush("ready");
+        // Preserve an error status if stderr produced output; only flush "ready" for clean exits.
+        flush(errorSeen ? "error" : "ready");
       });
     } catch (error) {
       const parsed = loadError(error);
@@ -103,7 +107,7 @@ export function useLogStream(
         clearTimeout(flushTimer);
       }
       if (logStreamRef.current) {
-        logStreamRef.current.kill();
+        stopPersistentProcess(logStreamRef.current);
         logStreamRef.current = undefined;
       }
     };

package/src/app/hooks/use-notifications.ts

@@ -0,0 +1,92 @@
+import { useCallback, useEffect, useRef } from "react";
+
+import type { AppAction } from "../app-actions";
+import type { NotificationAction, NotificationTone } from "../../lib/k8s/types";
+import { loadError } from "../utils";
+import { TOAST_DURATION_MS } from "../constants";
+
+export interface ToastAction {
+  label: string;
+  onAction: () => void;
+}
+
+export interface ToastOptions {
+  persistent?: boolean | undefined;
+  actions?: ToastAction[] | undefined;
+}
+
+export interface UseNotificationsResult {
+  toast: (tone: NotificationTone, message: string, options?: ToastOptions) => string;
+  toastError: (error: unknown, options?: ToastOptions) => string;
+  dismiss: (id: string) => void;
+  executeAction: (notificationId: string, actionId: string) => void;
+}
+
+export function useNotifications(dispatch: React.Dispatch<AppAction>): UseNotificationsResult {
+  const timersRef = useRef(new Map<string, ReturnType<typeof setTimeout>>());
+  const actionsRef = useRef(new Map<string, Map<string, () => void>>());
+
+  const clearTimer = useCallback((id: string): void => {
+    const timer = timersRef.current.get(id);
+    if (timer) {
+      clearTimeout(timer);
+      timersRef.current.delete(id);
+    }
+  }, []);
+
+  const dismiss = useCallback((id: string): void => {
+    clearTimer(id);
+    actionsRef.current.delete(id);
+    dispatch({ type: "dismissNotification", id });
+  }, [clearTimer, dispatch]);
+
+  const toast = useCallback((tone: NotificationTone, message: string, options?: ToastOptions): string => {
+    const id = `notif-${crypto.randomUUID()}`;
+    const persistent = options?.persistent ?? (tone === "danger");
+    const actions: NotificationAction[] = (options?.actions ?? []).map((a, i) => ({
+      id: `action-${i}`,
+      label: a.label,
+    }));
+
+    if (options?.actions && options.actions.length > 0) {
+      const actionMap = new Map<string, () => void>();
+      options.actions.forEach((a, i) => actionMap.set(`action-${i}`, a.onAction));
+      actionsRef.current.set(id, actionMap);
+    }
+
+    dispatch({
+      type: "pushNotification",
+      notification: { id, tone, message, persistent, createdAt: Date.now(), actions },
+    });
+
+    if (!persistent) {
+      const timer = setTimeout(() => dismiss(id), TOAST_DURATION_MS);
+      timersRef.current.set(id, timer);
+    }
+
+    return id;
+  }, [dispatch, dismiss]);
+
+  const toastError = useCallback((error: unknown, options?: ToastOptions): string => {
+    return toast("danger", loadError(error).message, options);
+  }, [toast]);
+
+  const executeAction = useCallback((notificationId: string, actionId: string): void => {
+    const actionMap = actionsRef.current.get(notificationId);
+    const callback = actionMap?.get(actionId);
+    if (callback) callback();
+    dismiss(notificationId);
+  }, [dismiss]);
+
+  useEffect(() => {
+    return () => {
+      for (const timer of timersRef.current.values()) {
+        clearTimeout(timer);
+      }
+      timersRef.current.clear();
+      actionsRef.current.clear();
+    };
+  }, []);
+
+  return { toast, toastError, dismiss, executeAction };
+}

package/src/app/hooks/use-port-forward.ts

@@ -6,11 +6,13 @@ import type { ActivePortForward, ResourceDetail, ResourceRef } from "../../lib/k
 import type { StartPortForwardLifecycleOptions } from "../utils";
 import { portForwardId, statusLine } from "../utils";
 import { KubectlService } from "../../lib/kubectl/kubectl-service";
+import { safeKill } from "../../lib/kubectl/spawn-utils";
+import type { ToastOptions } from "./use-notifications";
 
 export function usePortForward(
   dispatch: React.Dispatch<AppAction>,
   kubectl: KubectlService,
-  toastError: (error: unknown) => void,
+  toastError: (error: unknown, options?: ToastOptions) => void,
 ) {
   const portForwardProcessesRef = useRef(new Map<string, ChildProcess>());
 
@@ -22,7 +24,7 @@ export function usePortForward(
       return;
     }
 
-    child.kill("SIGINT");
+    safeKill(child, "SIGINT");
   };
 
   const openPortForwardOverlay = (
@@ -108,7 +110,21 @@ export function usePortForward(
     child.stdout?.on("data", handleOutput);
     child.stderr?.on("data", handleOutput);
 
+    let handled = false;
+    const reportFailure = (): void => {
+      if (handled) return;
+      handled = true;
+      portForwardProcessesRef.current.delete(id);
+      dispatch({ type: "removeActivePortForward", id });
+    };
+
     child.on("close", (code, signal) => {
+      if (handled) {
+        portForwardProcessesRef.current.delete(id);
+        dispatch({ type: "removeActivePortForward", id });
+        return;
+      }
+      handled = true;
       portForwardProcessesRef.current.delete(id);
       dispatch({ type: "removeActivePortForward", id });
 
@@ -135,8 +151,7 @@ export function usePortForward(
     });
 
     child.on("error", (error) => {
-      portForwardProcessesRef.current.delete(id);
-      dispatch({ type: "removeActivePortForward", id });
+      reportFailure();
       toastError(error);
       dispatch({
         type: "setStatusMessage",

package/src/app/persistence.ts

@@ -1,4 +1,5 @@
 import { readFileSync, mkdirSync, writeFileSync } from "node:fs";
+import { homedir } from "node:os";
 import { join, dirname } from "node:path";
 
 export interface PersistedAppState {
@@ -7,7 +8,7 @@ export interface PersistedAppState {
 }
 
 function configPath(): string {
-  const home = process.env.HOME ?? process.env.USERPROFILE ?? ".";
+  const home = process.env.HOME ?? process.env.USERPROFILE ?? homedir();
   return join(home, ".config", "openk8s", "state.json");
 }
 
@@ -23,9 +24,12 @@ export function loadPersistedState(): PersistedAppState {
 
     const data = parsed as Record<string, unknown>;
 
+    const isNonEmptyString = (value: unknown): value is string =>
+      typeof value === "string" && value.length > 0;
+
     return {
-      activeContext: typeof data.activeContext === "string" ? data.activeContext : undefined,
-      activeNamespace: typeof data.activeNamespace === "string" ? data.activeNamespace : undefined,
+      activeContext: isNonEmptyString(data.activeContext) ? data.activeContext : undefined,
+      activeNamespace: isNonEmptyString(data.activeNamespace) ? data.activeNamespace : undefined,
     };
   } catch {
     return {};

package/src/app/syntax-theme.ts

@@ -0,0 +1,31 @@
+import { RGBA, SyntaxStyle } from "@opentui/core";
+
+const C = {
+  property: "#7aa2f7",
+  string: "#9ece6a",
+  number: "#ff9e64",
+  boolean: "#ff9e64",
+  constant: "#ff9e64",
+  comment: "#4e5f88",
+  label: "#bb9af7",
+  type: "#f7768e",
+  attribute: "#7dcfff",
+  punctuation: "#89ddff",
+  default: "#d4e1f7",
+};
+
+export const yamlSyntaxStyle = SyntaxStyle.fromStyles({
+  property: { fg: RGBA.fromHex(C.property) },
+  string: { fg: RGBA.fromHex(C.string) },
+  number: { fg: RGBA.fromHex(C.number) },
+  boolean: { fg: RGBA.fromHex(C.boolean) },
+  "constant.builtin": { fg: RGBA.fromHex(C.constant) },
+  comment: { fg: RGBA.fromHex(C.comment), dim: true },
+  label: { fg: RGBA.fromHex(C.label) },
+  type: { fg: RGBA.fromHex(C.type) },
+  attribute: { fg: RGBA.fromHex(C.attribute) },
+  "punctuation.delimiter": { fg: RGBA.fromHex(C.punctuation) },
+  "punctuation.bracket": { fg: RGBA.fromHex(C.punctuation) },
+  "punctuation.special": { fg: RGBA.fromHex(C.punctuation) },
+  default: { fg: RGBA.fromHex(C.default) },
+});

package/src/app/theme.ts

@@ -26,7 +26,8 @@ export const ROW_SELECTED = "#152040";
 export const ROW_SELECTED_ALT = "#111c38";
 
 // ── Text ──────────────────────────────────────────────────────────────────────
-export const TEXT_MUTED = TextAttributes.DIM;
+// Note: ATTR_DIM is a TextAttributes value (not a color); use it via the `attributes` prop.
+export const ATTR_DIM = TextAttributes.DIM;
 export const TEXT_PRIMARY = "#d4e1f7";
 export const TEXT_SUBTLE = "#6474a0";
 export const FILTER_BACKGROUND = "#090e1a";
@@ -42,8 +43,6 @@ export const ACCENT = "#5b8edb";
 export const KEY_HINT = "#5b8edb";
 
 // ── YAML colorizer ────────────────────────────────────────────────────────────
-export const YAML_KEY = "#7aa2f7";
-export const YAML_VALUE = "#9ece6a";
 export const YAML_COMMENT = "#4e5f88";
 
 // ── Unicode glyphs ────────────────────────────────────────────────────────────