openk8s 1.0.5 → 1.2.0

package/src/lib/kubectl/kubectl-service.ts

@@ -1,5 +1,6 @@
 import { type ChildProcess } from "node:child_process";
 
+import { dump as dumpYaml } from "js-yaml";
 import { formatAge } from "../k8s/k8s-format";
 import { buildResourceDetail, type KubernetesResource } from "../k8s/resource-detail-builder";
 import type {
@@ -84,6 +85,24 @@ export type {
 
 const KUBECTL_TIMEOUT_MS = 15_000;
 
+interface NamespacedOptions {
+  context: string;
+  namespace?: string | undefined;
+  namespaced?: boolean | undefined;
+}
+
+function buildContextArgs(options: NamespacedOptions): string[] {
+  const args = ["--context", options.context];
+  if (options.namespaced && options.namespace !== undefined) {
+    args.push("-n", options.namespace);
+  }
+  return args;
+}
+
+function buildHelmBaseArgs(options: { context: string; namespace: string }): string[] {
+  return ["--kube-context", options.context, "-n", options.namespace];
+}
+
 export class KubectlService {
   async isAvailable(): Promise<boolean> {
     try {
@@ -201,25 +220,17 @@ export class KubectlService {
     }
 
     const jsonArgs = ["--context", options.context, "get", options.resourceKind.name, options.name];
-    const yamlArgs = ["--context", options.context, "get", options.resourceKind.name, options.name];
-    const describeArgs = ["--context", options.context, "describe", options.resourceKind.name, options.name];
 
     if (options.resourceKind.namespaced) {
       jsonArgs.push("-n", options.namespace);
-      yamlArgs.push("-n", options.namespace);
-      describeArgs.push("-n", options.namespace);
     }
 
     jsonArgs.push("-o", "json");
-    yamlArgs.push("-o", "yaml");
 
-    const [resource, yaml, describe] = await Promise.all([
-      runJson<KubernetesResource>({ command: "kubectl", args: jsonArgs, timeoutMs: KUBECTL_TIMEOUT_MS }),
-      runText({ command: "kubectl", args: yamlArgs, timeoutMs: KUBECTL_TIMEOUT_MS }),
-      runText({ command: "kubectl", args: describeArgs, timeoutMs: KUBECTL_TIMEOUT_MS }).catch(() => ""),
-    ]);
+    const resource = await runJson<KubernetesResource>({ command: "kubectl", args: jsonArgs, timeoutMs: KUBECTL_TIMEOUT_MS });
+    const yamlText = dumpYaml(resource, { lineWidth: -1, noRefs: true });
 
-    return buildResourceDetail({ resourceKind: options.resourceKind, resource, yaml, describe });
+    return buildResourceDetail({ resourceKind: options.resourceKind, resource, yaml: yamlText });
   }
 
   async listResourceEvents(options: ListResourceEventsOptions): Promise<EventItem[]> {
@@ -284,11 +295,7 @@ export class KubectlService {
       throw new Error(`Logs are not supported yet for ${options.resourceRef.kind}`);
     }
 
-    const args = ["--context", options.context];
-
-    if (options.namespaced) {
-      args.push("-n", options.namespace);
-    }
+    const args = buildContextArgs(options);
 
     const tail = options.logOptions?.tail ?? 120;
     const since = options.logOptions?.since;
@@ -307,7 +314,7 @@ export class KubectlService {
     }
 
     if (logTarget.includeAllPods) {
-      args.push("--all-pods=true");
+      args.push("--all-containers=true");
     }
 
     if (options.container) {
@@ -325,11 +332,7 @@ export class KubectlService {
       throw new Error(`Scale is not supported yet for ${options.resourceRef.kind}`);
     }
 
-    const args = ["--context", options.context];
-
-    if (options.namespaced) {
-      args.push("-n", options.namespace);
-    }
+    const args = buildContextArgs(options);
 
     args.push("scale", normalizeResourceTarget(options.resourceRef), `--replicas=${options.replicas}`);
 
@@ -341,11 +344,7 @@ export class KubectlService {
       throw new Error(`Rollout restart is not supported yet for ${options.resourceRef.kind}`);
     }
 
-    const args = ["--context", options.context];
-
-    if (options.namespaced) {
-      args.push("-n", options.namespace);
-    }
+    const args = buildContextArgs(options);
 
     args.push("rollout", "restart", normalizeResourceTarget(options.resourceRef));
 
@@ -357,11 +356,7 @@ export class KubectlService {
       return this.uninstallHelmRelease(options);
     }
 
-    const args = ["--context", options.context];
-
-    if (options.namespaced) {
-      args.push("-n", options.namespace);
-    }
+    const args = buildContextArgs(options);
 
     args.push("delete", normalizeResourceTarget(options.resourceRef));
 
@@ -369,11 +364,7 @@ export class KubectlService {
   }
 
   startShell(options: StartShellOptions): ChildProcess {
-    const args = ["--context", options.context];
-
-    if (options.namespaced) {
-      args.push("-n", options.namespace);
-    }
+    const args = buildContextArgs(options);
 
     const kind = normalizeKind(options.resourceRef.kind);
     const target = kind === "pod" || kind === "pods" ? `pod/${options.resourceRef.name}` : normalizeResourceTarget(options.resourceRef);
@@ -384,11 +375,7 @@ export class KubectlService {
   }
 
   editResource(options: EditResourceOptions): ChildProcess {
-    const args = ["--context", options.context];
-
-    if (options.namespaced) {
-      args.push("-n", options.namespace);
-    }
+    const args = buildContextArgs(options);
 
     args.push("edit", normalizeResourceTarget(options.resourceRef));
 
@@ -529,7 +516,7 @@ export class KubectlService {
     const parsed = await runJson<SecretResponse>({ command: "kubectl", args, timeoutMs: KUBECTL_TIMEOUT_MS });
     const encoded = parsed.data?.[options.key];
 
-    if (!encoded) {
+    if (encoded === undefined) {
       throw new Error(`Key "${options.key}" not found in secret "${options.name}"`);
     }
 
@@ -547,7 +534,7 @@ export class KubectlService {
   }
 
   private async listHelmReleases(options: ListResourcesOptions): Promise<ResourceListItem[]> {
-    const args = ["list", "--kube-context", options.context, "-n", options.namespace, "-o", "json"];
+    const args = ["list", ...buildHelmBaseArgs(options), "-o", "json"];
     const result = await runCommand({ command: "helm", args, timeoutMs: KUBECTL_TIMEOUT_MS });
     const items = JSON.parse(result.stdout) as HelmListItem[];
 
@@ -564,15 +551,17 @@ export class KubectlService {
   }
 
   private async getHelmReleaseDetail(options: GetResourceDetailOptions): Promise<ResourceDetail> {
-    const baseArgs = ["--kube-context", options.context, "-n", options.namespace];
+    const baseArgs = buildHelmBaseArgs(options);
 
-    const [statusResult, valuesResult] = await Promise.all([
+    const [statusResult, valuesResult, manifestResult] = await Promise.all([
       runCommand({ command: "helm", args: ["status", options.name, ...baseArgs, "-o", "json"], timeoutMs: KUBECTL_TIMEOUT_MS }),
       runCommand({ command: "helm", args: ["get", "values", options.name, ...baseArgs], timeoutMs: KUBECTL_TIMEOUT_MS }),
+      runCommand({ command: "helm", args: ["get", "manifest", options.name, ...baseArgs], timeoutMs: KUBECTL_TIMEOUT_MS }),
     ]);
 
     const status = JSON.parse(statusResult.stdout) as HelmStatusResponse;
-    const yaml = valuesResult.stdout;
+    const helmValues = valuesResult.stdout;
+    const yaml = manifestResult.stdout;
 
     const overviewLines: string[] = [
       `name: ${status.name}`,
@@ -598,30 +587,25 @@ export class KubectlService {
       ...(notesLines.length > 0 ? [{ title: "Notes", lines: notesLines }] : []),
     ];
 
-    const summaryLines = summarySections.flatMap((section) => [
-      section.title,
-      ...section.lines.map((line) => `  ${line}`),
-    ]);
-
     return {
       ref: {
         kind: "helmreleases",
         name: status.name,
         namespace: status.namespace,
       },
-      summaryLines,
       summarySections,
       yaml,
       replicas: undefined,
       portForwards: undefined,
       helmChart: status.chart.metadata.name,
+      helmValues,
     };
   }
 
   private async uninstallHelmRelease(options: DeleteResourceOptions): Promise<void> {
     await runCommand({
       command: "helm",
-      args: ["uninstall", options.resourceRef.name, "--kube-context", options.context, "-n", options.namespace],
+      args: ["uninstall", options.resourceRef.name, ...buildHelmBaseArgs(options)],
       timeoutMs: KUBECTL_TIMEOUT_MS,
     });
   }

package/src/lib/kubectl/kubectl-types.ts

@@ -142,14 +142,23 @@ export interface GenericListItem {
     name?: string | undefined;
     namespace?: string | undefined;
     creationTimestamp?: string | undefined;
+    labels?: Record<string, string> | undefined;
   } | undefined;
   spec?: Record<string, unknown> | undefined;
   status?: Record<string, unknown> | undefined;
+  // Event-only fields
   type?: string | undefined;
   reason?: string | undefined;
   message?: string | undefined;
   lastTimestamp?: string | undefined;
   firstTimestamp?: string | undefined;
+  // RBAC fields
+  rules?: unknown[] | undefined;
+  roleRef?: Record<string, unknown> | undefined;
+  subjects?: unknown[] | undefined;
+  // ServiceAccount fields
+  secrets?: unknown[] | undefined;
+  imagePullSecrets?: unknown[] | undefined;
 }
 
 export interface GenericListResponse {
@@ -218,7 +227,7 @@ export interface HelmStatusResponse {
 }
 
 export interface ApiResourcesResponse {
-  resources: ApiResourceItem[];
+  resources?: ApiResourceItem[] | undefined;
 }
 
 export interface ApiResourceItem {

package/src/lib/kubectl/metrics-utils.ts

@@ -8,16 +8,30 @@ export function parseCpuNano(value: string): number {
 
 export function parseMemBytes(value: string): number {
   if (!value) return 0;
-  const units: Record<string, number> = {
-    Ki: 1024, Mi: 1024 ** 2, Gi: 1024 ** 3, Ti: 1024 ** 4,
-    K: 1000, M: 1000 ** 2, G: 1000 ** 3, T: 1000 ** 4,
-  };
-  for (const [suffix, mult] of Object.entries(units)) {
+  // Order matters: multi-character (binary) suffixes must be checked before their
+  // single-letter decimal counterparts (e.g. "Ki" before "K").
+  const units: Array<[string, number]> = [
+    ["Ei", 1024 ** 6],
+    ["Pi", 1024 ** 5],
+    ["Ti", 1024 ** 4],
+    ["Gi", 1024 ** 3],
+    ["Mi", 1024 ** 2],
+    ["Ki", 1024],
+    ["E", 1000 ** 6],
+    ["P", 1000 ** 5],
+    ["T", 1000 ** 4],
+    ["G", 1000 ** 3],
+    ["M", 1000 ** 2],
+    ["K", 1000],
+  ];
+  for (const [suffix, mult] of units) {
     if (value.endsWith(suffix)) {
-      return Number.parseFloat(value) * mult;
+      const n = Number.parseFloat(value);
+      return Number.isFinite(n) ? n * mult : 0;
     }
   }
-  return Number.parseFloat(value) || 0;
+  const n = Number.parseFloat(value);
+  return Number.isFinite(n) ? n : 0;
 }
 
 export function formatCpu(nano: number): string {

package/src/lib/kubectl/spawn-utils.ts

@@ -1,14 +1,31 @@
 import { spawn, type ChildProcess, type StdioOptions } from "node:child_process";
+import { parseKubectlError } from "./kubectl-helpers";
 
 const DEFAULT_TIMEOUT_MS = 15_000;
 let shutdownController: AbortController | undefined;
 
+const persistentProcesses = new Set<ChildProcess>();
+
 export function setAbortController(controller: AbortController): void {
   shutdownController = controller;
 }
 
 export function abortRunningProcesses(): void {
   shutdownController?.abort();
+  for (const child of persistentProcesses) {
+    safeKill(child, "SIGTERM");
+  }
+  persistentProcesses.clear();
+}
+
+export function safeKill(child: ChildProcess, signal: NodeJS.Signals = "SIGTERM"): void {
+  try {
+    if (child.exitCode === null && !child.killed) {
+      child.kill(signal);
+    }
+  } catch {
+    // ESRCH: process already exited. Safe to ignore.
+  }
 }
 
 export interface RunCommandOptions {
@@ -28,23 +45,30 @@ export function runCommand(options: RunCommandOptions): Promise<CommandResult> {
     const child = spawn(options.command, options.args, { env: process.env, stdio: ["pipe", "pipe", "pipe"] });
     const timeoutMs = options.timeoutMs ?? DEFAULT_TIMEOUT_MS;
 
-    const timeoutId = setTimeout(() => {
+    const onShutdown = (): void => {
       if (settled) {
         return;
       }
       settled = true;
-      child.kill("SIGTERM");
-      reject(new Error(`${options.command} ${options.args.slice(0, 4).join(" ")} timed out after ${timeoutMs / 1_000}s`));
-    }, timeoutMs);
+      clearTimeout(timeoutId);
+      safeKill(child, "SIGTERM");
+      reject(new Error("Application shutting down"));
+    };
 
-    const onShutdown = (): void => {
+    const timeoutId = setTimeout(() => {
       if (settled) {
         return;
       }
       settled = true;
-      clearTimeout(timeoutId);
-      child.kill("SIGTERM");
-      reject(new Error("Application shutting down"));
+      removeAbortListener();
+      safeKill(child, "SIGTERM");
+      reject(new Error(`${options.command} ${options.args.slice(0, 4).join(" ")} timed out after ${timeoutMs / 1_000}s`));
+    }, timeoutMs);
+
+    const removeAbortListener = (): void => {
+      if (shutdownController) {
+        shutdownController.signal.removeEventListener("abort", onShutdown);
+      }
     };
 
     if (shutdownController) {
@@ -68,12 +92,15 @@ export function runCommand(options: RunCommandOptions): Promise<CommandResult> {
 
     child.on("error", (error) => {
       clearTimeout(timeoutId);
+      removeAbortListener();
+      if (settled) return;
       settled = true;
       reject(error);
     });
 
     child.on("close", (code) => {
       clearTimeout(timeoutId);
+      removeAbortListener();
 
       if (settled) {
         return;
@@ -86,8 +113,7 @@ export function runCommand(options: RunCommandOptions): Promise<CommandResult> {
       }
 
       settled = true;
-      const message = stderr.trim() || `${options.command} ${options.args.join(" ")} failed`;
-      reject(new Error(message));
+      reject(parseKubectlError(stderr, options.args, options.command));
     });
   });
 }
@@ -101,8 +127,21 @@ export function runJson<T>(options: RunCommandOptions): Promise<T> {
 }
 
 export function startPersistentProcess(options: { command: string; args: string[]; stdio?: StdioOptions }): ChildProcess {
-  return spawn(options.command, options.args, {
+  const child = spawn(options.command, options.args, {
     env: process.env,
     stdio: options.stdio ?? ["ignore", "pipe", "pipe"],
   });
+  persistentProcesses.add(child);
+  child.on("close", () => {
+    persistentProcesses.delete(child);
+  });
+  child.on("error", () => {
+    persistentProcesses.delete(child);
+  });
+  return child;
+}
+
+export function stopPersistentProcess(child: ChildProcess): void {
+  persistentProcesses.delete(child);
+  safeKill(child, "SIGINT");
 }

package/src/app/__tests__/components/inspector-tokens.test.ts

@@ -1,101 +0,0 @@
-import { describe, expect, test } from "bun:test";
-import { tokenizeYamlLine, tokenizeDescribeLine } from "../../components/inspector-tokens";
-import { YAML_COMMENT, YAML_KEY, TEXT_SUBTLE, YAML_VALUE } from "../../theme";
-
-describe("tokenizeYamlLine", () => {
-  test("empty line", () => {
-    const tokens = tokenizeYamlLine("");
-    expect(tokens[0]?.text).toBe(" ");
-  });
-
-  test("whitespace line", () => {
-    const tokens = tokenizeYamlLine("   ");
-    expect(tokens[0]?.text).toBe("   ");
-  });
-
-  test("comment line", () => {
-    const tokens = tokenizeYamlLine("# this is a comment");
-    expect(tokens).toHaveLength(1);
-    expect(tokens[0]?.fg).toBe(YAML_COMMENT);
-  });
-
-  test("key: value line", () => {
-    const tokens = tokenizeYamlLine("name: nginx");
-    expect(tokens).toHaveLength(4);
-    expect(tokens[0]?.text).toBe("");
-    expect(tokens[1]?.text).toBe("name");
-    expect(tokens[1]?.fg).toBe(YAML_KEY);
-    expect(tokens[3]?.text).toBe("nginx");
-    expect(tokens[3]?.fg).toBe(YAML_VALUE);
-  });
-
-  test("indented key: value", () => {
-    const tokens = tokenizeYamlLine("  name: nginx");
-    expect(tokens[0]?.text).toBe("  ");
-    expect(tokens[1]?.text).toBe("name");
-    expect(tokens[1]?.fg).toBe(YAML_KEY);
-  });
-
-  test("list item with value", () => {
-    const tokens = tokenizeYamlLine("- name: nginx");
-    expect(tokens[0]?.text).toBe("- ");
-    expect(tokens[1]?.text).toBe("name");
-    expect(tokens[1]?.fg).toBe(YAML_KEY);
-  });
-
-  test("bare list marker", () => {
-    const tokens = tokenizeYamlLine("-");
-    expect(tokens).toHaveLength(1);
-    expect(tokens[0]?.fg).toBe(TEXT_SUBTLE);
-  });
-
-  test("key only (ends with colon)", () => {
-    const tokens = tokenizeYamlLine("metadata:");
-    expect(tokens).toHaveLength(3);
-    expect(tokens[1]?.text).toBe("metadata");
-    expect(tokens[1]?.fg).toBe(YAML_KEY);
-    expect(tokens[2]?.text).toBe(":");
-  });
-
-  test("plain text fallthrough", () => {
-    const tokens = tokenizeYamlLine("some random text");
-    expect(tokens).toHaveLength(1);
-    expect(tokens[0]?.fg).toBe(TEXT_SUBTLE);
-  });
-});
-
-describe("tokenizeDescribeLine", () => {
-  test("empty line", () => {
-    const tokens = tokenizeDescribeLine("");
-    expect(tokens[0]?.text).toBe(" ");
-  });
-
-  test("section header", () => {
-    const tokens = tokenizeDescribeLine("Name: test-pod");
-    expect(tokens).toHaveLength(3);
-    expect(tokens[0]?.text).toBe("Name");
-    expect(tokens[0]?.fg).toBe(YAML_KEY);
-    expect(tokens[2]?.fg).toBe(YAML_VALUE);
-  });
-
-  test("indented key:  value (double space after colon)", () => {
-    const tokens = tokenizeDescribeLine("  Namespace:  default");
-    expect(tokens).toHaveLength(2);
-    expect(tokens[0]?.fg).toBe(TEXT_SUBTLE);
-    expect(tokens[1]?.fg).toBe(YAML_VALUE);
-  });
-
-  test("key: single value", () => {
-    const tokens = tokenizeDescribeLine("key:value");
-    expect(tokens).toHaveLength(3);
-    expect(tokens[0]?.fg).toBe(TEXT_SUBTLE);
-    expect(tokens[1]?.text).toBe(":");
-    expect(tokens[2]?.text).toBe("value");
-  });
-
-  test("plain text", () => {
-    const tokens = tokenizeDescribeLine("Some plain description text");
-    expect(tokens).toHaveLength(1);
-    expect(tokens[0]?.fg).toBe(TEXT_SUBTLE);
-  });
-});

package/src/app/components/inspector-tokens.ts

@@ -1,93 +0,0 @@
-import { YAML_COMMENT, YAML_KEY, TEXT_SUBTLE, YAML_VALUE } from "../theme";
-
-export interface YamlToken {
-  text: string;
-  fg: string;
-}
-
-export function tokenizeDescribeLine(line: string): YamlToken[] {
-  if (!line.trim()) {
-    return [{ text: line || " ", fg: TEXT_SUBTLE }];
-  }
-
-  if (/^[A-Z][A-Za-z ]+:/.test(line.trimStart()) && !line.startsWith(" ")) {
-    const colonIdx = line.indexOf(":");
-    const key = line.slice(0, colonIdx);
-    const rest = line.slice(colonIdx + 1);
-    return [
-      { text: key, fg: YAML_KEY },
-      { text: ":", fg: TEXT_SUBTLE },
-      { text: rest, fg: YAML_VALUE },
-    ];
-  }
-
-  const colonSpaceIdx = line.indexOf(":  ");
-  if (colonSpaceIdx > 0) {
-    const key = line.slice(0, colonSpaceIdx);
-    const value = line.slice(colonSpaceIdx + 1);
-    return [
-      { text: key, fg: TEXT_SUBTLE },
-      { text: value, fg: YAML_VALUE },
-    ];
-  }
-
-  const colonIdx = line.indexOf(":");
-  if (colonIdx > 0 && colonIdx < line.length - 1) {
-    const key = line.slice(0, colonIdx);
-    const value = line.slice(colonIdx + 1);
-    return [
-      { text: key, fg: TEXT_SUBTLE },
-      { text: ":", fg: TEXT_SUBTLE },
-      { text: value, fg: YAML_VALUE },
-    ];
-  }
-
-  return [{ text: line, fg: TEXT_SUBTLE }];
-}
-
-export function tokenizeYamlLine(line: string): YamlToken[] {
-  if (!line.trim()) {
-    return [{ text: line || " ", fg: TEXT_SUBTLE }];
-  }
-
-  if (/^\s*#/.test(line)) {
-    return [{ text: line, fg: YAML_COMMENT }];
-  }
-
-  const indentLen = line.length - line.trimStart().length;
-  const indent = line.slice(0, indentLen);
-  let rest = line.trimStart();
-
-  let listMarker = "";
-  if (rest.startsWith("- ")) {
-    listMarker = "- ";
-    rest = rest.slice(2);
-  } else if (rest === "-") {
-    return [{ text: line, fg: TEXT_SUBTLE }];
-  }
-
-  const colonSpaceIdx = rest.indexOf(": ");
-  const isKeyOnly = rest === rest.trimEnd() && rest.endsWith(":");
-
-  if (colonSpaceIdx !== -1) {
-    const key = rest.slice(0, colonSpaceIdx);
-    const value = rest.slice(colonSpaceIdx + 2);
-    return [
-      { text: indent + listMarker, fg: TEXT_SUBTLE },
-      { text: key, fg: YAML_KEY },
-      { text: ": ", fg: TEXT_SUBTLE },
-      { text: value, fg: YAML_VALUE },
-    ];
-  }
-
-  if (isKeyOnly) {
-    const key = rest.slice(0, -1);
-    return [
-      { text: indent + listMarker, fg: TEXT_SUBTLE },
-      { text: key, fg: YAML_KEY },
-      { text: ":", fg: TEXT_SUBTLE },
-    ];
-  }
-
-  return [{ text: line, fg: TEXT_SUBTLE }];
-}

package/src/app/components/port-forwards-tray.tsx

@@ -1,57 +0,0 @@
-import { TextAttributes } from "@opentui/core";
-
-import { DANGER, GLYPHS, KEY_HINT, OVERLAY_SURFACE, PANEL_BORDER, TEXT_PRIMARY, TEXT_SUBTLE } from "../theme";
-import { activePortForwardLabel } from "../utils";
-import type { ActivePortForward } from "../../lib/k8s/types";
-
-export interface PortForwardsTrayProps {
-  forwards: ActivePortForward[];
-  onStop: (id: string) => void;
-}
-
-export function PortForwardsTray({ forwards, onStop }: PortForwardsTrayProps) {
-  if (forwards.length === 0) {
-    return undefined;
-  }
-
-  return (
-    <box
-      style={{
-        border: true,
-        borderColor: PANEL_BORDER,
-        borderStyle: "rounded",
-        backgroundColor: OVERLAY_SURFACE,
-        paddingLeft: 1,
-        paddingRight: 1,
-        flexDirection: "column",
-      }}
-    >
-      {/* Tray heading */}
-      <text fg={KEY_HINT}>
-        {GLYPHS.forward}
-        <span fg={TEXT_SUBTLE} attributes={TextAttributes.DIM}>{" Port Forwards"}</span>
-      </text>
-      <box style={{ flexDirection: "column", width: "100%" }}>
-        {forwards.map((forward) => {
-          const isReady = forward.status === "ready";
-          const statusDot = isReady ? GLYPHS.dot : GLYPHS.dotEmpty;
-          const statusFg = isReady ? KEY_HINT : TEXT_SUBTLE;
-
-          return (
-            <box key={forward.id} style={{ flexDirection: "row", justifyContent: "space-between", width: "100%" }}>
-              <text fg={isReady ? TEXT_PRIMARY : TEXT_SUBTLE}>
-                <span fg={statusFg}>{statusDot}</span>
-                {`  ${activePortForwardLabel(forward)}  `}
-                <span fg={TEXT_SUBTLE} attributes={TextAttributes.DIM}>{forward.status}</span>
-              </text>
-              <text fg={DANGER} onMouseDown={() => onStop(forward.id)}>
-                <span fg={DANGER}>{GLYPHS.stop}</span>
-                {" stop"}
-              </text>
-            </box>
-          );
-        })}
-      </box>
-    </box>
-  );
-}