🤖 Deduplicate runtime mode types and constants

Eliminates duplication of "local" | "ssh" union and magic strings across codebase:

**New shared types/constants in src/types/runtime.ts:**
- RuntimeMode type: "local" | "ssh"
- RUNTIME_MODE constants: { LOCAL: "local", SSH: "ssh" }
- SSH_RUNTIME_PREFIX constant: "ssh "
- parseRuntimeModeAndHost(): Parse runtime strings to mode+host
- buildRuntimeString(): Build runtime strings from mode+host

**Updated to use shared types:**
- useNewWorkspaceOptions hook
- NewWorkspaceModal component
- chatCommands utilities

**Benefits:**
- Single source of truth for runtime mode values
- No more magic strings scattered across files
- Type-safe runtime mode handling
- Easier refactoring if runtime types expand in future
- Reduced code duplication (41 lines removed, 88 added with utilities)

Author: ammar-agent

src/components/NewWorkspaceModal.tsx

@@ -3,6 +3,7 @@ import { Modal, ModalInfo, ModalActions, CancelButton, PrimaryButton } from "./M
 import { TooltipWrapper, Tooltip } from "./Tooltip";
 import { formatNewCommand } from "@/utils/chatCommands";
 import { useNewWorkspaceOptions } from "@/hooks/useNewWorkspaceOptions";
+import { RUNTIME_MODE } from "@/types/runtime";
 
 interface NewWorkspaceModalProps {
   isOpen: boolean;
@@ -64,7 +65,7 @@ const NewWorkspaceModal: React.FC<NewWorkspaceModalProps> = ({
   const handleCancel = () => {
     setBranchName("");
     setTrunkBranch(defaultTrunkBranch ?? branches[0] ?? "");
-    setRuntimeOptions("local", "");
+    setRuntimeOptions(RUNTIME_MODE.LOCAL, "");
     setError(loadErrorMessage ?? null);
     onClose();
   };
@@ -87,7 +88,7 @@ const NewWorkspaceModal: React.FC<NewWorkspaceModalProps> = ({
     console.assert(trimmedBranchName.length > 0, "Expected branch name to be validated");
 
     // Validate SSH host if SSH runtime selected
-    if (runtimeMode === "ssh") {
+    if (runtimeMode === RUNTIME_MODE.SSH) {
       const trimmedHost = sshHost.trim();
       if (trimmedHost.length === 0) {
         setError("SSH host is required (e.g., hostname or user@host)");
@@ -107,7 +108,7 @@ const NewWorkspaceModal: React.FC<NewWorkspaceModalProps> = ({
       await onAdd(trimmedBranchName, normalizedTrunkBranch, runtime);
       setBranchName("");
       setTrunkBranch(defaultTrunkBranch ?? branches[0] ?? "");
-      setRuntimeOptions("local", "");
+      setRuntimeOptions(RUNTIME_MODE.LOCAL, "");
       onClose();
     } catch (err) {
       const message = err instanceof Error ? err.message : "Failed to create workspace";
@@ -206,26 +207,26 @@ const NewWorkspaceModal: React.FC<NewWorkspaceModalProps> = ({
             id="runtimeMode"
             value={runtimeMode}
             onChange={(event) => {
-              const newMode = event.target.value as "local" | "ssh";
-              setRuntimeOptions(newMode, newMode === "local" ? "" : sshHost);
+              const newMode = event.target.value as typeof RUNTIME_MODE.LOCAL | typeof RUNTIME_MODE.SSH;
+              setRuntimeOptions(newMode, newMode === RUNTIME_MODE.LOCAL ? "" : sshHost);
               setError(null);
             }}
             disabled={isLoading}
           >
-            <option value="local">Local</option>
-            <option value="ssh">SSH Remote</option>
+            <option value={RUNTIME_MODE.LOCAL}>Local</option>
+            <option value={RUNTIME_MODE.SSH}>SSH Remote</option>
           </select>
         </div>
 
-        {runtimeMode === "ssh" && (
+        {runtimeMode === RUNTIME_MODE.SSH && (
           <div className={formFieldClasses}>
             <label htmlFor="sshHost">SSH Host:</label>
             <input
               id="sshHost"
               type="text"
               value={sshHost}
               onChange={(event) => {
-                setRuntimeOptions("ssh", event.target.value);
+                setRuntimeOptions(RUNTIME_MODE.SSH, event.target.value);
                 setError(null);
               }}
               placeholder="hostname or user@hostname"
@@ -242,7 +243,7 @@ const NewWorkspaceModal: React.FC<NewWorkspaceModalProps> = ({
         <ModalInfo id={infoId}>
           <p>This will create a git worktree at:</p>
           <code className="block break-all">
-            {runtimeMode === "ssh"
+            {runtimeMode === RUNTIME_MODE.SSH
               ? `${sshHost || "<host>"}:~/cmux/${branchName || "<branch-name>"}`
               : `~/.cmux/src/${projectName}/${branchName || "<branch-name>"}`}
           </code>
@@ -255,7 +256,7 @@ const NewWorkspaceModal: React.FC<NewWorkspaceModalProps> = ({
               {formatNewCommand(
                 branchName.trim(),
                 trunkBranch.trim() || undefined,
-                runtimeMode === "ssh" && sshHost.trim() ? `ssh ${sshHost.trim()}` : undefined
+                getRuntimeString()
               )}
             </div>
           </div>

src/hooks/useNewWorkspaceOptions.ts

@@ -1,8 +1,14 @@
 import { useState, useEffect } from "react";
 import { getRuntimeKey } from "@/constants/storage";
+import {
+  type RuntimeMode,
+  RUNTIME_MODE,
+  parseRuntimeModeAndHost,
+  buildRuntimeString,
+} from "@/types/runtime";
 
 export interface WorkspaceRuntimeOptions {
-  runtimeMode: "local" | "ssh";
+  runtimeMode: RuntimeMode;
   sshHost: string;
   /**
    * Returns the runtime string for IPC calls (format: "ssh <host>" or undefined for local)
@@ -21,52 +27,36 @@ export interface WorkspaceRuntimeOptions {
 export function useNewWorkspaceOptions(
   projectPath: string | null | undefined,
   enabled = true
-): [WorkspaceRuntimeOptions, (mode: "local" | "ssh", host?: string) => void] {
-  const [runtimeMode, setRuntimeMode] = useState<"local" | "ssh">("local");
+): [WorkspaceRuntimeOptions, (mode: RuntimeMode, host?: string) => void] {
+  const [runtimeMode, setRuntimeMode] = useState<RuntimeMode>(RUNTIME_MODE.LOCAL);
   const [sshHost, setSshHost] = useState("");
 
   // Load saved runtime preference when projectPath changes
   useEffect(() => {
     if (!enabled || !projectPath) {
       // Reset to defaults when disabled or no project
-      setRuntimeMode("local");
+      setRuntimeMode(RUNTIME_MODE.LOCAL);
       setSshHost("");
       return;
     }
 
     const runtimeKey = getRuntimeKey(projectPath);
     const savedRuntime = localStorage.getItem(runtimeKey);
+    const parsed = parseRuntimeModeAndHost(savedRuntime);
 
-    if (savedRuntime) {
-      // Parse the saved runtime string (format: "ssh <host>" or undefined for local)
-      if (savedRuntime.startsWith("ssh ")) {
-        const host = savedRuntime.substring(4).trim();
-        setRuntimeMode("ssh");
-        setSshHost(host);
-      } else {
-        setRuntimeMode("local");
-        setSshHost("");
-      }
-    } else {
-      // No saved preference, use defaults
-      setRuntimeMode("local");
-      setSshHost("");
-    }
+    setRuntimeMode(parsed.mode);
+    setSshHost(parsed.host);
   }, [projectPath, enabled]);
 
   // Setter for updating both mode and host
-  const setRuntimeOptions = (mode: "local" | "ssh", host?: string) => {
+  const setRuntimeOptions = (mode: RuntimeMode, host?: string) => {
     setRuntimeMode(mode);
     setSshHost(host ?? "");
   };
 
   // Helper to get runtime string for IPC calls
   const getRuntimeString = (): string | undefined => {
-    if (runtimeMode === "ssh") {
-      const trimmedHost = sshHost.trim();
-      return trimmedHost ? `ssh ${trimmedHost}` : undefined;
-    }
-    return undefined;
+    return buildRuntimeString(runtimeMode, sshHost);
   };
 
   return [

src/types/runtime.ts

@@ -2,6 +2,18 @@
  * Runtime configuration types for workspace execution environments
  */
 
+/** Runtime mode type - used in UI and runtime string parsing */
+export type RuntimeMode = "local" | "ssh";
+
+/** Runtime mode constants */
+export const RUNTIME_MODE = {
+  LOCAL: "local" as const,
+  SSH: "ssh" as const,
+} as const;
+
+/** Runtime string prefix for SSH mode (e.g., "ssh hostname") */
+export const SSH_RUNTIME_PREFIX = "ssh ";
+
 export type RuntimeConfig =
   | {
       type: "local";
@@ -19,3 +31,46 @@ export type RuntimeConfig =
       /** Optional: SSH port (default: 22) */
       port?: number;
     };
+
+/**
+ * Parse runtime string from localStorage or UI input into mode and host
+ * Format: "ssh <host>" -> { mode: "ssh", host: "<host>" }
+ *         "local" or undefined -> { mode: "local", host: "" }
+ * 
+ * Use this for UI state management (localStorage, form inputs)
+ */
+export function parseRuntimeModeAndHost(runtime: string | null | undefined): {
+  mode: RuntimeMode;
+  host: string;
+} {
+  if (!runtime) {
+    return { mode: RUNTIME_MODE.LOCAL, host: "" };
+  }
+
+  const trimmed = runtime.trim();
+  const lowerTrimmed = trimmed.toLowerCase();
+
+  if (lowerTrimmed === RUNTIME_MODE.LOCAL) {
+    return { mode: RUNTIME_MODE.LOCAL, host: "" };
+  }
+
+  if (lowerTrimmed.startsWith(SSH_RUNTIME_PREFIX)) {
+    const host = trimmed.substring(SSH_RUNTIME_PREFIX.length).trim();
+    return { mode: RUNTIME_MODE.SSH, host };
+  }
+
+  // Default to local for unrecognized strings
+  return { mode: RUNTIME_MODE.LOCAL, host: "" };
+}
+
+/**
+ * Build runtime string for storage/IPC from mode and host
+ * Returns: "ssh <host>" for SSH, undefined for local
+ */
+export function buildRuntimeString(mode: RuntimeMode, host: string): string | undefined {
+  if (mode === RUNTIME_MODE.SSH) {
+    const trimmedHost = host.trim();
+    return trimmedHost ? `${SSH_RUNTIME_PREFIX}${trimmedHost}` : undefined;
+  }
+  return undefined;
+}

src/utils/chatCommands.ts

@@ -10,6 +10,7 @@ import type { SendMessageOptions } from "@/types/ipc";
 import type { CmuxFrontendMetadata, CompactionRequestData } from "@/types/message";
 import type { FrontendWorkspaceMetadata } from "@/types/workspace";
 import type { RuntimeConfig } from "@/types/runtime";
+import { RUNTIME_MODE, SSH_RUNTIME_PREFIX } from "@/types/runtime";
 import { CUSTOM_EVENTS } from "@/constants/events";
 import type { Toast } from "@/components/ChatInputToast";
 import type { ParsedCommand } from "@/utils/slashCommands/types";
@@ -22,7 +23,7 @@ import { getRuntimeKey } from "@/constants/storage";
 // ============================================================================
 
 /**
- * Parse runtime string from -r flag into RuntimeConfig
+ * Parse runtime string from -r flag into RuntimeConfig for backend
  * Supports formats:
  * - "ssh <host>" or "ssh <user@host>" -> SSH runtime
  * - "local" -> Local runtime (explicit)
@@ -39,21 +40,21 @@ export function parseRuntimeString(
   const trimmed = runtime.trim();
   const lowerTrimmed = trimmed.toLowerCase();
 
-  if (lowerTrimmed === "local") {
+  if (lowerTrimmed === RUNTIME_MODE.LOCAL) {
     return undefined; // Explicit local - let backend use default
   }
 
   // Parse "ssh <host>" or "ssh <user@host>" format
-  if (lowerTrimmed === "ssh" || lowerTrimmed.startsWith("ssh ")) {
-    const hostPart = trimmed.slice(3).trim(); // Preserve original case for host, skip "ssh"
+  if (lowerTrimmed === RUNTIME_MODE.SSH || lowerTrimmed.startsWith(SSH_RUNTIME_PREFIX)) {
+    const hostPart = trimmed.slice(SSH_RUNTIME_PREFIX.length - 1).trim(); // Preserve original case for host
     if (!hostPart) {
       throw new Error("SSH runtime requires host (e.g., 'ssh hostname' or 'ssh user@host')");
     }
 
     // Accept both "hostname" and "user@hostname" formats
     // SSH will use current user or ~/.ssh/config if user not specified
     return {
-      type: "ssh",
+      type: RUNTIME_MODE.SSH,
       host: hostPart,
       srcBaseDir: "~/cmux", // Default remote base directory (NOT including workspace name)
     };