clawcontrol 0.1.6 → 0.2.0

package/dist/index.js

@@ -4,8 +4,8 @@ import { createCliRenderer } from "@opentui/core";
 import { createRoot } from "@opentui/react";
 
 // src/App.tsx
-import { useState as useState10, useCallback as useCallback3, useRef as useRef5 } from "react";
-import { useRenderer } from "@opentui/react";
+import { useState as useState12, useCallback as useCallback4, useRef as useRef6 } from "react";
+import { useRenderer as useRenderer2 } from "@opentui/react";
 
 // src/components/Home.tsx
 import { useState } from "react";
@@ -142,10 +142,12 @@ var LOGO = `
 `;
 var COMMANDS = [
   { name: "/new", description: "Initialize a new deployment" },
+  { name: "/list", description: "List, edit, or fork deployments" },
   { name: "/deploy", description: "Deploy an initialized configuration" },
   { name: "/status", description: "View deployment status" },
   { name: "/ssh", description: "SSH into a deployment" },
   { name: "/logs", description: "View deployment logs" },
+  { name: "/dashboard", description: "Open OpenClaw dashboard in browser" },
   { name: "/destroy", description: "Destroy a deployment" },
   { name: "/templates", description: "Manage deployment templates" },
   { name: "/help", description: "Show help" }
@@ -158,10 +160,12 @@ function Home({ context }) {
     setError(null);
     const viewMap = {
       "/new": "new",
+      "/list": "list",
       "/deploy": "deploy",
       "/status": "status",
       "/ssh": "ssh",
       "/logs": "logs",
+      "/dashboard": "dashboard",
       "/destroy": "destroy",
       "/templates": "templates",
       "/help": "help"
@@ -223,7 +227,7 @@ function Home({ context }) {
               children: [
                 /* @__PURE__ */ jsx("text", { fg: t.fg.primary, children: "Available Commands" }),
                 /* @__PURE__ */ jsx("box", { flexDirection: "column", marginTop: 1, children: COMMANDS.map((cmd) => /* @__PURE__ */ jsxs("box", { flexDirection: "row", children: [
-                  /* @__PURE__ */ jsx("text", { fg: t.accent, width: 12, children: cmd.name }),
+                  /* @__PURE__ */ jsx("text", { fg: t.accent, width: 14, children: cmd.name }),
                   /* @__PURE__ */ jsx("text", { fg: t.fg.secondary, children: cmd.description })
                 ] }, cmd.name)) })
               ]
@@ -372,7 +376,8 @@ var DeploymentConfigSchema = z.object({
   hetzner: HetznerConfigSchema.optional(),
   digitalocean: DigitalOceanConfigSchema.optional(),
   openclawConfig: OpenClawConfigSchema,
-  openclawAgent: OpenClawAgentConfigSchema.optional()
+  openclawAgent: OpenClawAgentConfigSchema.optional(),
+  skipTailscale: z.boolean().optional()
 });
 var DeploymentStateSchema = z.object({
   status: DeploymentStatusSchema,
@@ -388,6 +393,7 @@ var DeploymentStateSchema = z.object({
       retryCount: z.number()
     })
   ),
+  gatewayToken: z.string().optional(),
   lastError: z.string().optional(),
   deployedAt: z.string().optional(),
   updatedAt: z.string()
@@ -531,6 +537,14 @@ function deleteDeployment(name) {
   }
   rmSync(deploymentDir, { recursive: true, force: true });
 }
+function updateDeploymentConfig(name, config) {
+  const configPath = getConfigPath(name);
+  if (!existsSync(configPath)) {
+    throw new Error(`Deployment "${name}" not found`);
+  }
+  const validated = DeploymentConfigSchema.parse(config);
+  writeFileSync(configPath, JSON.stringify(validated, null, 2));
+}
 function validateDeploymentName(name) {
   if (!name || name.trim() === "") {
     return { valid: false, error: "Deployment name cannot be empty" };
@@ -1196,20 +1210,36 @@ var DO_DROPLET_SIZES = [
   { slug: "s-4vcpu-8gb", label: "4 vCPU, 8GB RAM, 160GB SSD", price: "$48/mo" },
   { slug: "s-8vcpu-16gb", label: "8 vCPU, 16GB RAM, 320GB SSD", price: "$96/mo" }
 ];
-function getStepList(provider, activeTemplate) {
+function getStepList(provider, activeTemplate, editMode) {
+  if (editMode === "edit") {
+    const steps = ["api_key_choose"];
+    if (provider === "digitalocean") {
+      steps.push("droplet_size");
+    }
+    steps.push("ai_api_key_choose", "model", "telegram_token_choose", "telegram_allow_choose", "confirm");
+    return steps;
+  }
+  if (editMode === "fork") {
+    const steps = ["name", "api_key_choose"];
+    if (provider === "digitalocean") {
+      steps.push("droplet_size");
+    }
+    steps.push("ai_api_key_choose", "model", "telegram_token_choose", "telegram_allow_choose", "tailscale", "confirm");
+    return steps;
+  }
   const base = ["template_choice"];
   if (!activeTemplate) {
     base.push("name", "provider", "api_key_choose");
     if (provider === "digitalocean") {
       base.push("droplet_size");
     }
-    base.push("ai_provider", "ai_api_key_choose", "model", "telegram_token_choose", "telegram_allow_choose", "confirm");
+    base.push("ai_provider", "ai_api_key_choose", "model", "telegram_token_choose", "telegram_allow_choose", "tailscale", "confirm");
   } else {
     base.push("name", "api_key_choose");
     if (activeTemplate.provider === "digitalocean") {
       base.push("droplet_size");
     }
-    base.push("ai_api_key_choose", "model", "telegram_token_choose", "telegram_allow_choose", "confirm");
+    base.push("ai_api_key_choose", "model", "telegram_token_choose", "telegram_allow_choose", "tailscale", "confirm");
   }
   return base;
 }
@@ -1236,19 +1266,39 @@ function resolveStepForProgress(s) {
   }
 }
 function NewDeployment({ context }) {
+  const [editingConfig, setEditingConfig] = useState2(null);
+  const [editMode, setEditMode] = useState2(null);
   const [templateChoices, setTemplateChoices] = useState2([]);
   const [selectedTemplateIndex, setSelectedTemplateIndex] = useState2(0);
   const [activeTemplate, setActiveTemplate] = useState2(null);
   const [step, setStep] = useState2(() => {
+    if (context.editingDeployment) {
+      return context.editingDeployment.mode === "edit" ? "api_key_choose" : "name";
+    }
     if (context.selectedTemplate) return "name";
     return "template_choice";
   });
-  const [name, setName] = useState2("");
+  const [name, setName] = useState2(() => {
+    if (context.editingDeployment?.mode === "edit") return context.editingDeployment.config.name;
+    return "";
+  });
   const [provider, setProvider] = useState2(() => {
+    if (context.editingDeployment) return context.editingDeployment.config.provider;
     return context.selectedTemplate?.provider ?? "hetzner";
   });
-  const [apiKey, setApiKey] = useState2("");
+  const [apiKey, setApiKey] = useState2(() => {
+    if (context.editingDeployment) {
+      const cfg = context.editingDeployment.config;
+      if (cfg.provider === "hetzner" && cfg.hetzner) return cfg.hetzner.apiKey;
+      if (cfg.provider === "digitalocean" && cfg.digitalocean) return cfg.digitalocean.apiKey;
+    }
+    return "";
+  });
   const [selectedDropletSizeIndex, setSelectedDropletSizeIndex] = useState2(() => {
+    if (context.editingDeployment?.config.digitalocean) {
+      const idx = DO_DROPLET_SIZES.findIndex((s) => s.slug === context.editingDeployment.config.digitalocean.size);
+      return idx >= 0 ? idx : 0;
+    }
     if (context.selectedTemplate?.digitalocean) {
       const idx = DO_DROPLET_SIZES.findIndex((s) => s.slug === context.selectedTemplate.digitalocean.size);
       return idx >= 0 ? idx : 0;
@@ -1256,17 +1306,40 @@ function NewDeployment({ context }) {
     return 0;
   });
   const [aiProvider, setAiProvider] = useState2(() => {
+    if (context.editingDeployment?.config.openclawAgent) return context.editingDeployment.config.openclawAgent.aiProvider;
     return context.selectedTemplate?.aiProvider ?? "";
   });
-  const [aiApiKey, setAiApiKey] = useState2("");
+  const [aiApiKey, setAiApiKey] = useState2(() => {
+    if (context.editingDeployment?.config.openclawAgent) return context.editingDeployment.config.openclawAgent.aiApiKey;
+    return "";
+  });
   const [model, setModel] = useState2(() => {
+    if (context.editingDeployment?.config.openclawAgent) return context.editingDeployment.config.openclawAgent.model;
     return context.selectedTemplate?.model ?? "";
   });
-  const [telegramBotToken, setTelegramBotToken] = useState2("");
-  const [telegramAllowFrom, setTelegramAllowFrom] = useState2("");
+  const [telegramBotToken, setTelegramBotToken] = useState2(() => {
+    if (context.editingDeployment?.config.openclawAgent) return context.editingDeployment.config.openclawAgent.telegramBotToken;
+    return "";
+  });
+  const [telegramAllowFrom, setTelegramAllowFrom] = useState2(() => {
+    if (context.editingDeployment?.config.openclawAgent) return context.editingDeployment.config.openclawAgent.telegramAllowFrom ?? "";
+    return "";
+  });
+  const [enableTailscale, setEnableTailscale] = useState2(() => {
+    if (context.editingDeployment?.mode === "fork") return !context.editingDeployment.config.skipTailscale;
+    return false;
+  });
+  const [selectedTailscaleIndex, setSelectedTailscaleIndex] = useState2(() => {
+    if (context.editingDeployment?.mode === "fork" && !context.editingDeployment.config.skipTailscale) return 1;
+    return 0;
+  });
   const [error, setError] = useState2(null);
   const [isValidating, setIsValidating] = useState2(false);
   const [selectedProviderIndex, setSelectedProviderIndex] = useState2(() => {
+    if (context.editingDeployment) {
+      const idx = SUPPORTED_PROVIDERS.indexOf(context.editingDeployment.config.provider);
+      return idx >= 0 ? idx : 0;
+    }
     if (context.selectedTemplate) {
       const idx = SUPPORTED_PROVIDERS.indexOf(context.selectedTemplate.provider);
       return idx >= 0 ? idx : 0;
@@ -1274,6 +1347,10 @@ function NewDeployment({ context }) {
     return 0;
   });
   const [selectedAiProviderIndex, setSelectedAiProviderIndex] = useState2(() => {
+    if (context.editingDeployment?.config.openclawAgent) {
+      const idx = AI_PROVIDERS.findIndex((p) => p.name === context.editingDeployment.config.openclawAgent.aiProvider);
+      return idx >= 0 ? idx : 0;
+    }
     if (context.selectedTemplate) {
       const idx = AI_PROVIDERS.findIndex((p) => p.name === context.selectedTemplate.aiProvider);
       return idx >= 0 ? idx : 0;
@@ -1286,12 +1363,39 @@ function NewDeployment({ context }) {
   const [savedTelegramUsers, setSavedTelegramUsers] = useState2([]);
   const [selectedSavedKeyIndex, setSelectedSavedKeyIndex] = useState2(0);
   const [newKeyName, setNewKeyName] = useState2("");
-  const [apiKeyFromSaved, setApiKeyFromSaved] = useState2(false);
-  const [aiApiKeyFromSaved, setAiApiKeyFromSaved] = useState2(false);
-  const [telegramTokenFromSaved, setTelegramTokenFromSaved] = useState2(false);
-  const [telegramAllowFromSaved, setTelegramAllowFromSaved] = useState2(false);
+  const [apiKeyFromSaved, setApiKeyFromSaved] = useState2(() => !!context.editingDeployment);
+  const [aiApiKeyFromSaved, setAiApiKeyFromSaved] = useState2(() => !!context.editingDeployment);
+  const [telegramTokenFromSaved, setTelegramTokenFromSaved] = useState2(() => !!context.editingDeployment);
+  const [telegramAllowFromSaved, setTelegramAllowFromSaved] = useState2(() => !!context.editingDeployment);
   useEffect(() => {
-    if (context.selectedTemplate) {
+    if (context.editingDeployment) {
+      const ed = context.editingDeployment;
+      setEditingConfig(ed.config);
+      setEditMode(ed.mode);
+      const syntheticTemplate = {
+        id: "__editing__",
+        name: ed.config.name,
+        description: "Editing deployment",
+        builtIn: false,
+        createdAt: ed.config.createdAt,
+        provider: ed.config.provider,
+        hetzner: ed.config.hetzner ? {
+          serverType: ed.config.hetzner.serverType,
+          location: ed.config.hetzner.location,
+          image: ed.config.hetzner.image
+        } : void 0,
+        digitalocean: ed.config.digitalocean ? {
+          size: ed.config.digitalocean.size,
+          region: ed.config.digitalocean.region,
+          image: ed.config.digitalocean.image
+        } : void 0,
+        aiProvider: ed.config.openclawAgent?.aiProvider ?? "",
+        model: ed.config.openclawAgent?.model ?? "",
+        channel: ed.config.openclawAgent?.channel ?? "telegram"
+      };
+      setActiveTemplate(syntheticTemplate);
+      context.setEditingDeployment(null);
+    } else if (context.selectedTemplate) {
       setActiveTemplate(context.selectedTemplate);
       context.setSelectedTemplate(null);
     }
@@ -1336,6 +1440,8 @@ function NewDeployment({ context }) {
     step,
     selectedDropletSizeIndex,
     activeTemplate,
+    editingConfig,
+    editMode,
     savedProviderKeys,
     savedAiKeys,
     savedTelegramTokens,
@@ -1345,7 +1451,9 @@ function NewDeployment({ context }) {
     apiKeyFromSaved,
     aiApiKeyFromSaved,
     telegramTokenFromSaved,
-    telegramAllowFromSaved
+    telegramAllowFromSaved,
+    enableTailscale,
+    selectedTailscaleIndex
   });
   stateRef.current = {
     name,
@@ -1359,6 +1467,8 @@ function NewDeployment({ context }) {
     step,
     selectedDropletSizeIndex,
     activeTemplate,
+    editingConfig,
+    editMode,
     savedProviderKeys,
     savedAiKeys,
     savedTelegramTokens,
@@ -1368,10 +1478,12 @@ function NewDeployment({ context }) {
     apiKeyFromSaved,
     aiApiKeyFromSaved,
     telegramTokenFromSaved,
-    telegramAllowFromSaved
+    telegramAllowFromSaved,
+    enableTailscale,
+    selectedTailscaleIndex
   };
   debugLog(`RENDER: step=${step}, apiKey.length=${apiKey?.length ?? "null"}`);
-  const stepList = getStepList(provider, activeTemplate);
+  const stepList = getStepList(provider, activeTemplate, editMode ?? void 0);
   const handleConfirmFromRef = () => {
     const s = stateRef.current;
     debugLog(`handleConfirmFromRef CALLED: apiKey.length=${s.apiKey?.length ?? "null"}`);
@@ -1410,7 +1522,7 @@ function NewDeployment({ context }) {
       const config = {
         name: s.name,
         provider: s.provider,
-        createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+        createdAt: s.editingConfig?.createdAt ?? (/* @__PURE__ */ new Date()).toISOString(),
         hetzner: s.provider === "hetzner" ? {
           apiKey: s.apiKey,
           serverType: tmpl?.hetzner?.serverType ?? "cpx11",
@@ -1424,6 +1536,7 @@ function NewDeployment({ context }) {
           image: tmpl?.digitalocean?.image ?? "ubuntu-24-04-x64"
         } : void 0,
         openclawConfig: void 0,
+        skipTailscale: !s.enableTailscale,
         openclawAgent: {
           aiProvider: s.aiProvider,
           aiApiKey: s.aiApiKey,
@@ -1433,11 +1546,16 @@ function NewDeployment({ context }) {
           telegramAllowFrom: s.telegramAllowFrom
         }
       };
-      createDeployment(config);
+      if (s.editingConfig && s.editMode === "edit") {
+        const updatedConfig = { ...config, name: s.editingConfig.name, createdAt: s.editingConfig.createdAt };
+        updateDeploymentConfig(s.editingConfig.name, updatedConfig);
+      } else {
+        createDeployment(config);
+      }
       context.refreshDeployments();
       setStep("complete");
     } catch (err) {
-      setError(`Failed to create deployment: ${err instanceof Error ? err.message : String(err)}`);
+      setError(`Failed to ${s.editMode === "edit" ? "update" : "create"} deployment: ${err instanceof Error ? err.message : String(err)}`);
     }
   };
   useKeyboard((key) => {
@@ -1629,7 +1747,7 @@ function NewDeployment({ context }) {
           setTelegramAllowFrom(saved.value);
           setTelegramAllowFromSaved(true);
           setError(null);
-          setStep("confirm");
+          setStep(currentState.editMode === "edit" ? "confirm" : "tailscale");
         }
       } else if (key.name === "escape") {
         setStep("telegram_token_choose");
@@ -1666,13 +1784,26 @@ function NewDeployment({ context }) {
         setStep("telegram_allow_name");
         setNewKeyName("");
       } else if (key.name === "n" || key.name === "escape") {
+        setStep(currentState.editMode === "edit" ? "confirm" : "tailscale");
+      }
+    } else if (currentState.step === "tailscale") {
+      const TAILSCALE_OPTIONS = ["Skip", "Configure Tailscale"];
+      if (key.name === "up") {
+        setSelectedTailscaleIndex((prev) => Math.max(0, prev - 1));
+      } else if (key.name === "down") {
+        setSelectedTailscaleIndex((prev) => Math.min(TAILSCALE_OPTIONS.length - 1, prev + 1));
+      } else if (key.name === "return") {
+        setEnableTailscale(currentState.selectedTailscaleIndex === 1);
+        setError(null);
         setStep("confirm");
+      } else if (key.name === "escape") {
+        setStep("telegram_allow_choose");
       }
     } else if (currentState.step === "confirm") {
       if (key.name === "y" || key.name === "return") {
         handleConfirmFromRef();
       } else if (key.name === "n" || key.name === "escape") {
-        setStep("telegram_allow_choose");
+        setStep(currentState.editMode === "edit" ? "telegram_allow_choose" : "tailscale");
       }
     } else if (currentState.step === "complete") {
       context.navigateTo("home");
@@ -1794,7 +1925,7 @@ function NewDeployment({ context }) {
     }
     setError(null);
     if (telegramAllowFromSaved) {
-      setStep("confirm");
+      setStep(editMode === "edit" ? "confirm" : "tailscale");
     } else {
       setStep("telegram_allow_save");
     }
@@ -2508,10 +2639,10 @@ function NewDeployment({ context }) {
                   setNewKeyName(value);
                 }
               },
-              onSubmit: () => handleSaveKeyName("telegram-user", telegramAllowFrom, "confirm"),
+              onSubmit: () => handleSaveKeyName("telegram-user", telegramAllowFrom, editMode === "edit" ? "confirm" : "tailscale"),
               onKeyDown: (e) => {
                 if (e.name === "escape") {
-                  setStep("confirm");
+                  setStep(editMode === "edit" ? "confirm" : "tailscale");
                 }
               }
             }
@@ -2519,6 +2650,41 @@ function NewDeployment({ context }) {
           error && /* @__PURE__ */ jsx2("text", { fg: t.status.error, marginTop: 1, children: error }),
           /* @__PURE__ */ jsx2("text", { fg: t.fg.muted, marginTop: 2, children: "Press Enter to save, Esc to skip" })
         ] });
+      case "tailscale": {
+        const tailscaleOptions = [
+          { label: "Skip", description: "Use SSH tunnel via /dashboard instead" },
+          { label: "Configure Tailscale", description: "Private VPN between your devices and the server" }
+        ];
+        return /* @__PURE__ */ jsxs2("box", { flexDirection: "column", children: [
+          /* @__PURE__ */ jsxs2("text", { fg: t.accent, children: [
+            "Step ",
+            currentStepNumber("tailscale"),
+            ": Tailscale Setup (Optional)"
+          ] }),
+          /* @__PURE__ */ jsx2("text", { fg: t.fg.secondary, marginTop: 1, children: "Tailscale creates a private VPN between your devices and your OpenClaw server." }),
+          /* @__PURE__ */ jsx2("text", { fg: t.fg.secondary, children: "You can skip this and use an SSH tunnel instead (the /dashboard command sets one up automatically)." }),
+          /* @__PURE__ */ jsx2(
+            "box",
+            {
+              flexDirection: "column",
+              borderStyle: "single",
+              borderColor: t.border.default,
+              marginTop: 1,
+              padding: 1,
+              children: tailscaleOptions.map((opt, i) => {
+                const isSelected = i === selectedTailscaleIndex;
+                return /* @__PURE__ */ jsxs2("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
+                  /* @__PURE__ */ jsx2("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx2("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: opt.label }),
+                  /* @__PURE__ */ jsx2("text", { fg: isSelected ? t.fg.primary : t.fg.secondary, children: " - " + opt.description })
+                ] }, opt.label);
+              })
+            }
+          ),
+          error && /* @__PURE__ */ jsx2("text", { fg: t.status.error, marginTop: 1, children: error }),
+          /* @__PURE__ */ jsx2("text", { fg: t.fg.muted, marginTop: 1, children: "Press Enter to select, Esc to go back" })
+        ] });
+      }
       case "confirm":
         return /* @__PURE__ */ jsxs2("box", { flexDirection: "column", children: [
           /* @__PURE__ */ jsxs2("text", { fg: t.accent, children: [
@@ -2578,6 +2744,10 @@ function NewDeployment({ context }) {
                 /* @__PURE__ */ jsxs2("box", { flexDirection: "row", children: [
                   /* @__PURE__ */ jsx2("text", { fg: t.fg.secondary, width: 20, children: "Allow From:" }),
                   /* @__PURE__ */ jsx2("text", { fg: t.fg.primary, children: telegramAllowFrom || "N/A" })
+                ] }),
+                /* @__PURE__ */ jsxs2("box", { flexDirection: "row", children: [
+                  /* @__PURE__ */ jsx2("text", { fg: t.fg.secondary, width: 20, children: "Tailscale:" }),
+                  /* @__PURE__ */ jsx2("text", { fg: enableTailscale ? t.status.success : t.fg.muted, children: enableTailscale ? "Enabled" : "Skipped" })
                 ] })
               ]
             }
@@ -2587,7 +2757,7 @@ function NewDeployment({ context }) {
         ] });
       case "complete":
         return /* @__PURE__ */ jsxs2("box", { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx2("text", { fg: t.status.success, children: "Deployment Configuration Created!" }),
+          /* @__PURE__ */ jsx2("text", { fg: t.status.success, children: editMode === "edit" ? "Deployment Updated Successfully!" : "Deployment Configuration Created!" }),
           /* @__PURE__ */ jsxs2(
             "box",
             {
@@ -2597,14 +2767,10 @@ function NewDeployment({ context }) {
               padding: 1,
               marginTop: 1,
               children: [
-                /* @__PURE__ */ jsxs2("text", { fg: t.fg.primary, children: [
-                  'Your deployment "',
-                  name,
-                  '" has been initialized.'
-                ] }),
+                /* @__PURE__ */ jsx2("text", { fg: t.fg.primary, children: editMode === "edit" ? `Your deployment "${editingConfig?.name ?? name}" has been updated.` : `Your deployment "${name}" has been initialized.` }),
                 /* @__PURE__ */ jsxs2("text", { fg: t.fg.secondary, marginTop: 1, children: [
                   "Configuration saved to: ~/.clawcontrol/deployments/",
-                  name,
+                  editingConfig?.name ?? name,
                   "/"
                 ] }),
                 /* @__PURE__ */ jsxs2("text", { fg: t.fg.secondary, marginTop: 1, children: [
@@ -2621,15 +2787,15 @@ function NewDeployment({ context }) {
               ]
             }
           ),
-          /* @__PURE__ */ jsx2("text", { fg: t.accent, marginTop: 2, children: "Next step: Run /deploy to deploy this configuration" }),
+          editMode !== "edit" && /* @__PURE__ */ jsx2("text", { fg: t.accent, marginTop: 2, children: "Next step: Run /deploy to deploy this configuration" }),
           /* @__PURE__ */ jsx2("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
         ] });
     }
   };
   return /* @__PURE__ */ jsxs2("box", { flexDirection: "column", width: "100%", padding: 1, children: [
     /* @__PURE__ */ jsxs2("box", { flexDirection: "row", marginBottom: 2, children: [
-      /* @__PURE__ */ jsx2("text", { fg: t.accent, children: "/new" }),
-      /* @__PURE__ */ jsx2("text", { fg: t.fg.secondary, children: " - Initialize a new deployment" })
+      /* @__PURE__ */ jsx2("text", { fg: t.accent, children: editMode === "edit" ? "/list" : "/new" }),
+      /* @__PURE__ */ jsx2("text", { fg: t.fg.secondary, children: editMode === "edit" ? ` - Edit Deployment: ${editingConfig?.name ?? ""}` : editMode === "fork" ? " - Fork Deployment" : " - Initialize a new deployment" })
     ] }),
     /* @__PURE__ */ jsx2("box", { flexDirection: "row", marginBottom: 2, children: stepList.map((s, i) => {
       const resolvedStep = resolveStepForProgress(step);
@@ -2644,46 +2810,81 @@ function NewDeployment({ context }) {
   ] });
 }
 
-// src/components/DeployView.tsx
-import { useState as useState3 } from "react";
+// src/components/ListView.tsx
+import { useState as useState3, useRef as useRef2 } from "react";
 import { useKeyboard as useKeyboard2 } from "@opentui/react";
-import { jsx as jsx3, jsxs as jsxs3 } from "@opentui/react/jsx-runtime";
-function DeployView({ context }) {
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "@opentui/react/jsx-runtime";
+function ListView({ context }) {
+  const [viewState, setViewState] = useState3("listing");
   const [selectedIndex, setSelectedIndex] = useState3(0);
-  const [confirmMode, setConfirmMode] = useState3(false);
+  const [confirmText, setConfirmText] = useState3("");
+  const [error, setError] = useState3(null);
+  const [deletedName, setDeletedName] = useState3("");
   const deployments = context.deployments;
-  const notDeployed = deployments.filter((d) => d.state.status !== "deployed");
-  const deployed = deployments.filter((d) => d.state.status === "deployed");
-  const allDeployments = [...notDeployed, ...deployed];
-  const selectedDeployment = allDeployments[selectedIndex];
+  const selectedDeployment = deployments[selectedIndex];
+  const stateRef = useRef2({ viewState, selectedIndex });
+  stateRef.current = { viewState, selectedIndex };
   useKeyboard2((key) => {
-    if (allDeployments.length === 0) {
+    const current = stateRef.current;
+    if (deployments.length === 0) {
       context.navigateTo("home");
       return;
     }
-    if (confirmMode) {
-      if (key.name === "y" || key.name === "return") {
-        context.navigateTo("deploying", selectedDeployment.config.name);
-      } else if (key.name === "n" || key.name === "escape") {
-        setConfirmMode(false);
-      }
-    } else {
-      if (key.name === "up" && selectedIndex > 0) {
-        setSelectedIndex(selectedIndex - 1);
-      } else if (key.name === "down" && selectedIndex < allDeployments.length - 1) {
-        setSelectedIndex(selectedIndex + 1);
+    if (current.viewState === "listing") {
+      if (key.name === "up" && current.selectedIndex > 0) {
+        setSelectedIndex(current.selectedIndex - 1);
+      } else if (key.name === "down" && current.selectedIndex < deployments.length - 1) {
+        setSelectedIndex(current.selectedIndex + 1);
       } else if (key.name === "return") {
-        setConfirmMode(true);
+        setViewState("detail");
       } else if (key.name === "escape") {
         context.navigateTo("home");
       }
+    } else if (current.viewState === "detail") {
+      const dep = deployments[current.selectedIndex];
+      if (!dep) return;
+      if (key.name === "e" && dep.state.status === "initialized") {
+        context.setEditingDeployment({ config: dep.config, mode: "edit" });
+        context.navigateTo("new");
+      } else if (key.name === "f") {
+        context.setEditingDeployment({ config: dep.config, mode: "fork" });
+        context.navigateTo("new");
+      } else if (key.name === "d") {
+        if (dep.state.status === "initialized") {
+          setConfirmText("");
+          setError(null);
+          setViewState("delete_confirm");
+        } else {
+          setError("Deployed agents must be destroyed first using the /destroy command.");
+        }
+      } else if (key.name === "escape") {
+        setError(null);
+        setViewState("listing");
+      }
+    } else if (current.viewState === "success") {
+      context.navigateTo("home");
+    } else if (current.viewState === "error") {
+      setError(null);
+      setViewState("listing");
     }
   });
-  if (allDeployments.length === 0) {
+  const handleDelete = (name) => {
+    setViewState("deleting");
+    try {
+      deleteDeployment(name);
+      setDeletedName(name);
+      context.refreshDeployments();
+      setViewState("success");
+    } catch (err) {
+      setError(err instanceof Error ? err.message : String(err));
+      setViewState("error");
+    }
+  };
+  if (deployments.length === 0) {
     return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
       /* @__PURE__ */ jsxs3("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx3("text", { fg: t.accent, children: "/deploy" }),
-        /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, children: " - Deploy a configuration" })
+        /* @__PURE__ */ jsx3("text", { fg: t.accent, children: "/list" }),
+        /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, children: " - Deployments" })
       ] }),
       /* @__PURE__ */ jsxs3(
         "box",
@@ -2694,157 +2895,432 @@ function DeployView({ context }) {
           padding: 1,
           children: [
             /* @__PURE__ */ jsx3("text", { fg: t.status.warning, children: "No deployments found!" }),
-            /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, marginTop: 1, children: "Run /new first to create a deployment configuration." })
+            /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, marginTop: 1, children: "Run /new to create a deployment." })
           ]
         }
       ),
       /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   }
-  if (confirmMode) {
+  if (viewState === "listing") {
     return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
       /* @__PURE__ */ jsxs3("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx3("text", { fg: t.accent, children: "/deploy" }),
-        /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, children: " - Confirm deployment" })
+        /* @__PURE__ */ jsx3("text", { fg: t.accent, children: "/list" }),
+        /* @__PURE__ */ jsxs3("text", { fg: t.fg.secondary, children: [
+          " - Deployments (",
+          deployments.length,
+          ")"
+        ] })
       ] }),
-      /* @__PURE__ */ jsxs3(
+      /* @__PURE__ */ jsx3(
         "box",
         {
           flexDirection: "column",
           borderStyle: "single",
           borderColor: t.border.default,
           padding: 1,
+          children: deployments.map((dep, index) => {
+            const isSelected = index === selectedIndex;
+            return /* @__PURE__ */ jsxs3(
+              "box",
+              {
+                flexDirection: "row",
+                backgroundColor: isSelected ? t.selection.bg : void 0,
+                children: [
+                  /* @__PURE__ */ jsx3("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx3("text", { fg: isSelected ? t.selection.fg : t.fg.primary, width: 25, children: dep.config.name }),
+                  /* @__PURE__ */ jsxs3("text", { fg: statusColor(dep.state.status), width: 16, children: [
+                    "[",
+                    dep.state.status,
+                    "]"
+                  ] }),
+                  /* @__PURE__ */ jsx3("text", { fg: isSelected ? t.fg.secondary : t.fg.muted, children: PROVIDER_NAMES[dep.config.provider] })
+                ]
+              },
+              dep.config.name
+            );
+          })
+        }
+      ),
+      /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, marginTop: 2, children: "Up/Down: Select | Enter: Details | Esc: Back" })
+    ] });
+  }
+  if (viewState === "detail" && selectedDeployment) {
+    const dep = selectedDeployment;
+    const isInitialized = dep.state.status === "initialized";
+    return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs3("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx3("text", { fg: t.accent, children: "/list" }),
+        /* @__PURE__ */ jsxs3("text", { fg: t.fg.secondary, children: [
+          " - ",
+          dep.config.name
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs3(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.focus,
+          padding: 1,
+          marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsxs3("text", { fg: t.status.warning, children: [
-              'Deploy "',
-              selectedDeployment.config.name,
-              '"?'
+            /* @__PURE__ */ jsx3("text", { fg: t.accent, marginBottom: 1, children: "Deployment Details" }),
+            /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Name:" }),
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: dep.config.name })
             ] }),
-            /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, marginTop: 1, children: "This will:" }),
-            /* @__PURE__ */ jsxs3("text", { fg: t.fg.primary, children: [
-              "\u2022 Create a VPS on ",
-              selectedDeployment.config.provider
+            /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Status:" }),
+              /* @__PURE__ */ jsx3("text", { fg: statusColor(dep.state.status), children: dep.state.status })
+            ] }),
+            /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Provider:" }),
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: PROVIDER_NAMES[dep.config.provider] })
+            ] }),
+            /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Created:" }),
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: new Date(dep.config.createdAt).toLocaleString() })
+            ] }),
+            dep.state.serverIp && /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Server IP:" }),
+              /* @__PURE__ */ jsx3("text", { fg: t.accent, children: dep.state.serverIp })
+            ] }),
+            dep.config.provider === "hetzner" && dep.config.hetzner && /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Server Type:" }),
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: dep.config.hetzner.serverType })
             ] }),
-            /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: "\u2022 Install and configure OpenClaw" }),
-            /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: "\u2022 Set up Tailscale for secure access" }),
-            /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, marginTop: 1, children: "Estimated cost: ~$4.99/month (Hetzner CPX11)" })
+            dep.config.provider === "digitalocean" && dep.config.digitalocean && /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Droplet Size:" }),
+              /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: dep.config.digitalocean.size })
+            ] }),
+            dep.config.openclawAgent && /* @__PURE__ */ jsxs3(Fragment, { children: [
+              /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "AI Provider:" }),
+                /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: dep.config.openclawAgent.aiProvider })
+              ] }),
+              /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Model:" }),
+                /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: dep.config.openclawAgent.model })
+              ] }),
+              /* @__PURE__ */ jsxs3("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, width: 20, children: "Channel:" }),
+                /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, children: dep.config.openclawAgent.channel })
+              ] })
+            ] })
           ]
         }
       ),
-      /* @__PURE__ */ jsx3("text", { fg: t.status.warning, marginTop: 2, children: "Press Y to confirm, N to cancel" })
+      /* @__PURE__ */ jsxs3("box", { flexDirection: "row", marginBottom: 1, children: [
+        isInitialized && /* @__PURE__ */ jsx3("text", { fg: t.accent, marginRight: 2, children: "[E]dit" }),
+        /* @__PURE__ */ jsx3("text", { fg: t.accent, marginRight: 2, children: "[F]ork" }),
+        isInitialized ? /* @__PURE__ */ jsx3("text", { fg: t.status.error, children: "[D]elete" }) : /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, children: "[D]elete (use /destroy)" })
+      ] }),
+      error && /* @__PURE__ */ jsx3("text", { fg: t.status.error, marginTop: 1, children: error }),
+      /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, marginTop: 1, children: "Esc: Back to list" })
     ] });
   }
-  return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-    /* @__PURE__ */ jsxs3("box", { flexDirection: "row", marginBottom: 2, children: [
-      /* @__PURE__ */ jsx3("text", { fg: t.accent, children: "/deploy" }),
-      /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, children: " - Select a deployment to deploy" })
-    ] }),
-    /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, marginBottom: 1, children: "Use arrow keys to select, Enter to deploy:" }),
-    /* @__PURE__ */ jsx3(
-      "box",
-      {
-        flexDirection: "column",
-        borderStyle: "single",
-        borderColor: t.border.default,
-        padding: 1,
-        children: allDeployments.map((deployment, index) => {
-          const isSelected = index === selectedIndex;
-          return /* @__PURE__ */ jsxs3(
-            "box",
-            {
-              flexDirection: "row",
-              backgroundColor: isSelected ? t.selection.bg : void 0,
-              children: [
-                /* @__PURE__ */ jsx3("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
-                /* @__PURE__ */ jsx3("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
-                /* @__PURE__ */ jsxs3("text", { fg: statusColor(deployment.state.status), width: 15, children: [
-                  "[",
-                  deployment.state.status,
-                  "]"
-                ] }),
-                /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, children: deployment.config.provider })
-              ]
-            },
-            deployment.config.name
-          );
-        })
-      }
-    ),
-    /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, marginTop: 2, children: "Press Esc to go back" })
-  ] });
-}
-
-// src/components/DeployingView.tsx
-import { useState as useState4, useEffect as useEffect2, useCallback, useRef as useRef2 } from "react";
-import { useKeyboard as useKeyboard3 } from "@opentui/react";
-import open from "open";
-
-// src/services/ssh.ts
-import { Client } from "ssh2";
-import { generateKeyPairSync, randomBytes } from "crypto";
-import { readFileSync as readFileSync4, writeFileSync as writeFileSync4, chmodSync, existsSync as existsSync4 } from "fs";
-import { mkdirSync as mkdirSync4 } from "fs";
-function generateSSHKeyPair(comment = "clawcontrol") {
-  const { privateKey, publicKey } = generateKeyPairSync("ed25519", {
-    publicKeyEncoding: {
-      type: "spki",
-      format: "pem"
-    },
-    privateKeyEncoding: {
-      type: "pkcs8",
-      format: "pem"
-    }
-  });
-  const pubKeyDer = extractDERFromPEM(publicKey);
-  const privKeyDer = extractDERFromPEM(privateKey);
-  const publicKeyBytes = pubKeyDer.slice(-32);
-  const privateKeyBytes = privKeyDer.slice(-32);
-  const publicKeyOpenSSH = buildOpenSSHPublicKey(publicKeyBytes, comment);
-  const privateKeyOpenSSH = buildOpenSSHPrivateKey(privateKeyBytes, publicKeyBytes, comment);
-  return {
-    privateKey: privateKeyOpenSSH,
-    publicKey: publicKeyOpenSSH
-  };
-}
-function extractDERFromPEM(pem) {
-  const lines = pem.split("\n").filter((line) => !line.startsWith("-----") && line.trim() !== "");
-  return Buffer.from(lines.join(""), "base64");
-}
-function buildOpenSSHPublicKey(publicKeyBytes, comment) {
-  const keyType = Buffer.from("ssh-ed25519");
-  const keyTypeLen = Buffer.alloc(4);
-  keyTypeLen.writeUInt32BE(keyType.length);
-  const keyLen = Buffer.alloc(4);
-  keyLen.writeUInt32BE(publicKeyBytes.length);
-  const opensshKey = Buffer.concat([keyTypeLen, keyType, keyLen, publicKeyBytes]);
-  return `ssh-ed25519 ${opensshKey.toString("base64")} ${comment}`;
-}
-function buildOpenSSHPrivateKey(privateKeyBytes, publicKeyBytes, comment) {
-  const AUTH_MAGIC = Buffer.from("openssh-key-v1\0");
-  const cipherName = Buffer.from("none");
-  const kdfName = Buffer.from("none");
-  const kdfOptions = Buffer.alloc(0);
-  const numKeys = 1;
-  const keyType = Buffer.from("ssh-ed25519");
-  const pubKeyBlob = Buffer.concat([
-    uint32BE(keyType.length),
-    keyType,
-    uint32BE(publicKeyBytes.length),
-    publicKeyBytes
-  ]);
-  const checkInt = randomBytes(4);
-  const ed25519PrivKey = Buffer.concat([privateKeyBytes, publicKeyBytes]);
-  const commentBuf = Buffer.from(comment);
-  const privateSection = Buffer.concat([
-    checkInt,
-    checkInt,
-    // Two identical check integers
-    uint32BE(keyType.length),
-    keyType,
-    uint32BE(publicKeyBytes.length),
-    publicKeyBytes,
-    uint32BE(ed25519PrivKey.length),
-    ed25519PrivKey,
+  if (viewState === "delete_confirm" && selectedDeployment) {
+    return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsx3("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsx3("text", { fg: t.status.error, children: "Confirm Deletion" }) }),
+      /* @__PURE__ */ jsxs3(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "double",
+          borderColor: t.status.error,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsx3("text", { fg: t.status.error, children: "You are about to delete:" }),
+            /* @__PURE__ */ jsxs3("text", { fg: t.fg.primary, marginTop: 1, children: [
+              "Deployment: ",
+              selectedDeployment.config.name
+            ] }),
+            /* @__PURE__ */ jsx3("text", { fg: t.status.error, marginTop: 1, children: "This will permanently delete:" }),
+            /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, children: "  Local configuration files" }),
+            /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, children: "  SSH keys" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx3("text", { fg: t.status.warning, marginTop: 2, children: "Type the deployment name to confirm:" }),
+      /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, marginTop: 1, children: "Confirm:" }),
+      /* @__PURE__ */ jsx3(
+        "input",
+        {
+          value: confirmText,
+          placeholder: selectedDeployment.config.name,
+          focused: true,
+          onInput: (value) => setConfirmText(value),
+          onSubmit: (value) => {
+            if (value === selectedDeployment.config.name) {
+              handleDelete(selectedDeployment.config.name);
+            } else {
+              setError("Name does not match. Please type the exact deployment name.");
+            }
+          },
+          onKeyDown: (e) => {
+            if (e.name === "escape") {
+              setViewState("detail");
+              setConfirmText("");
+              setError(null);
+            }
+          }
+        }
+      ),
+      error && /* @__PURE__ */ jsx3("text", { fg: t.status.error, marginTop: 1, children: error }),
+      /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, marginTop: 2, children: "Press Esc to cancel" })
+    ] });
+  }
+  if (viewState === "deleting") {
+    return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsx3("text", { fg: t.status.warning, children: "Deleting deployment..." }),
+      /* @__PURE__ */ jsx3("text", { fg: t.fg.secondary, marginTop: 1, children: "Removing local configuration files..." })
+    ] });
+  }
+  if (viewState === "success") {
+    return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs3(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.status.success,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsx3("text", { fg: t.status.success, children: "Deployment Deleted" }),
+            /* @__PURE__ */ jsxs3("text", { fg: t.fg.primary, marginTop: 1, children: [
+              'The deployment "',
+              deletedName,
+              '" has been permanently deleted.'
+            ] })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+    ] });
+  }
+  if (viewState === "error") {
+    return /* @__PURE__ */ jsxs3("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs3(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.status.error,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsx3("text", { fg: t.status.error, children: "Deletion Failed" }),
+            /* @__PURE__ */ jsx3("text", { fg: t.fg.primary, marginTop: 1, children: error })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx3("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to go back" })
+    ] });
+  }
+  return null;
+}
+
+// src/components/DeployView.tsx
+import { useState as useState4 } from "react";
+import { useKeyboard as useKeyboard3 } from "@opentui/react";
+import { jsx as jsx4, jsxs as jsxs4 } from "@opentui/react/jsx-runtime";
+function DeployView({ context }) {
+  const [selectedIndex, setSelectedIndex] = useState4(0);
+  const [confirmMode, setConfirmMode] = useState4(false);
+  const deployments = context.deployments;
+  const notDeployed = deployments.filter((d) => d.state.status !== "deployed");
+  const deployed = deployments.filter((d) => d.state.status === "deployed");
+  const allDeployments = [...notDeployed, ...deployed];
+  const selectedDeployment = allDeployments[selectedIndex];
+  useKeyboard3((key) => {
+    if (allDeployments.length === 0) {
+      context.navigateTo("home");
+      return;
+    }
+    if (confirmMode) {
+      if (key.name === "y" || key.name === "return") {
+        context.navigateTo("deploying", selectedDeployment.config.name);
+      } else if (key.name === "n" || key.name === "escape") {
+        setConfirmMode(false);
+      }
+    } else {
+      if (key.name === "up" && selectedIndex > 0) {
+        setSelectedIndex(selectedIndex - 1);
+      } else if (key.name === "down" && selectedIndex < allDeployments.length - 1) {
+        setSelectedIndex(selectedIndex + 1);
+      } else if (key.name === "return") {
+        setConfirmMode(true);
+      } else if (key.name === "escape") {
+        context.navigateTo("home");
+      }
+    }
+  });
+  if (allDeployments.length === 0) {
+    return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs4("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx4("text", { fg: t.accent, children: "/deploy" }),
+        /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: " - Deploy a configuration" })
+      ] }),
+      /* @__PURE__ */ jsxs4(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.default,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsx4("text", { fg: t.status.warning, children: "No deployments found!" }),
+            /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, marginTop: 1, children: "Run /new first to create a deployment configuration." })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx4("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+    ] });
+  }
+  if (confirmMode) {
+    return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs4("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx4("text", { fg: t.accent, children: "/deploy" }),
+        /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: " - Confirm deployment" })
+      ] }),
+      /* @__PURE__ */ jsxs4(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.default,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsxs4("text", { fg: t.status.warning, children: [
+              'Deploy "',
+              selectedDeployment.config.name,
+              '"?'
+            ] }),
+            /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, marginTop: 1, children: "This will:" }),
+            /* @__PURE__ */ jsxs4("text", { fg: t.fg.primary, children: [
+              "\u2022 Create a VPS on ",
+              selectedDeployment.config.provider
+            ] }),
+            /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "\u2022 Install and configure OpenClaw" }),
+            /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "\u2022 Set up Tailscale for secure access" }),
+            /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, marginTop: 1, children: "Estimated cost: ~$4.99/month (Hetzner CPX11)" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx4("text", { fg: t.status.warning, marginTop: 2, children: "Press Y to confirm, N to cancel" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+    /* @__PURE__ */ jsxs4("box", { flexDirection: "row", marginBottom: 2, children: [
+      /* @__PURE__ */ jsx4("text", { fg: t.accent, children: "/deploy" }),
+      /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: " - Select a deployment to deploy" })
+    ] }),
+    /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, marginBottom: 1, children: "Use arrow keys to select, Enter to deploy:" }),
+    /* @__PURE__ */ jsx4(
+      "box",
+      {
+        flexDirection: "column",
+        borderStyle: "single",
+        borderColor: t.border.default,
+        padding: 1,
+        children: allDeployments.map((deployment, index) => {
+          const isSelected = index === selectedIndex;
+          return /* @__PURE__ */ jsxs4(
+            "box",
+            {
+              flexDirection: "row",
+              backgroundColor: isSelected ? t.selection.bg : void 0,
+              children: [
+                /* @__PURE__ */ jsx4("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
+                /* @__PURE__ */ jsx4("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
+                /* @__PURE__ */ jsxs4("text", { fg: statusColor(deployment.state.status), width: 15, children: [
+                  "[",
+                  deployment.state.status,
+                  "]"
+                ] }),
+                /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: deployment.config.provider })
+              ]
+            },
+            deployment.config.name
+          );
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx4("text", { fg: t.fg.muted, marginTop: 2, children: "Press Esc to go back" })
+  ] });
+}
+
+// src/components/DeployingView.tsx
+import { useState as useState5, useEffect as useEffect2, useCallback, useRef as useRef3 } from "react";
+import { useKeyboard as useKeyboard4 } from "@opentui/react";
+import open from "open";
+
+// src/services/ssh.ts
+import { Client } from "ssh2";
+import { generateKeyPairSync, randomBytes } from "crypto";
+import { readFileSync as readFileSync4, writeFileSync as writeFileSync4, chmodSync, existsSync as existsSync4 } from "fs";
+import { mkdirSync as mkdirSync4 } from "fs";
+function generateSSHKeyPair(comment = "clawcontrol") {
+  const { privateKey, publicKey } = generateKeyPairSync("ed25519", {
+    publicKeyEncoding: {
+      type: "spki",
+      format: "pem"
+    },
+    privateKeyEncoding: {
+      type: "pkcs8",
+      format: "pem"
+    }
+  });
+  const pubKeyDer = extractDERFromPEM(publicKey);
+  const privKeyDer = extractDERFromPEM(privateKey);
+  const publicKeyBytes = pubKeyDer.slice(-32);
+  const privateKeyBytes = privKeyDer.slice(-32);
+  const publicKeyOpenSSH = buildOpenSSHPublicKey(publicKeyBytes, comment);
+  const privateKeyOpenSSH = buildOpenSSHPrivateKey(privateKeyBytes, publicKeyBytes, comment);
+  return {
+    privateKey: privateKeyOpenSSH,
+    publicKey: publicKeyOpenSSH
+  };
+}
+function extractDERFromPEM(pem) {
+  const lines = pem.split("\n").filter((line) => !line.startsWith("-----") && line.trim() !== "");
+  return Buffer.from(lines.join(""), "base64");
+}
+function buildOpenSSHPublicKey(publicKeyBytes, comment) {
+  const keyType = Buffer.from("ssh-ed25519");
+  const keyTypeLen = Buffer.alloc(4);
+  keyTypeLen.writeUInt32BE(keyType.length);
+  const keyLen = Buffer.alloc(4);
+  keyLen.writeUInt32BE(publicKeyBytes.length);
+  const opensshKey = Buffer.concat([keyTypeLen, keyType, keyLen, publicKeyBytes]);
+  return `ssh-ed25519 ${opensshKey.toString("base64")} ${comment}`;
+}
+function buildOpenSSHPrivateKey(privateKeyBytes, publicKeyBytes, comment) {
+  const AUTH_MAGIC = Buffer.from("openssh-key-v1\0");
+  const cipherName = Buffer.from("none");
+  const kdfName = Buffer.from("none");
+  const kdfOptions = Buffer.alloc(0);
+  const numKeys = 1;
+  const keyType = Buffer.from("ssh-ed25519");
+  const pubKeyBlob = Buffer.concat([
+    uint32BE(keyType.length),
+    keyType,
+    uint32BE(publicKeyBytes.length),
+    publicKeyBytes
+  ]);
+  const checkInt = randomBytes(4);
+  const ed25519PrivKey = Buffer.concat([privateKeyBytes, publicKeyBytes]);
+  const commentBuf = Buffer.from(comment);
+  const privateSection = Buffer.concat([
+    checkInt,
+    checkInt,
+    // Two identical check integers
+    uint32BE(keyType.length),
+    keyType,
+    uint32BE(publicKeyBytes.length),
+    publicKeyBytes,
+    uint32BE(ed25519PrivKey.length),
+    ed25519PrivKey,
     uint32BE(commentBuf.length),
     commentBuf
   ]);
@@ -3090,6 +3566,9 @@ async function waitForSSH(host, privateKey, timeoutMs = 18e4, pollIntervalMs = 5
   throw new Error(`SSH not available after ${timeoutMs / 1e3} seconds`);
 }
 
+// src/services/deployment.ts
+import { randomBytes as randomBytes2 } from "crypto";
+
 // src/services/setup/index.ts
 async function execOrFail(ssh, command, errorMessage) {
   const result = await ssh.exec(command);
@@ -3241,7 +3720,7 @@ async function installOpenClaw(ssh) {
     throw new Error("OpenClaw installation verification failed");
   }
 }
-async function configureOpenClaw(ssh, customConfig, agentConfig) {
+async function configureOpenClaw(ssh, customConfig, agentConfig, gatewayToken) {
   await ssh.exec("mkdir -p ~/.openclaw");
   const config = {
     browser: {
@@ -3263,6 +3742,7 @@ async function configureOpenClaw(ssh, customConfig, agentConfig) {
       port: 18789,
       mode: "local",
       bind: "loopback",
+      ...gatewayToken ? { auth: { token: gatewayToken } } : {},
       tailscale: {
         mode: "serve",
         resetOnExit: false
@@ -3510,6 +3990,41 @@ async function getOpenClawLogs(ssh, lines = 100) {
   const result = await ssh.exec(`journalctl -u openclaw -n ${lines} --no-pager`);
   return result.stdout;
 }
+async function getDashboardUrl(ssh) {
+  const nvmPrefix = "source ~/.nvm/nvm.sh &&";
+  const dashResult = await ssh.exec(
+    `${nvmPrefix} timeout 10 openclaw dashboard 2>&1 || true`
+  );
+  const rawOutput = dashResult.stdout + "\n" + dashResult.stderr;
+  const output = rawOutput.replace(/\x1b\[[0-9;]*m/g, "");
+  const urlMatch = output.match(/https?:\/\/[^\s\])'"<>]+/);
+  if (urlMatch) {
+    try {
+      const parsed = new URL(urlMatch[0]);
+      return { url: urlMatch[0], port: parseInt(parsed.port) || 18789 };
+    } catch {
+    }
+  }
+  const tokenResult = await ssh.exec(
+    `${nvmPrefix} openclaw config get gateway.auth.token 2>/dev/null || true`
+  );
+  const token = tokenResult.stdout.trim().replace(/^["']|["']$/g, "");
+  if (token) {
+    return {
+      url: `http://127.0.0.1:18789/?token=${encodeURIComponent(token)}`,
+      port: 18789
+    };
+  }
+  const statusResult = await ssh.exec(
+    "systemctl is-active openclaw 2>/dev/null || true"
+  );
+  if (statusResult.stdout.trim() !== "active") {
+    throw new Error("OpenClaw gateway is not running on this server");
+  }
+  throw new Error(
+    "Could not retrieve dashboard URL. Try running 'openclaw dashboard' on the server manually."
+  );
+}
 
 // src/services/deployment.ts
 var MAX_RETRIES = 3;
@@ -3608,6 +4123,7 @@ var DeploymentOrchestrator = class {
   onConfirm;
   onOpenUrl;
   onSpawnTerminal;
+  tailscaleSkipped = false;
   constructor(deploymentName, onProgress, onConfirm, onOpenUrl, onSpawnTerminal) {
     this.deploymentName = deploymentName;
     this.deployment = readDeployment(deploymentName);
@@ -3991,18 +4507,28 @@ Would you like to retry from the beginning?`
     const ssh = await this.ensureSSHConnected();
     const customConfig = this.deployment.config.openclawConfig;
     const agentConfig = this.deployment.config.openclawAgent;
-    await configureOpenClaw(ssh, customConfig, agentConfig);
+    const gatewayToken = randomBytes2(32).toString("hex");
+    await configureOpenClaw(ssh, customConfig, agentConfig, gatewayToken);
+    updateDeploymentState(this.deploymentName, { gatewayToken });
     if (agentConfig) {
       this.reportProgress("openclaw_configured", "Writing AI provider environment...");
       await writeOpenClawEnvFile(ssh, agentConfig);
     }
   }
   async installTailscale() {
+    if (this.deployment.config.skipTailscale) {
+      this.tailscaleSkipped = true;
+      this.reportProgress("tailscale_installed", "Tailscale setup skipped.");
+      return;
+    }
     const ssh = await this.ensureSSHConnected();
     await installTailscale(ssh);
   }
   async authenticateTailscale() {
+    if (this.tailscaleSkipped) return;
     const ssh = await this.ensureSSHConnected();
+    const check = await ssh.exec("which tailscale 2>/dev/null");
+    if (check.code !== 0) return;
     const authUrl = await getTailscaleAuthUrl(ssh);
     if (authUrl) {
       const confirmed = await this.onConfirm(
@@ -4025,7 +4551,10 @@ URL: ${authUrl}`
     }
   }
   async configureTailscale() {
+    if (this.tailscaleSkipped) return;
     const ssh = await this.ensureSSHConnected();
+    const check = await ssh.exec("which tailscale 2>/dev/null");
+    if (check.code !== 0) return;
     const tailscaleIp = await configureTailscaleServe(ssh);
     updateDeploymentState(this.deploymentName, {
       tailscaleIp
@@ -4510,14 +5039,14 @@ function getTerminalDisplayName(app) {
 }
 
 // src/components/DeployingView.tsx
-import { jsx as jsx4, jsxs as jsxs4 } from "@opentui/react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "@opentui/react/jsx-runtime";
 function DeployingView({ context }) {
-  const [deployState, setDeployState] = useState4("deploying");
-  const [progress, setProgress] = useState4(null);
-  const [logs, setLogs] = useState4([]);
-  const [error, setError] = useState4(null);
-  const [confirmPrompt, setConfirmPrompt] = useState4(null);
-  const [terminalResolve, setTerminalResolve] = useState4(null);
+  const [deployState, setDeployState] = useState5("deploying");
+  const [progress, setProgress] = useState5(null);
+  const [logs, setLogs] = useState5([]);
+  const [error, setError] = useState5(null);
+  const [confirmPrompt, setConfirmPrompt] = useState5(null);
+  const [terminalResolve, setTerminalResolve] = useState5(null);
   const deploymentName = context.selectedDeployment;
   const addLog = useCallback((message) => {
     setLogs((prev) => [...prev.slice(-20), `[${(/* @__PURE__ */ new Date()).toLocaleTimeString()}] ${message}`]);
@@ -4565,9 +5094,9 @@ function DeployingView({ context }) {
     setDeployState("deploying");
     addLog("Terminal session confirmed complete, continuing deployment...");
   }, [terminalResolve, addLog]);
-  const stateRef = useRef2({ deployState, terminalResolve });
+  const stateRef = useRef3({ deployState, terminalResolve });
   stateRef.current = { deployState, terminalResolve };
-  useKeyboard3((key) => {
+  useKeyboard4((key) => {
     const currentState = stateRef.current;
     if (currentState.deployState === "waiting_terminal") {
       if (key.name === "return") {
@@ -4621,19 +5150,19 @@ function DeployingView({ context }) {
     const width = 40;
     const filled = Math.round(progress.progress / 100 * width);
     const empty = width - filled;
-    return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", marginBottom: 1, children: [
-      /* @__PURE__ */ jsxs4("box", { flexDirection: "row", children: [
-        /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: "[" }),
-        /* @__PURE__ */ jsx4("text", { fg: t.status.success, children: "\u2588".repeat(filled) }),
-        /* @__PURE__ */ jsx4("text", { fg: t.fg.muted, children: "\u2591".repeat(empty) }),
-        /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: "]" }),
-        /* @__PURE__ */ jsxs4("text", { fg: t.fg.primary, children: [
+    return /* @__PURE__ */ jsxs5("box", { flexDirection: "column", marginBottom: 1, children: [
+      /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
+        /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: "[" }),
+        /* @__PURE__ */ jsx5("text", { fg: t.status.success, children: "\u2588".repeat(filled) }),
+        /* @__PURE__ */ jsx5("text", { fg: t.fg.muted, children: "\u2591".repeat(empty) }),
+        /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: "]" }),
+        /* @__PURE__ */ jsxs5("text", { fg: t.fg.primary, children: [
           " ",
           Math.round(progress.progress),
           "%"
         ] })
       ] }),
-      /* @__PURE__ */ jsxs4("text", { fg: t.accent, marginTop: 1, children: [
+      /* @__PURE__ */ jsxs5("text", { fg: t.accent, marginTop: 1, children: [
         "Current: ",
         progress.message
       ] })
@@ -4642,7 +5171,7 @@ function DeployingView({ context }) {
   const renderConfirmDialog = () => {
     if (!confirmPrompt) return null;
     const lines = confirmPrompt.message.split("\n");
-    return /* @__PURE__ */ jsxs4(
+    return /* @__PURE__ */ jsxs5(
       "box",
       {
         flexDirection: "column",
@@ -4651,16 +5180,16 @@ function DeployingView({ context }) {
         padding: 1,
         marginBottom: 1,
         children: [
-          /* @__PURE__ */ jsx4("text", { fg: t.status.warning, children: "Confirmation Required" }),
-          /* @__PURE__ */ jsx4("box", { flexDirection: "column", marginTop: 1, children: lines.map((line, i) => /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: line }, i)) }),
-          /* @__PURE__ */ jsx4("text", { fg: t.status.warning, marginTop: 1, children: "Press Y for Yes, N for No" })
+          /* @__PURE__ */ jsx5("text", { fg: t.status.warning, children: "Confirmation Required" }),
+          /* @__PURE__ */ jsx5("box", { flexDirection: "column", marginTop: 1, children: lines.map((line, i) => /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: line }, i)) }),
+          /* @__PURE__ */ jsx5("text", { fg: t.status.warning, marginTop: 1, children: "Press Y for Yes, N for No" })
         ]
       }
     );
   };
   const renderWaitingTerminal = () => {
-    return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", flexGrow: 1, children: [
-      /* @__PURE__ */ jsxs4(
+    return /* @__PURE__ */ jsxs5("box", { flexDirection: "column", flexGrow: 1, children: [
+      /* @__PURE__ */ jsxs5(
         "box",
         {
           flexDirection: "column",
@@ -4669,12 +5198,12 @@ function DeployingView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsx4("text", { fg: t.accent, children: "Interactive Setup" }),
-            /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, marginTop: 1, children: "A terminal window has been opened." })
+            /* @__PURE__ */ jsx5("text", { fg: t.accent, children: "Interactive Setup" }),
+            /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, marginTop: 1, children: "A terminal window has been opened." })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs4(
+      /* @__PURE__ */ jsxs5(
         "box",
         {
           flexDirection: "column",
@@ -4683,32 +5212,32 @@ function DeployingView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsx4("text", { fg: t.status.warning, children: "Instructions:" }),
-            /* @__PURE__ */ jsxs4("box", { flexDirection: "column", marginTop: 1, children: [
-              /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "1. Complete the setup in the terminal window" }),
-              /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "2. Follow the prompts shown in the terminal" }),
-              /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "3. When done, close the terminal window" }),
-              /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "4. Press Enter here to continue" })
+            /* @__PURE__ */ jsx5("text", { fg: t.status.warning, children: "Instructions:" }),
+            /* @__PURE__ */ jsxs5("box", { flexDirection: "column", marginTop: 1, children: [
+              /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "1. Complete the setup in the terminal window" }),
+              /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "2. Follow the prompts shown in the terminal" }),
+              /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "3. When done, close the terminal window" }),
+              /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "4. Press Enter here to continue" })
             ] })
           ]
         }
       ),
-      /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsx5(
         "box",
         {
           flexDirection: "column",
           borderStyle: "single",
           borderColor: t.status.success,
           padding: 1,
-          children: /* @__PURE__ */ jsx4("text", { fg: t.status.success, children: "Press Enter when you have completed the setup in the terminal" })
+          children: /* @__PURE__ */ jsx5("text", { fg: t.status.success, children: "Press Enter when you have completed the setup in the terminal" })
         }
       )
     ] });
   };
   const renderSuccess = () => {
     const state = readDeploymentState(deploymentName);
-    return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", children: [
-      /* @__PURE__ */ jsxs4(
+    return /* @__PURE__ */ jsxs5("box", { flexDirection: "column", children: [
+      /* @__PURE__ */ jsxs5(
         "box",
         {
           flexDirection: "column",
@@ -4717,12 +5246,12 @@ function DeployingView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsx4("text", { fg: t.status.success, children: "Deployment Successful!" }),
-            /* @__PURE__ */ jsx4("text", { fg: t.status.success, marginTop: 1, children: "Your OpenClaw instance is now running." })
+            /* @__PURE__ */ jsx5("text", { fg: t.status.success, children: "Deployment Successful!" }),
+            /* @__PURE__ */ jsx5("text", { fg: t.status.success, marginTop: 1, children: "Your OpenClaw instance is now running." })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs4(
+      /* @__PURE__ */ jsxs5(
         "box",
         {
           flexDirection: "column",
@@ -4731,36 +5260,36 @@ function DeployingView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "Connection Details" }),
-            /* @__PURE__ */ jsxs4("box", { flexDirection: "row", marginTop: 1, children: [
-              /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, width: 15, children: "Server IP:" }),
-              /* @__PURE__ */ jsx4("text", { fg: t.accent, children: state.serverIp || "N/A" })
+            /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "Connection Details" }),
+            /* @__PURE__ */ jsxs5("box", { flexDirection: "row", marginTop: 1, children: [
+              /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 15, children: "Server IP:" }),
+              /* @__PURE__ */ jsx5("text", { fg: t.accent, children: state.serverIp || "N/A" })
             ] }),
-            /* @__PURE__ */ jsxs4("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, width: 15, children: "Tailscale IP:" }),
-              /* @__PURE__ */ jsx4("text", { fg: t.accent, children: state.tailscaleIp || "N/A" })
+            /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 15, children: "Tailscale IP:" }),
+              /* @__PURE__ */ jsx5("text", { fg: t.accent, children: state.tailscaleIp || "N/A" })
             ] }),
-            /* @__PURE__ */ jsxs4("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, width: 15, children: "Gateway Port:" }),
-              /* @__PURE__ */ jsx4("text", { fg: t.accent, children: "18789" })
+            /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 15, children: "Gateway Port:" }),
+              /* @__PURE__ */ jsx5("text", { fg: t.accent, children: "18789" })
             ] })
           ]
         }
       ),
-      /* @__PURE__ */ jsx4("text", { fg: t.status.success, children: "Next steps:" }),
-      /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "  /ssh  - Connect to your server" }),
-      /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "  /logs - View OpenClaw logs" }),
-      /* @__PURE__ */ jsxs4("text", { fg: t.fg.primary, children: [
+      /* @__PURE__ */ jsx5("text", { fg: t.status.success, children: "Next steps:" }),
+      /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "  /ssh  - Connect to your server" }),
+      /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "  /logs - View OpenClaw logs" }),
+      /* @__PURE__ */ jsxs5("text", { fg: t.fg.primary, children: [
         "  Gateway: http://",
         state.tailscaleIp || state.serverIp,
         ":18789/"
       ] }),
-      /* @__PURE__ */ jsx4("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx5("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   };
   const renderFailed = () => {
-    return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", children: [
-      /* @__PURE__ */ jsxs4(
+    return /* @__PURE__ */ jsxs5("box", { flexDirection: "column", children: [
+      /* @__PURE__ */ jsxs5(
         "box",
         {
           flexDirection: "column",
@@ -4769,26 +5298,26 @@ function DeployingView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsx4("text", { fg: t.status.error, children: "Deployment Failed" }),
-            /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, marginTop: 1, children: "Something went wrong during deployment." }),
-            /* @__PURE__ */ jsxs4("text", { fg: t.status.error, marginTop: 1, children: [
+            /* @__PURE__ */ jsx5("text", { fg: t.status.error, children: "Deployment Failed" }),
+            /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, marginTop: 1, children: "Something went wrong during deployment." }),
+            /* @__PURE__ */ jsxs5("text", { fg: t.status.error, marginTop: 1, children: [
               "Error: ",
               error
             ] })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs4("box", { flexDirection: "column", marginBottom: 1, children: [
-        /* @__PURE__ */ jsx4("text", { fg: t.fg.primary, children: "What you can do:" }),
-        /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: "  1. Run /deploy again - it will resume from the last successful step" }),
-        /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: "  2. Run /status to check the current state of your deployment" }),
-        /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: "  3. Run /destroy and /new to start fresh if the issue persists" })
+      /* @__PURE__ */ jsxs5("box", { flexDirection: "column", marginBottom: 1, children: [
+        /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "What you can do:" }),
+        /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: "  1. Run /deploy again - it will resume from the last successful step" }),
+        /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: "  2. Run /status to check the current state of your deployment" }),
+        /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: "  3. Run /destroy and /new to start fresh if the issue persists" })
       ] }),
-      /* @__PURE__ */ jsx4("text", { fg: t.fg.muted, marginTop: 1, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx5("text", { fg: t.fg.muted, marginTop: 1, children: "Press any key to return to home" })
     ] });
   };
-  return /* @__PURE__ */ jsxs4("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-    /* @__PURE__ */ jsx4("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsxs4("text", { fg: t.accent, children: [
+  return /* @__PURE__ */ jsxs5("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+    /* @__PURE__ */ jsx5("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsxs5("text", { fg: t.accent, children: [
       "Deploying: ",
       deploymentName
     ] }) }),
@@ -4797,7 +5326,7 @@ function DeployingView({ context }) {
     deployState === "waiting_terminal" && renderWaitingTerminal(),
     deployState === "success" && renderSuccess(),
     deployState === "failed" && renderFailed(),
-    /* @__PURE__ */ jsxs4(
+    /* @__PURE__ */ jsxs5(
       "box",
       {
         flexDirection: "column",
@@ -4805,8 +5334,8 @@ function DeployingView({ context }) {
         borderColor: t.border.default,
         padding: 1,
         children: [
-          /* @__PURE__ */ jsx4("text", { fg: t.fg.secondary, children: "Deployment Log" }),
-          /* @__PURE__ */ jsx4("box", { flexDirection: "column", marginTop: 1, children: logs.map((log, i) => /* @__PURE__ */ jsx4("text", { fg: t.fg.muted, children: log }, i)) })
+          /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: "Deployment Log" }),
+          /* @__PURE__ */ jsx5("box", { flexDirection: "column", marginTop: 1, children: logs.map((log, i) => /* @__PURE__ */ jsx5("text", { fg: t.fg.muted, children: log }, i)) })
         ]
       }
     )
@@ -4814,13 +5343,13 @@ function DeployingView({ context }) {
 }
 
 // src/components/StatusView.tsx
-import { useState as useState5 } from "react";
-import { useKeyboard as useKeyboard4 } from "@opentui/react";
-import { jsx as jsx5, jsxs as jsxs5 } from "@opentui/react/jsx-runtime";
+import { useState as useState6 } from "react";
+import { useKeyboard as useKeyboard5 } from "@opentui/react";
+import { jsx as jsx6, jsxs as jsxs6 } from "@opentui/react/jsx-runtime";
 function StatusView({ context }) {
-  const [selectedIndex, setSelectedIndex] = useState5(0);
-  const [healthStatus, setHealthStatus] = useState5(/* @__PURE__ */ new Map());
-  const [checking, setChecking] = useState5(null);
+  const [selectedIndex, setSelectedIndex] = useState6(0);
+  const [healthStatus, setHealthStatus] = useState6(/* @__PURE__ */ new Map());
+  const [checking, setChecking] = useState6(null);
   const deployments = context.deployments;
   const checkHealth = async (deployment) => {
     const name = deployment.config.name;
@@ -4845,7 +5374,7 @@ function StatusView({ context }) {
     setHealthStatus((prev) => new Map(prev).set(name, health));
     setChecking(null);
   };
-  useKeyboard4((key) => {
+  useKeyboard5((key) => {
     if (deployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -4861,12 +5390,12 @@ function StatusView({ context }) {
     }
   });
   if (deployments.length === 0) {
-    return /* @__PURE__ */ jsxs5("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs5("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx5("text", { fg: t.accent, children: "/status" }),
-        /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: " - Deployment Status" })
+    return /* @__PURE__ */ jsxs6("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx6("text", { fg: t.accent, children: "/status" }),
+        /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, children: " - Deployment Status" })
       ] }),
-      /* @__PURE__ */ jsxs5(
+      /* @__PURE__ */ jsxs6(
         "box",
         {
           flexDirection: "column",
@@ -4874,22 +5403,22 @@ function StatusView({ context }) {
           borderColor: t.border.default,
           padding: 1,
           children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.status.warning, children: "No deployments found!" }),
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, marginTop: 1, children: "Run /new to create a deployment." })
+            /* @__PURE__ */ jsx6("text", { fg: t.status.warning, children: "No deployments found!" }),
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, marginTop: 1, children: "Run /new to create a deployment." })
           ]
         }
       ),
-      /* @__PURE__ */ jsx5("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx6("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   }
   const selectedDeployment = deployments[selectedIndex];
   const selectedHealth = healthStatus.get(selectedDeployment.config.name);
-  return /* @__PURE__ */ jsxs5("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-    /* @__PURE__ */ jsxs5("box", { flexDirection: "row", marginBottom: 2, children: [
-      /* @__PURE__ */ jsx5("text", { fg: t.accent, children: "/status" }),
-      /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: " - Deployment Status" })
+  return /* @__PURE__ */ jsxs6("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+    /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginBottom: 2, children: [
+      /* @__PURE__ */ jsx6("text", { fg: t.accent, children: "/status" }),
+      /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, children: " - Deployment Status" })
     ] }),
-    /* @__PURE__ */ jsxs5(
+    /* @__PURE__ */ jsxs6(
       "box",
       {
         flexDirection: "column",
@@ -4898,22 +5427,22 @@ function StatusView({ context }) {
         padding: 1,
         marginBottom: 1,
         children: [
-          /* @__PURE__ */ jsxs5("text", { fg: t.fg.primary, marginBottom: 1, children: [
+          /* @__PURE__ */ jsxs6("text", { fg: t.fg.primary, marginBottom: 1, children: [
             "Deployments (",
             deployments.length,
             ")"
           ] }),
           deployments.map((deployment, index) => {
             const isSelected = index === selectedIndex;
-            return /* @__PURE__ */ jsxs5(
+            return /* @__PURE__ */ jsxs6(
               "box",
               {
                 flexDirection: "row",
                 backgroundColor: isSelected ? t.selection.bg : void 0,
                 children: [
-                  /* @__PURE__ */ jsx5("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
-                  /* @__PURE__ */ jsx5("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
-                  /* @__PURE__ */ jsxs5("text", { fg: statusColor(deployment.state.status), children: [
+                  /* @__PURE__ */ jsx6("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx6("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
+                  /* @__PURE__ */ jsxs6("text", { fg: statusColor(deployment.state.status), children: [
                     "[",
                     deployment.state.status,
                     "]"
@@ -4926,7 +5455,7 @@ function StatusView({ context }) {
         ]
       }
     ),
-    /* @__PURE__ */ jsxs5(
+    /* @__PURE__ */ jsxs6(
       "box",
       {
         flexDirection: "column",
@@ -4935,78 +5464,78 @@ function StatusView({ context }) {
         padding: 1,
         marginBottom: 1,
         children: [
-          /* @__PURE__ */ jsxs5("text", { fg: t.accent, children: [
+          /* @__PURE__ */ jsxs6("text", { fg: t.accent, children: [
             "Details: ",
             selectedDeployment.config.name
           ] }),
-          /* @__PURE__ */ jsxs5("box", { flexDirection: "row", marginTop: 1, children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "Status:" }),
-            /* @__PURE__ */ jsx5("text", { fg: statusColor(selectedDeployment.state.status), children: selectedDeployment.state.status })
+          /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginTop: 1, children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "Status:" }),
+            /* @__PURE__ */ jsx6("text", { fg: statusColor(selectedDeployment.state.status), children: selectedDeployment.state.status })
           ] }),
-          /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "Provider:" }),
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: selectedDeployment.config.provider })
+          /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "Provider:" }),
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.primary, children: selectedDeployment.config.provider })
           ] }),
-          /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "Server IP:" }),
-            /* @__PURE__ */ jsx5("text", { fg: t.accent, children: selectedDeployment.state.serverIp || "Not deployed" })
+          /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "Server IP:" }),
+            /* @__PURE__ */ jsx6("text", { fg: t.accent, children: selectedDeployment.state.serverIp || "Not deployed" })
           ] }),
-          /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "Tailscale IP:" }),
-            /* @__PURE__ */ jsx5("text", { fg: t.accent, children: selectedDeployment.state.tailscaleIp || "Not configured" })
+          /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "Tailscale IP:" }),
+            /* @__PURE__ */ jsx6("text", { fg: t.accent, children: selectedDeployment.state.tailscaleIp || "Not configured" })
           ] }),
-          /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "Created:" }),
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: new Date(selectedDeployment.config.createdAt).toLocaleString() })
+          /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "Created:" }),
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.primary, children: new Date(selectedDeployment.config.createdAt).toLocaleString() })
           ] }),
-          selectedDeployment.state.deployedAt && /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "Deployed:" }),
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: new Date(selectedDeployment.state.deployedAt).toLocaleString() })
+          selectedDeployment.state.deployedAt && /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "Deployed:" }),
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.primary, children: new Date(selectedDeployment.state.deployedAt).toLocaleString() })
           ] }),
-          selectedDeployment.state.lastError && /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "Last Error:" }),
-            /* @__PURE__ */ jsx5("text", { fg: t.status.error, children: selectedDeployment.state.lastError })
+          selectedDeployment.state.lastError && /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "Last Error:" }),
+            /* @__PURE__ */ jsx6("text", { fg: t.status.error, children: selectedDeployment.state.lastError })
           ] }),
-          selectedHealth && /* @__PURE__ */ jsxs5("box", { flexDirection: "column", marginTop: 1, children: [
-            /* @__PURE__ */ jsx5("text", { fg: t.fg.primary, children: "Health Check:" }),
-            /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "SSH:" }),
-              /* @__PURE__ */ jsx5("text", { fg: selectedHealth.sshConnectable ? t.status.success : t.status.error, children: selectedHealth.sshConnectable ? "Connected" : "Unreachable" })
+          selectedHealth && /* @__PURE__ */ jsxs6("box", { flexDirection: "column", marginTop: 1, children: [
+            /* @__PURE__ */ jsx6("text", { fg: t.fg.primary, children: "Health Check:" }),
+            /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "SSH:" }),
+              /* @__PURE__ */ jsx6("text", { fg: selectedHealth.sshConnectable ? t.status.success : t.status.error, children: selectedHealth.sshConnectable ? "Connected" : "Unreachable" })
             ] }),
-            /* @__PURE__ */ jsxs5("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, width: 18, children: "OpenClaw:" }),
-              /* @__PURE__ */ jsx5("text", { fg: selectedHealth.openclawRunning ? t.status.success : t.status.error, children: selectedHealth.openclawRunning ? "Running" : "Not running" })
+            /* @__PURE__ */ jsxs6("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, width: 18, children: "OpenClaw:" }),
+              /* @__PURE__ */ jsx6("text", { fg: selectedHealth.openclawRunning ? t.status.success : t.status.error, children: selectedHealth.openclawRunning ? "Running" : "Not running" })
             ] }),
-            /* @__PURE__ */ jsxs5("text", { fg: t.fg.muted, children: [
+            /* @__PURE__ */ jsxs6("text", { fg: t.fg.muted, children: [
               "Last checked: ",
               selectedHealth.lastChecked.toLocaleTimeString()
             ] })
           ] }),
-          checking === selectedDeployment.config.name && /* @__PURE__ */ jsx5("text", { fg: t.status.warning, marginTop: 1, children: "Checking health..." })
+          checking === selectedDeployment.config.name && /* @__PURE__ */ jsx6("text", { fg: t.status.warning, marginTop: 1, children: "Checking health..." })
         ]
       }
     ),
-    selectedDeployment.state.checkpoints.length > 0 && /* @__PURE__ */ jsxs5("box", { flexDirection: "row", marginBottom: 1, children: [
-      /* @__PURE__ */ jsx5("text", { fg: t.fg.secondary, children: "Checkpoints: " }),
-      /* @__PURE__ */ jsxs5("text", { fg: t.status.success, children: [
+    selectedDeployment.state.checkpoints.length > 0 && /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginBottom: 1, children: [
+      /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, children: "Checkpoints: " }),
+      /* @__PURE__ */ jsxs6("text", { fg: t.status.success, children: [
         selectedDeployment.state.checkpoints.length,
         " completed"
       ] })
     ] }),
-    /* @__PURE__ */ jsx5("text", { fg: t.fg.muted, children: "Up/Down: Select | Enter: Health check | Esc: Back" })
+    /* @__PURE__ */ jsx6("text", { fg: t.fg.muted, children: "Up/Down: Select | Enter: Health check | Esc: Back" })
   ] });
 }
 
 // src/components/SSHView.tsx
-import { useState as useState6, useCallback as useCallback2 } from "react";
-import { useKeyboard as useKeyboard5 } from "@opentui/react";
-import { jsx as jsx6, jsxs as jsxs6 } from "@opentui/react/jsx-runtime";
+import { useState as useState7, useCallback as useCallback2 } from "react";
+import { useKeyboard as useKeyboard6 } from "@opentui/react";
+import { jsx as jsx7, jsxs as jsxs7 } from "@opentui/react/jsx-runtime";
 function SSHView({ context }) {
-  const [viewState, setViewState] = useState6("selecting");
-  const [selectedIndex, setSelectedIndex] = useState6(0);
-  const [error, setError] = useState6(null);
-  const [connectedDeployment, setConnectedDeployment] = useState6(null);
-  const [terminalName, setTerminalName] = useState6("");
+  const [viewState, setViewState] = useState7("selecting");
+  const [selectedIndex, setSelectedIndex] = useState7(0);
+  const [error, setError] = useState7(null);
+  const [connectedDeployment, setConnectedDeployment] = useState7(null);
+  const [terminalName, setTerminalName] = useState7("");
   const deployedDeployments = context.deployments.filter(
     (d) => d.state.status === "deployed" && d.state.serverIp
   );
@@ -5025,7 +5554,7 @@ function SSHView({ context }) {
     }
   }, []);
   const selectedDeployment = deployedDeployments[selectedIndex];
-  useKeyboard5((key) => {
+  useKeyboard6((key) => {
     if (deployedDeployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -5049,12 +5578,12 @@ function SSHView({ context }) {
     }
   });
   if (deployedDeployments.length === 0) {
-    return /* @__PURE__ */ jsxs6("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx6("text", { fg: t.accent, children: "/ssh" }),
-        /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, children: " - SSH into deployment" })
+    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx7("text", { fg: t.accent, children: "/ssh" }),
+        /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, children: " - SSH into deployment" })
       ] }),
-      /* @__PURE__ */ jsxs6(
+      /* @__PURE__ */ jsxs7(
         "box",
         {
           flexDirection: "column",
@@ -5062,23 +5591,23 @@ function SSHView({ context }) {
           borderColor: t.border.default,
           padding: 1,
           children: [
-            /* @__PURE__ */ jsx6("text", { fg: t.status.warning, children: "No deployed instances found!" }),
-            /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, marginTop: 1, children: "Deploy an instance first with /deploy" })
+            /* @__PURE__ */ jsx7("text", { fg: t.status.warning, children: "No deployed instances found!" }),
+            /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, marginTop: 1, children: "Deploy an instance first with /deploy" })
           ]
         }
       ),
-      /* @__PURE__ */ jsx6("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   }
   if (viewState === "selecting") {
     const terminal = detectTerminal();
     const terminalDisplayName = getTerminalDisplayName(terminal.app);
-    return /* @__PURE__ */ jsxs6("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx6("text", { fg: t.accent, children: "/ssh" }),
-        /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, children: " - Select a deployment to connect" })
+    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx7("text", { fg: t.accent, children: "/ssh" }),
+        /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, children: " - Select a deployment to connect" })
       ] }),
-      /* @__PURE__ */ jsx6(
+      /* @__PURE__ */ jsx7(
         "box",
         {
           flexDirection: "column",
@@ -5088,15 +5617,15 @@ function SSHView({ context }) {
           marginBottom: 1,
           children: deployedDeployments.map((deployment, index) => {
             const isSelected = index === selectedIndex;
-            return /* @__PURE__ */ jsxs6(
+            return /* @__PURE__ */ jsxs7(
               "box",
               {
                 flexDirection: "row",
                 backgroundColor: isSelected ? t.selection.bg : void 0,
                 children: [
-                  /* @__PURE__ */ jsx6("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
-                  /* @__PURE__ */ jsx6("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
-                  /* @__PURE__ */ jsx6("text", { fg: t.accent, children: deployment.state.serverIp })
+                  /* @__PURE__ */ jsx7("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx7("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
+                  /* @__PURE__ */ jsx7("text", { fg: t.accent, children: deployment.state.serverIp })
                 ]
               },
               deployment.config.name
@@ -5104,24 +5633,24 @@ function SSHView({ context }) {
           })
         }
       ),
-      /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginBottom: 1, children: [
-        /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, children: "Terminal: " }),
-        /* @__PURE__ */ jsx6("text", { fg: t.status.success, children: terminalDisplayName }),
-        /* @__PURE__ */ jsx6("text", { fg: t.fg.secondary, children: " (will open in a new window)" })
+      /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginBottom: 1, children: [
+        /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, children: "Terminal: " }),
+        /* @__PURE__ */ jsx7("text", { fg: t.status.success, children: terminalDisplayName }),
+        /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, children: " (will open in a new window)" })
       ] }),
-      /* @__PURE__ */ jsx6("text", { fg: t.fg.muted, children: "Arrow keys to select | Enter to connect | Esc to go back" })
+      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, children: "Arrow keys to select | Enter to connect | Esc to go back" })
     ] });
   }
   if (viewState === "connected") {
-    return /* @__PURE__ */ jsxs6("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs6("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx6("text", { fg: t.status.success, children: "/ssh" }),
-        /* @__PURE__ */ jsxs6("text", { fg: t.fg.secondary, children: [
+    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx7("text", { fg: t.status.success, children: "/ssh" }),
+        /* @__PURE__ */ jsxs7("text", { fg: t.fg.secondary, children: [
           " - Connected to ",
           connectedDeployment
         ] })
       ] }),
-      /* @__PURE__ */ jsxs6(
+      /* @__PURE__ */ jsxs7(
         "box",
         {
           flexDirection: "column",
@@ -5130,8 +5659,8 @@ function SSHView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsx6("text", { fg: t.status.success, children: "SSH Session Opened" }),
-            /* @__PURE__ */ jsxs6("text", { fg: t.fg.primary, marginTop: 1, children: [
+            /* @__PURE__ */ jsx7("text", { fg: t.status.success, children: "SSH Session Opened" }),
+            /* @__PURE__ */ jsxs7("text", { fg: t.fg.primary, marginTop: 1, children: [
               "A new ",
               terminalName,
               " window/tab has been opened."
@@ -5139,7 +5668,7 @@ function SSHView({ context }) {
           ]
         }
       ),
-      /* @__PURE__ */ jsxs6(
+      /* @__PURE__ */ jsxs7(
         "box",
         {
           flexDirection: "column",
@@ -5148,41 +5677,41 @@ function SSHView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsxs6("text", { fg: t.fg.primary, children: [
+            /* @__PURE__ */ jsxs7("text", { fg: t.fg.primary, children: [
               "Your SSH session is running in ",
               terminalName,
               "."
             ] }),
-            /* @__PURE__ */ jsx6("text", { fg: t.fg.primary, marginTop: 1, children: "When you're done, type 'exit' or close the tab." })
+            /* @__PURE__ */ jsx7("text", { fg: t.fg.primary, marginTop: 1, children: "When you're done, type 'exit' or close the tab." })
           ]
         }
       ),
-      /* @__PURE__ */ jsx6("text", { fg: t.fg.muted, marginTop: 1, children: "Press Enter or Esc to return to ClawControl" })
+      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, marginTop: 1, children: "Press Enter or Esc to return to ClawControl" })
     ] });
   }
   if (viewState === "error") {
-    return /* @__PURE__ */ jsxs6("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsx6("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsx6("text", { fg: t.status.error, children: "SSH Error" }) }),
-      /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsx7("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsx7("text", { fg: t.status.error, children: "SSH Error" }) }),
+      /* @__PURE__ */ jsx7(
         "box",
         {
           flexDirection: "column",
           borderStyle: "single",
           borderColor: t.status.error,
           padding: 1,
-          children: /* @__PURE__ */ jsx6("text", { fg: t.status.error, children: error })
+          children: /* @__PURE__ */ jsx7("text", { fg: t.status.error, children: error })
         }
       ),
-      /* @__PURE__ */ jsx6("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   }
   return null;
 }
 
 // src/components/LogsView.tsx
-import { useState as useState7, useEffect as useEffect3, useRef as useRef3 } from "react";
-import { useKeyboard as useKeyboard6 } from "@opentui/react";
-import { Fragment, jsx as jsx7, jsxs as jsxs7 } from "@opentui/react/jsx-runtime";
+import { useState as useState8, useEffect as useEffect3, useRef as useRef4 } from "react";
+import { useKeyboard as useKeyboard7 } from "@opentui/react";
+import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs8 } from "@opentui/react/jsx-runtime";
 function parseLogLine(line) {
   if (!line.trim()) return null;
   const match = line.match(/^(\w+\s+\d+\s+[\d:]+)\s+\S+\s+\S+:\s*(.*)$/);
@@ -5201,14 +5730,14 @@ function truncateLine(line, maxWidth = 120) {
   return line.substring(0, maxWidth - 3) + "...";
 }
 function LogsView({ context }) {
-  const [viewState, setViewState] = useState7("selecting");
-  const [selectedIndex, setSelectedIndex] = useState7(0);
-  const [logs, setLogs] = useState7([]);
-  const [error, setError] = useState7(null);
-  const [autoRefresh, setAutoRefresh] = useState7(false);
-  const [lastFetched, setLastFetched] = useState7(null);
-  const sshRef = useRef3(null);
-  const refreshIntervalRef = useRef3(null);
+  const [viewState, setViewState] = useState8("selecting");
+  const [selectedIndex, setSelectedIndex] = useState8(0);
+  const [logs, setLogs] = useState8([]);
+  const [error, setError] = useState8(null);
+  const [autoRefresh, setAutoRefresh] = useState8(false);
+  const [lastFetched, setLastFetched] = useState8(null);
+  const sshRef = useRef4(null);
+  const refreshIntervalRef = useRef4(null);
   const deployedDeployments = context.deployments.filter(
     (d) => d.state.status === "deployed" && d.state.serverIp
   );
@@ -5259,7 +5788,7 @@ function LogsView({ context }) {
     setLogs([]);
   };
   const selectedDeployment = deployedDeployments[selectedIndex];
-  useKeyboard6((key) => {
+  useKeyboard7((key) => {
     if (deployedDeployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -5292,12 +5821,12 @@ function LogsView({ context }) {
     }
   });
   if (deployedDeployments.length === 0) {
-    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx7("text", { fg: t.accent, children: "/logs" }),
-        /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, children: " - View deployment logs" })
+    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs8("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx8("text", { fg: t.accent, children: "/logs" }),
+        /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: " - View deployment logs" })
       ] }),
-      /* @__PURE__ */ jsxs7(
+      /* @__PURE__ */ jsxs8(
         "box",
         {
           flexDirection: "column",
@@ -5305,21 +5834,21 @@ function LogsView({ context }) {
           borderColor: t.border.default,
           padding: 1,
           children: [
-            /* @__PURE__ */ jsx7("text", { fg: t.status.warning, children: "No deployed instances found!" }),
-            /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, marginTop: 1, children: "Deploy an instance first with /deploy" })
+            /* @__PURE__ */ jsx8("text", { fg: t.status.warning, children: "No deployed instances found!" }),
+            /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, marginTop: 1, children: "Deploy an instance first with /deploy" })
           ]
         }
       ),
-      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   }
   if (viewState === "selecting") {
-    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx7("text", { fg: t.accent, children: "/logs" }),
-        /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, children: " - Select a deployment" })
+    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs8("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx8("text", { fg: t.accent, children: "/logs" }),
+        /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: " - Select a deployment" })
       ] }),
-      /* @__PURE__ */ jsx7(
+      /* @__PURE__ */ jsx8(
         "box",
         {
           flexDirection: "column",
@@ -5328,15 +5857,15 @@ function LogsView({ context }) {
           padding: 1,
           children: deployedDeployments.map((deployment, index) => {
             const isSelected = index === selectedIndex;
-            return /* @__PURE__ */ jsxs7(
+            return /* @__PURE__ */ jsxs8(
               "box",
               {
                 flexDirection: "row",
                 backgroundColor: isSelected ? t.selection.bg : void 0,
                 children: [
-                  /* @__PURE__ */ jsx7("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
-                  /* @__PURE__ */ jsx7("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
-                  /* @__PURE__ */ jsx7("text", { fg: t.accent, children: deployment.state.serverIp })
+                  /* @__PURE__ */ jsx8("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx8("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
+                  /* @__PURE__ */ jsx8("text", { fg: t.accent, children: deployment.state.serverIp })
                 ]
               },
               deployment.config.name
@@ -5344,70 +5873,70 @@ function LogsView({ context }) {
           })
         }
       ),
-      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, marginTop: 2, children: "Arrow keys to select | Enter to view logs | Esc to go back" })
+      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Arrow keys to select | Enter to view logs | Esc to go back" })
     ] });
   }
   if (viewState === "loading") {
-    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsx7("text", { fg: t.accent, children: "Loading logs..." }),
-      /* @__PURE__ */ jsx7("text", { fg: t.fg.secondary, marginTop: 1, children: "Fetching OpenClaw logs from server..." })
+    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsx8("text", { fg: t.accent, children: "Loading logs..." }),
+      /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, marginTop: 1, children: "Fetching OpenClaw logs from server..." })
     ] });
   }
   if (viewState === "error") {
-    return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsx7("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsx7("text", { fg: t.status.error, children: "Error Loading Logs" }) }),
-      /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsx8("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: "Error Loading Logs" }) }),
+      /* @__PURE__ */ jsx8(
         "box",
         {
           flexDirection: "column",
           borderStyle: "single",
           borderColor: t.status.error,
           padding: 1,
-          children: /* @__PURE__ */ jsx7("text", { fg: t.status.error, children: error })
+          children: /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: error })
         }
       ),
-      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to go back" })
+      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to go back" })
     ] });
   }
   const visibleLogs = logs;
-  return /* @__PURE__ */ jsxs7("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-    /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginBottom: 1, children: [
-      /* @__PURE__ */ jsxs7("text", { fg: t.accent, children: [
+  return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+    /* @__PURE__ */ jsxs8("box", { flexDirection: "row", marginBottom: 1, children: [
+      /* @__PURE__ */ jsxs8("text", { fg: t.accent, children: [
         "Logs: ",
         selectedDeployment.config.name
       ] }),
-      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, children: " | " }),
-      /* @__PURE__ */ jsxs7("text", { fg: autoRefresh ? t.status.success : t.fg.muted, children: [
+      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, children: " | " }),
+      /* @__PURE__ */ jsxs8("text", { fg: autoRefresh ? t.status.success : t.fg.muted, children: [
         "Auto: ",
         autoRefresh ? "ON (5s)" : "OFF"
       ] }),
-      lastFetched && /* @__PURE__ */ jsxs7(Fragment, { children: [
-        /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, children: " | " }),
-        /* @__PURE__ */ jsxs7("text", { fg: t.fg.muted, children: [
+      lastFetched && /* @__PURE__ */ jsxs8(Fragment2, { children: [
+        /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, children: " | " }),
+        /* @__PURE__ */ jsxs8("text", { fg: t.fg.muted, children: [
           "Fetched: ",
           lastFetched.toLocaleTimeString()
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsx7(
+    /* @__PURE__ */ jsx8(
       "box",
       {
         flexDirection: "column",
         borderStyle: "single",
         borderColor: t.border.default,
         padding: 1,
-        children: /* @__PURE__ */ jsx7("box", { flexDirection: "column", children: visibleLogs.map((line, i) => {
+        children: /* @__PURE__ */ jsx8("box", { flexDirection: "column", children: visibleLogs.map((line, i) => {
           const parsed = parseLogLine(line);
           if (!parsed) return null;
           const displayLine = parsed.timestamp ? `${parsed.timestamp} ${truncateLine(parsed.message, 100)}` : truncateLine(parsed.message, 120);
-          return /* @__PURE__ */ jsx7("text", { fg: logLevelColor(parsed.level), children: displayLine }, i);
+          return /* @__PURE__ */ jsx8("text", { fg: logLevelColor(parsed.level), children: displayLine }, i);
         }) })
       }
     ),
-    /* @__PURE__ */ jsxs7("box", { flexDirection: "row", marginTop: 1, children: [
-      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, children: "R: Refresh | A: Toggle auto-refresh | Esc: Back" }),
-      /* @__PURE__ */ jsx7("text", { fg: t.fg.muted, children: " | " }),
-      /* @__PURE__ */ jsxs7("text", { fg: t.accent, children: [
+    /* @__PURE__ */ jsxs8("box", { flexDirection: "row", marginTop: 1, children: [
+      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, children: "R: Refresh | A: Toggle auto-refresh | Esc: Back" }),
+      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, children: " | " }),
+      /* @__PURE__ */ jsxs8("text", { fg: t.accent, children: [
         "Showing last ",
         visibleLogs.length,
         " lines"
@@ -5417,14 +5946,14 @@ function LogsView({ context }) {
 }
 
 // src/components/DestroyView.tsx
-import { useState as useState8 } from "react";
-import { useKeyboard as useKeyboard7 } from "@opentui/react";
-import { jsx as jsx8, jsxs as jsxs8 } from "@opentui/react/jsx-runtime";
+import { useState as useState9 } from "react";
+import { useKeyboard as useKeyboard8 } from "@opentui/react";
+import { jsx as jsx9, jsxs as jsxs9 } from "@opentui/react/jsx-runtime";
 function DestroyView({ context }) {
-  const [viewState, setViewState] = useState8("selecting");
-  const [selectedIndex, setSelectedIndex] = useState8(0);
-  const [error, setError] = useState8(null);
-  const [confirmText, setConfirmText] = useState8("");
+  const [viewState, setViewState] = useState9("selecting");
+  const [selectedIndex, setSelectedIndex] = useState9(0);
+  const [error, setError] = useState9(null);
+  const [confirmText, setConfirmText] = useState9("");
   const deployments = context.deployments;
   const destroyDeployment = async (name) => {
     setViewState("destroying");
@@ -5469,7 +5998,7 @@ function DestroyView({ context }) {
     }
   };
   const selectedDeployment = deployments[selectedIndex];
-  useKeyboard7((key) => {
+  useKeyboard8((key) => {
     if (deployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -5494,31 +6023,31 @@ function DestroyView({ context }) {
     }
   });
   if (deployments.length === 0) {
-    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs8("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: "/destroy" }),
-        /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: " - Destroy deployment" })
+    return /* @__PURE__ */ jsxs9("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx9("text", { fg: t.status.error, children: "/destroy" }),
+        /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: " - Destroy deployment" })
       ] }),
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx9(
         "box",
         {
           flexDirection: "column",
           borderStyle: "single",
           borderColor: t.border.default,
           padding: 1,
-          children: /* @__PURE__ */ jsx8("text", { fg: t.status.warning, children: "No deployments found!" })
+          children: /* @__PURE__ */ jsx9("text", { fg: t.status.warning, children: "No deployments found!" })
         }
       ),
-      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx9("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   }
   if (viewState === "selecting") {
-    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs8("box", { flexDirection: "row", marginBottom: 2, children: [
-        /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: "/destroy" }),
-        /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: " - Select a deployment to destroy" })
+    return /* @__PURE__ */ jsxs9("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx9("text", { fg: t.status.error, children: "/destroy" }),
+        /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: " - Select a deployment to destroy" })
       ] }),
-      /* @__PURE__ */ jsxs8(
+      /* @__PURE__ */ jsxs9(
         "box",
         {
           flexDirection: "column",
@@ -5526,18 +6055,18 @@ function DestroyView({ context }) {
           borderColor: t.status.error,
           padding: 1,
           children: [
-            /* @__PURE__ */ jsx8("text", { fg: t.status.error, marginBottom: 1, children: "WARNING: This action cannot be undone!" }),
+            /* @__PURE__ */ jsx9("text", { fg: t.status.error, marginBottom: 1, children: "WARNING: This action cannot be undone!" }),
             deployments.map((deployment, index) => {
               const isSelected = index === selectedIndex;
-              return /* @__PURE__ */ jsxs8(
+              return /* @__PURE__ */ jsxs9(
                 "box",
                 {
                   flexDirection: "row",
                   backgroundColor: isSelected ? t.selection.bg : void 0,
                   children: [
-                    /* @__PURE__ */ jsx8("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
-                    /* @__PURE__ */ jsx8("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
-                    /* @__PURE__ */ jsxs8("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: [
+                    /* @__PURE__ */ jsx9("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
+                    /* @__PURE__ */ jsx9("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, width: 25, children: deployment.config.name }),
+                    /* @__PURE__ */ jsxs9("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: [
                       "[",
                       deployment.state.status,
                       "]"
@@ -5550,13 +6079,13 @@ function DestroyView({ context }) {
           ]
         }
       ),
-      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Arrow keys to select | Enter to destroy | Esc to go back" })
+      /* @__PURE__ */ jsx9("text", { fg: t.fg.muted, marginTop: 2, children: "Arrow keys to select | Enter to destroy | Esc to go back" })
     ] });
   }
   if (viewState === "confirming") {
-    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsx8("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: "Confirm Destruction" }) }),
-      /* @__PURE__ */ jsxs8(
+    return /* @__PURE__ */ jsxs9("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsx9("box", { flexDirection: "row", marginBottom: 2, children: /* @__PURE__ */ jsx9("text", { fg: t.status.error, children: "Confirm Destruction" }) }),
+      /* @__PURE__ */ jsxs9(
         "box",
         {
           flexDirection: "column",
@@ -5564,26 +6093,26 @@ function DestroyView({ context }) {
           borderColor: t.status.error,
           padding: 1,
           children: [
-            /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: "You are about to destroy:" }),
-            /* @__PURE__ */ jsxs8("text", { fg: t.fg.primary, marginTop: 1, children: [
+            /* @__PURE__ */ jsx9("text", { fg: t.status.error, children: "You are about to destroy:" }),
+            /* @__PURE__ */ jsxs9("text", { fg: t.fg.primary, marginTop: 1, children: [
               "Deployment: ",
               selectedDeployment.config.name
             ] }),
-            selectedDeployment.state.serverIp && /* @__PURE__ */ jsxs8("text", { fg: t.fg.primary, children: [
+            selectedDeployment.state.serverIp && /* @__PURE__ */ jsxs9("text", { fg: t.fg.primary, children: [
               "Server IP: ",
               selectedDeployment.state.serverIp
             ] }),
-            /* @__PURE__ */ jsx8("text", { fg: t.status.error, marginTop: 1, children: "This will permanently delete:" }),
-            /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: "\u2022 The VPS server (if deployed)" }),
-            /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: "\u2022 All data on the server" }),
-            /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: "\u2022 Local configuration files" }),
-            /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, children: "\u2022 SSH keys" })
+            /* @__PURE__ */ jsx9("text", { fg: t.status.error, marginTop: 1, children: "This will permanently delete:" }),
+            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "\u2022 The VPS server (if deployed)" }),
+            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "\u2022 All data on the server" }),
+            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "\u2022 Local configuration files" }),
+            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "\u2022 SSH keys" })
           ]
         }
       ),
-      /* @__PURE__ */ jsx8("text", { fg: t.status.warning, marginTop: 2, children: "Type the deployment name to confirm:" }),
-      /* @__PURE__ */ jsx8("text", { fg: t.fg.primary, marginTop: 1, children: "Confirm:" }),
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx9("text", { fg: t.status.warning, marginTop: 2, children: "Type the deployment name to confirm:" }),
+      /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, marginTop: 1, children: "Confirm:" }),
+      /* @__PURE__ */ jsx9(
         "input",
         {
           value: confirmText,
@@ -5606,19 +6135,19 @@ function DestroyView({ context }) {
           }
         }
       ),
-      error && /* @__PURE__ */ jsx8("text", { fg: t.status.error, marginTop: 1, children: error }),
-      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Press Esc to cancel" })
+      error && /* @__PURE__ */ jsx9("text", { fg: t.status.error, marginTop: 1, children: error }),
+      /* @__PURE__ */ jsx9("text", { fg: t.fg.muted, marginTop: 2, children: "Press Esc to cancel" })
     ] });
   }
   if (viewState === "destroying") {
-    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: "Destroying deployment..." }),
-      /* @__PURE__ */ jsx8("text", { fg: t.fg.secondary, marginTop: 1, children: "Deleting server and cleaning up resources..." })
+    return /* @__PURE__ */ jsxs9("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsx9("text", { fg: t.status.error, children: "Destroying deployment..." }),
+      /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, marginTop: 1, children: "Deleting server and cleaning up resources..." })
     ] });
   }
   if (viewState === "success") {
-    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs8(
+    return /* @__PURE__ */ jsxs9("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs9(
         "box",
         {
           flexDirection: "column",
@@ -5626,8 +6155,8 @@ function DestroyView({ context }) {
           borderColor: t.status.success,
           padding: 1,
           children: [
-            /* @__PURE__ */ jsx8("text", { fg: t.status.success, children: "Deployment Destroyed" }),
-            /* @__PURE__ */ jsxs8("text", { fg: t.fg.primary, marginTop: 1, children: [
+            /* @__PURE__ */ jsx9("text", { fg: t.status.success, children: "Deployment Destroyed" }),
+            /* @__PURE__ */ jsxs9("text", { fg: t.fg.primary, marginTop: 1, children: [
               'The deployment "',
               selectedDeployment.config.name,
               '" has been permanently deleted.'
@@ -5635,12 +6164,12 @@ function DestroyView({ context }) {
           ]
         }
       ),
-      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+      /* @__PURE__ */ jsx9("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
     ] });
   }
   if (viewState === "error") {
-    return /* @__PURE__ */ jsxs8("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-      /* @__PURE__ */ jsxs8(
+    return /* @__PURE__ */ jsxs9("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs9(
         "box",
         {
           flexDirection: "column",
@@ -5648,30 +6177,30 @@ function DestroyView({ context }) {
           borderColor: t.status.error,
           padding: 1,
           children: [
-            /* @__PURE__ */ jsx8("text", { fg: t.status.error, children: "Destruction Failed" }),
-            /* @__PURE__ */ jsx8("text", { fg: t.fg.primary, marginTop: 1, children: error })
+            /* @__PURE__ */ jsx9("text", { fg: t.status.error, children: "Destruction Failed" }),
+            /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, marginTop: 1, children: error })
           ]
         }
       ),
-      /* @__PURE__ */ jsx8("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to go back" })
+      /* @__PURE__ */ jsx9("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to go back" })
     ] });
   }
   return null;
 }
 
 // src/components/HelpView.tsx
-import { useKeyboard as useKeyboard8 } from "@opentui/react";
-import { jsx as jsx9, jsxs as jsxs9 } from "@opentui/react/jsx-runtime";
+import { useKeyboard as useKeyboard9 } from "@opentui/react";
+import { jsx as jsx10, jsxs as jsxs10 } from "@opentui/react/jsx-runtime";
 function HelpView({ context }) {
-  useKeyboard8(() => {
+  useKeyboard9(() => {
     context.navigateTo("home");
   });
-  return /* @__PURE__ */ jsxs9("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-    /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginBottom: 2, children: [
-      /* @__PURE__ */ jsx9("text", { fg: t.accent, children: "/help" }),
-      /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: " - ClawControl Help" })
+  return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+    /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginBottom: 2, children: [
+      /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "/help" }),
+      /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: " - ClawControl Help" })
     ] }),
-    /* @__PURE__ */ jsxs9(
+    /* @__PURE__ */ jsxs10(
       "box",
       {
         flexDirection: "column",
@@ -5680,12 +6209,12 @@ function HelpView({ context }) {
         padding: 1,
         marginBottom: 1,
         children: [
-          /* @__PURE__ */ jsx9("text", { fg: t.accent, children: "What is ClawControl?" }),
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, marginTop: 1, children: "ClawControl is a CLI tool that simplifies deploying OpenClaw instances to cloud providers. It handles all the complex setup including VPS provisioning, Node.js installation, OpenClaw configuration, and Tailscale VPN setup." })
+          /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "What is ClawControl?" }),
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, marginTop: 1, children: "ClawControl is a CLI tool that simplifies deploying OpenClaw instances to cloud providers. It handles all the complex setup including VPS provisioning, Node.js installation, OpenClaw configuration, and Tailscale VPN setup." })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs9(
+    /* @__PURE__ */ jsxs10(
       "box",
       {
         flexDirection: "column",
@@ -5694,48 +6223,48 @@ function HelpView({ context }) {
         padding: 1,
         marginBottom: 1,
         children: [
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Available Commands" }),
-          /* @__PURE__ */ jsxs9("box", { flexDirection: "column", marginTop: 1, children: [
-            /* @__PURE__ */ jsxs9("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx9("text", { fg: t.accent, width: 12, children: "/new" }),
-              /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Initialize a new deployment configuration" })
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Available Commands" }),
+          /* @__PURE__ */ jsxs10("box", { flexDirection: "column", marginTop: 1, children: [
+            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx10("text", { fg: t.accent, width: 12, children: "/new" }),
+              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Initialize a new deployment configuration" })
             ] }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "            Creates deployment config in ~/.clawcontrol/deployments/" }),
-            /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginTop: 1, children: [
-              /* @__PURE__ */ jsx9("text", { fg: t.accent, width: 12, children: "/deploy" }),
-              /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Deploy a configured instance to the cloud" })
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "            Creates deployment config in ~/.clawcontrol/deployments/" }),
+            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginTop: 1, children: [
+              /* @__PURE__ */ jsx10("text", { fg: t.accent, width: 12, children: "/deploy" }),
+              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Deploy a configured instance to the cloud" })
             ] }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "            Provisions VPS, installs dependencies, configures OpenClaw" }),
-            /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginTop: 1, children: [
-              /* @__PURE__ */ jsx9("text", { fg: t.accent, width: 12, children: "/status" }),
-              /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "View status of all deployments" })
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "            Provisions VPS, installs dependencies, configures OpenClaw" }),
+            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginTop: 1, children: [
+              /* @__PURE__ */ jsx10("text", { fg: t.accent, width: 12, children: "/status" }),
+              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "View status of all deployments" })
             ] }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "            Shows deployment state, health checks, and connection info" }),
-            /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginTop: 1, children: [
-              /* @__PURE__ */ jsx9("text", { fg: t.accent, width: 12, children: "/ssh" }),
-              /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "SSH into a deployed instance" })
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "            Shows deployment state, health checks, and connection info" }),
+            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginTop: 1, children: [
+              /* @__PURE__ */ jsx10("text", { fg: t.accent, width: 12, children: "/ssh" }),
+              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "SSH into a deployed instance" })
             ] }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "            Opens interactive SSH session to your server" }),
-            /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginTop: 1, children: [
-              /* @__PURE__ */ jsx9("text", { fg: t.accent, width: 12, children: "/logs" }),
-              /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "View OpenClaw logs from a deployment" })
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "            Opens interactive SSH session to your server" }),
+            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginTop: 1, children: [
+              /* @__PURE__ */ jsx10("text", { fg: t.accent, width: 12, children: "/logs" }),
+              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "View OpenClaw logs from a deployment" })
             ] }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "            Streams logs from journalctl with auto-refresh option" }),
-            /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginTop: 1, children: [
-              /* @__PURE__ */ jsx9("text", { fg: t.status.error, width: 12, children: "/destroy" }),
-              /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Permanently delete a deployment" })
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "            Streams logs from journalctl with auto-refresh option" }),
+            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginTop: 1, children: [
+              /* @__PURE__ */ jsx10("text", { fg: t.status.error, width: 12, children: "/destroy" }),
+              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Permanently delete a deployment" })
             ] }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "            Deletes VPS, SSH keys, and local configuration" }),
-            /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginTop: 1, children: [
-              /* @__PURE__ */ jsx9("text", { fg: t.accent, width: 12, children: "/templates" }),
-              /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Manage deployment templates" })
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "            Deletes VPS, SSH keys, and local configuration" }),
+            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginTop: 1, children: [
+              /* @__PURE__ */ jsx10("text", { fg: t.accent, width: 12, children: "/templates" }),
+              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Manage deployment templates" })
             ] }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "            View, fork, and use reusable deployment presets" })
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "            View, fork, and use reusable deployment presets" })
           ] })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs9(
+    /* @__PURE__ */ jsxs10(
       "box",
       {
         flexDirection: "column",
@@ -5744,17 +6273,17 @@ function HelpView({ context }) {
         padding: 1,
         marginBottom: 1,
         children: [
-          /* @__PURE__ */ jsx9("text", { fg: t.status.success, children: "Typical Workflow" }),
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, marginTop: 1, children: "1. Run /templates to browse or create reusable presets" }),
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "2. Run /new to create a deployment config (optionally from a template)" }),
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "3. Run /deploy to deploy to the cloud" }),
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "4. Authenticate Tailscale when prompted" }),
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "5. Complete OpenClaw onboarding via SSH" }),
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "6. Use /status and /logs to monitor" })
+          /* @__PURE__ */ jsx10("text", { fg: t.status.success, children: "Typical Workflow" }),
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, marginTop: 1, children: "1. Run /templates to browse or create reusable presets" }),
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "2. Run /new to create a deployment config (optionally from a template)" }),
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "3. Run /deploy to deploy to the cloud" }),
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "4. Authenticate Tailscale when prompted" }),
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "5. Complete OpenClaw onboarding via SSH" }),
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "6. Use /status and /logs to monitor" })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs9(
+    /* @__PURE__ */ jsxs10(
       "box",
       {
         flexDirection: "column",
@@ -5763,36 +6292,36 @@ function HelpView({ context }) {
         padding: 1,
         marginBottom: 1,
         children: [
-          /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Supported Cloud Providers" }),
-          /* @__PURE__ */ jsxs9("box", { flexDirection: "row", marginTop: 1, children: [
-            /* @__PURE__ */ jsx9("text", { fg: t.status.success, children: "\u2713 " }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Hetzner Cloud - ~$4.99/mo for CPX11 (US East)" })
+          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Supported Cloud Providers" }),
+          /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginTop: 1, children: [
+            /* @__PURE__ */ jsx10("text", { fg: t.status.success, children: "\u2713 " }),
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Hetzner Cloud - ~$4.99/mo for CPX11 (US East)" })
           ] }),
-          /* @__PURE__ */ jsxs9("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx9("text", { fg: t.status.success, children: "\u2713 " }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "DigitalOcean - Starting at $12/mo (NYC1)" })
+          /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx10("text", { fg: t.status.success, children: "\u2713 " }),
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "DigitalOcean - Starting at $12/mo (NYC1)" })
           ] }),
-          /* @__PURE__ */ jsxs9("box", { flexDirection: "row", children: [
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.muted, children: "\u25CB " }),
-            /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "Vultr - Coming soon" })
+          /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, children: "\u25CB " }),
+            /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "Vultr - Coming soon" })
           ] })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs9("box", { flexDirection: "column", marginBottom: 1, children: [
-      /* @__PURE__ */ jsx9("text", { fg: t.fg.primary, children: "Useful Links" }),
-      /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "\u2022 OpenClaw Docs: https://docs.openclaw.ai/" }),
-      /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "\u2022 Hetzner API: https://docs.hetzner.cloud/" }),
-      /* @__PURE__ */ jsx9("text", { fg: t.fg.secondary, children: "\u2022 Tailscale: https://tailscale.com/" })
+    /* @__PURE__ */ jsxs10("box", { flexDirection: "column", marginBottom: 1, children: [
+      /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "Useful Links" }),
+      /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "\u2022 OpenClaw Docs: https://docs.openclaw.ai/" }),
+      /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "\u2022 Hetzner API: https://docs.hetzner.cloud/" }),
+      /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: "\u2022 Tailscale: https://tailscale.com/" })
     ] }),
-    /* @__PURE__ */ jsx9("text", { fg: t.fg.muted, children: "Press any key to return to home" })
+    /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, children: "Press any key to return to home" })
   ] });
 }
 
 // src/components/TemplatesView.tsx
-import { useState as useState9, useRef as useRef4, useEffect as useEffect4 } from "react";
-import { useKeyboard as useKeyboard9 } from "@opentui/react";
-import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs10 } from "@opentui/react/jsx-runtime";
+import { useState as useState10, useRef as useRef5, useEffect as useEffect4 } from "react";
+import { useKeyboard as useKeyboard10 } from "@opentui/react";
+import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs11 } from "@opentui/react/jsx-runtime";
 var DO_DROPLET_SIZES2 = [
   { slug: "s-1vcpu-2gb", label: "1 vCPU, 2GB RAM, 50GB SSD", price: "$12/mo" },
   { slug: "s-2vcpu-2gb", label: "2 vCPU, 2GB RAM, 60GB SSD", price: "$18/mo" },
@@ -5801,20 +6330,20 @@ var DO_DROPLET_SIZES2 = [
   { slug: "s-8vcpu-16gb", label: "8 vCPU, 16GB RAM, 320GB SSD", price: "$96/mo" }
 ];
 function TemplatesView({ context }) {
-  const [viewState, setViewState] = useState9("listing");
-  const [templates, setTemplates] = useState9([]);
-  const [selectedIndex, setSelectedIndex] = useState9(0);
-  const [selectedTemplate, setSelectedTemplate] = useState9(null);
-  const [error, setError] = useState9(null);
-  const [forkStep, setForkStep] = useState9("fork_name");
-  const [forkName, setForkName] = useState9("");
-  const [forkProvider, setForkProvider] = useState9("hetzner");
-  const [forkProviderIndex, setForkProviderIndex] = useState9(0);
-  const [forkDropletSizeIndex, setForkDropletSizeIndex] = useState9(0);
-  const [forkAiProvider, setForkAiProvider] = useState9("");
-  const [forkAiProviderIndex, setForkAiProviderIndex] = useState9(0);
-  const [forkModel, setForkModel] = useState9("");
-  const stateRef = useRef4({
+  const [viewState, setViewState] = useState10("listing");
+  const [templates, setTemplates] = useState10([]);
+  const [selectedIndex, setSelectedIndex] = useState10(0);
+  const [selectedTemplate, setSelectedTemplate] = useState10(null);
+  const [error, setError] = useState10(null);
+  const [forkStep, setForkStep] = useState10("fork_name");
+  const [forkName, setForkName] = useState10("");
+  const [forkProvider, setForkProvider] = useState10("hetzner");
+  const [forkProviderIndex, setForkProviderIndex] = useState10(0);
+  const [forkDropletSizeIndex, setForkDropletSizeIndex] = useState10(0);
+  const [forkAiProvider, setForkAiProvider] = useState10("");
+  const [forkAiProviderIndex, setForkAiProviderIndex] = useState10(0);
+  const [forkModel, setForkModel] = useState10("");
+  const stateRef = useRef5({
     viewState,
     selectedIndex,
     selectedTemplate,
@@ -5928,7 +6457,7 @@ function TemplatesView({ context }) {
       setViewState("viewing");
     }
   };
-  useKeyboard9((key) => {
+  useKeyboard10((key) => {
     const s = stateRef.current;
     if (s.viewState === "listing") {
       if (key.name === "up") {
@@ -6020,37 +6549,37 @@ function TemplatesView({ context }) {
       }
     }
   });
-  const renderListing = () => /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, marginBottom: 1, children: "Select a template to view details. Use arrow keys and Enter." }),
-    /* @__PURE__ */ jsx10(
+  const renderListing = () => /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, marginBottom: 1, children: "Select a template to view details. Use arrow keys and Enter." }),
+    /* @__PURE__ */ jsx11(
       "box",
       {
         flexDirection: "column",
         borderStyle: "single",
         borderColor: t.border.default,
         padding: 1,
-        children: templates.length === 0 ? /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, children: "No templates found." }) : templates.map((tmpl, i) => {
+        children: templates.length === 0 ? /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, children: "No templates found." }) : templates.map((tmpl, i) => {
           const isSelected = i === selectedIndex;
           const badge = tmpl.builtIn ? "[built-in]" : "[custom]";
           const badgeColor = tmpl.builtIn ? t.status.info : t.status.success;
-          return /* @__PURE__ */ jsxs10("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
-            /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
-            /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: tmpl.name }),
-            /* @__PURE__ */ jsx10("text", { fg: badgeColor, children: " " + badge }),
-            /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, children: " \xB7 " + tmpl.channel })
+          return /* @__PURE__ */ jsxs11("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
+            /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
+            /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: tmpl.name }),
+            /* @__PURE__ */ jsx11("text", { fg: badgeColor, children: " " + badge }),
+            /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, children: " \xB7 " + tmpl.channel })
           ] }, tmpl.id);
         })
       }
     ),
-    /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to view, Esc to go back" })
+    /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to view, Esc to go back" })
   ] });
   const renderViewing = () => {
     if (!selectedTemplate) return null;
     const tmpl = selectedTemplate;
-    return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-      /* @__PURE__ */ jsx10("text", { fg: t.accent, marginBottom: 1, children: tmpl.name }),
-      /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, marginBottom: 1, children: tmpl.description }),
-      /* @__PURE__ */ jsxs10(
+    return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+      /* @__PURE__ */ jsx11("text", { fg: t.accent, marginBottom: 1, children: tmpl.name }),
+      /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, marginBottom: 1, children: tmpl.description }),
+      /* @__PURE__ */ jsxs11(
         "box",
         {
           flexDirection: "column",
@@ -6059,89 +6588,89 @@ function TemplatesView({ context }) {
           padding: 1,
           marginBottom: 1,
           children: [
-            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Type:" }),
-              /* @__PURE__ */ jsx10("text", { fg: tmpl.builtIn ? t.status.info : t.status.success, children: tmpl.builtIn ? "Built-in" : "Custom" })
+            /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Type:" }),
+              /* @__PURE__ */ jsx11("text", { fg: tmpl.builtIn ? t.status.info : t.status.success, children: tmpl.builtIn ? "Built-in" : "Custom" })
             ] }),
-            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Provider:" }),
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: PROVIDER_NAMES[tmpl.provider] })
+            /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Provider:" }),
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: PROVIDER_NAMES[tmpl.provider] })
             ] }),
-            tmpl.hetzner && /* @__PURE__ */ jsxs10(Fragment2, { children: [
-              /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Server Type:" }),
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: tmpl.hetzner.serverType })
+            tmpl.hetzner && /* @__PURE__ */ jsxs11(Fragment3, { children: [
+              /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Server Type:" }),
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: tmpl.hetzner.serverType })
               ] }),
-              /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Location:" }),
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: tmpl.hetzner.location })
+              /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Location:" }),
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: tmpl.hetzner.location })
               ] })
             ] }),
-            tmpl.digitalocean && /* @__PURE__ */ jsxs10(Fragment2, { children: [
-              /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Droplet Size:" }),
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: tmpl.digitalocean.size })
+            tmpl.digitalocean && /* @__PURE__ */ jsxs11(Fragment3, { children: [
+              /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Droplet Size:" }),
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: tmpl.digitalocean.size })
               ] }),
-              /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Region:" }),
-                /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: tmpl.digitalocean.region })
+              /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Region:" }),
+                /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: tmpl.digitalocean.region })
               ] })
             ] }),
-            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "AI Provider:" }),
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: tmpl.aiProvider })
+            /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "AI Provider:" }),
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: tmpl.aiProvider })
             ] }),
-            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Model:" }),
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: tmpl.model })
+            /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Model:" }),
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: tmpl.model })
             ] }),
-            /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Channel:" }),
-              /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: tmpl.channel })
+            /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Channel:" }),
+              /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: tmpl.channel })
             ] })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-        /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "[F]" }),
-        /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "ork  " }),
-        /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "[U]" }),
-        /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "se  " }),
-        !tmpl.builtIn && /* @__PURE__ */ jsxs10(Fragment2, { children: [
-          /* @__PURE__ */ jsx10("text", { fg: t.status.error, children: "[D]" }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "elete  " })
+      /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+        /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "[F]" }),
+        /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: "ork  " }),
+        /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "[U]" }),
+        /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: "se  " }),
+        !tmpl.builtIn && /* @__PURE__ */ jsxs11(Fragment3, { children: [
+          /* @__PURE__ */ jsx11("text", { fg: t.status.error, children: "[D]" }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: "elete  " })
         ] }),
-        /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, children: "[Esc] Back" })
+        /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, children: "[Esc] Back" })
       ] }),
-      error && /* @__PURE__ */ jsx10("text", { fg: t.status.error, marginTop: 1, children: error })
+      error && /* @__PURE__ */ jsx11("text", { fg: t.status.error, marginTop: 1, children: error })
     ] });
   };
-  const renderDeleteConfirm = () => /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx10("text", { fg: t.status.error, children: "Delete Template" }),
-    /* @__PURE__ */ jsxs10("text", { fg: t.fg.primary, marginTop: 1, children: [
+  const renderDeleteConfirm = () => /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx11("text", { fg: t.status.error, children: "Delete Template" }),
+    /* @__PURE__ */ jsxs11("text", { fg: t.fg.primary, marginTop: 1, children: [
       'Are you sure you want to delete "',
       selectedTemplate?.name,
       '"?'
     ] }),
-    /* @__PURE__ */ jsx10("text", { fg: t.status.warning, marginTop: 1, children: "This action cannot be undone." }),
-    /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 2, children: "Press Y to confirm, N to cancel" })
+    /* @__PURE__ */ jsx11("text", { fg: t.status.warning, marginTop: 1, children: "This action cannot be undone." }),
+    /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 2, children: "Press Y to confirm, N to cancel" })
   ] });
-  const renderForkComplete = () => /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx10("text", { fg: t.status.success, children: "Template Created!" }),
-    /* @__PURE__ */ jsxs10("text", { fg: t.fg.primary, marginTop: 1, children: [
+  const renderForkComplete = () => /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx11("text", { fg: t.status.success, children: "Template Created!" }),
+    /* @__PURE__ */ jsxs11("text", { fg: t.fg.primary, marginTop: 1, children: [
       'Your template "',
       forkName,
       '" has been saved.'
     ] }),
-    /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to templates list" })
+    /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to templates list" })
   ] });
   const renderForking = () => {
     switch (forkStep) {
       case "fork_name":
-        return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "Fork Template - Name" }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, marginTop: 1, children: "Enter a name for the new template:" }),
-          /* @__PURE__ */ jsx10(
+        return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "Fork Template - Name" }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, marginTop: 1, children: "Enter a name for the new template:" }),
+          /* @__PURE__ */ jsx11(
             "input",
             {
               value: forkName,
@@ -6164,14 +6693,14 @@ function TemplatesView({ context }) {
               }
             }
           ),
-          error && /* @__PURE__ */ jsx10("text", { fg: t.status.error, marginTop: 1, children: error }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 2, children: "Press Enter to continue, Esc to go back" })
+          error && /* @__PURE__ */ jsx11("text", { fg: t.status.error, marginTop: 1, children: error }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 2, children: "Press Enter to continue, Esc to go back" })
         ] });
       case "fork_provider":
-        return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "Fork Template - Provider" }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, marginTop: 1, children: "Select cloud provider:" }),
-          /* @__PURE__ */ jsx10(
+        return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "Fork Template - Provider" }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, marginTop: 1, children: "Select cloud provider:" }),
+          /* @__PURE__ */ jsx11(
             "box",
             {
               flexDirection: "column",
@@ -6181,20 +6710,20 @@ function TemplatesView({ context }) {
               padding: 1,
               children: SUPPORTED_PROVIDERS.map((p, i) => {
                 const isSelected = i === forkProviderIndex;
-                return /* @__PURE__ */ jsxs10("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: PROVIDER_NAMES[p] })
+                return /* @__PURE__ */ jsxs11("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: PROVIDER_NAMES[p] })
                 ] }, p);
               })
             }
           ),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to select, Esc to go back" })
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to select, Esc to go back" })
         ] });
       case "fork_droplet_size":
-        return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "Fork Template - Droplet Size" }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, marginTop: 1, children: "Select DigitalOcean droplet size:" }),
-          /* @__PURE__ */ jsx10(
+        return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "Fork Template - Droplet Size" }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, marginTop: 1, children: "Select DigitalOcean droplet size:" }),
+          /* @__PURE__ */ jsx11(
             "box",
             {
               flexDirection: "column",
@@ -6204,21 +6733,21 @@ function TemplatesView({ context }) {
               padding: 1,
               children: DO_DROPLET_SIZES2.map((size, i) => {
                 const isSelected = i === forkDropletSizeIndex;
-                return /* @__PURE__ */ jsxs10("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: size.slug }),
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.fg.primary : t.fg.secondary, children: " - " + size.label + " - " + size.price })
+                return /* @__PURE__ */ jsxs11("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: size.slug }),
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.fg.primary : t.fg.secondary, children: " - " + size.label + " - " + size.price })
                 ] }, size.slug);
               })
             }
           ),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to select, Esc to go back" })
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to select, Esc to go back" })
         ] });
       case "fork_ai_provider":
-        return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "Fork Template - AI Provider" }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, marginTop: 1, children: "Select AI provider:" }),
-          /* @__PURE__ */ jsx10(
+        return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "Fork Template - AI Provider" }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, marginTop: 1, children: "Select AI provider:" }),
+          /* @__PURE__ */ jsx11(
             "box",
             {
               flexDirection: "column",
@@ -6228,21 +6757,21 @@ function TemplatesView({ context }) {
               padding: 1,
               children: AI_PROVIDERS.map((p, i) => {
                 const isSelected = i === forkAiProviderIndex;
-                return /* @__PURE__ */ jsxs10("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: p.label }),
-                  /* @__PURE__ */ jsx10("text", { fg: isSelected ? t.fg.primary : t.fg.secondary, children: " - " + p.description })
+                return /* @__PURE__ */ jsxs11("box", { flexDirection: "row", backgroundColor: isSelected ? t.selection.bg : void 0, children: [
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.selection.fg : t.fg.primary, children: p.label }),
+                  /* @__PURE__ */ jsx11("text", { fg: isSelected ? t.fg.primary : t.fg.secondary, children: " - " + p.description })
                 ] }, p.name);
               })
             }
           ),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to select, Esc to go back" })
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 1, children: "Enter to select, Esc to go back" })
         ] });
       case "fork_model":
-        return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "Fork Template - Model" }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, marginTop: 1, children: "Enter the model identifier:" }),
-          /* @__PURE__ */ jsx10(
+        return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "Fork Template - Model" }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, marginTop: 1, children: "Enter the model identifier:" }),
+          /* @__PURE__ */ jsx11(
             "input",
             {
               value: forkModel,
@@ -6265,13 +6794,13 @@ function TemplatesView({ context }) {
               }
             }
           ),
-          error && /* @__PURE__ */ jsx10("text", { fg: t.status.error, marginTop: 1, children: error }),
-          /* @__PURE__ */ jsx10("text", { fg: t.fg.muted, marginTop: 2, children: "Press Enter to continue, Esc to go back" })
+          error && /* @__PURE__ */ jsx11("text", { fg: t.status.error, marginTop: 1, children: error }),
+          /* @__PURE__ */ jsx11("text", { fg: t.fg.muted, marginTop: 2, children: "Press Enter to continue, Esc to go back" })
         ] });
       case "fork_confirm":
-        return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", children: [
-          /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "Fork Template - Confirm" }),
-          /* @__PURE__ */ jsxs10(
+        return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", children: [
+          /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "Fork Template - Confirm" }),
+          /* @__PURE__ */ jsxs11(
             "box",
             {
               flexDirection: "column",
@@ -6280,35 +6809,35 @@ function TemplatesView({ context }) {
               padding: 1,
               marginTop: 1,
               children: [
-                /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Name:" }),
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: forkName })
+                /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Name:" }),
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: forkName })
                 ] }),
-                /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Provider:" }),
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: PROVIDER_NAMES[forkProvider] })
+                /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Provider:" }),
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: PROVIDER_NAMES[forkProvider] })
                 ] }),
-                forkProvider === "digitalocean" && /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Droplet Size:" }),
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: DO_DROPLET_SIZES2[forkDropletSizeIndex].slug })
+                forkProvider === "digitalocean" && /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Droplet Size:" }),
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: DO_DROPLET_SIZES2[forkDropletSizeIndex].slug })
                 ] }),
-                /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "AI Provider:" }),
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: forkAiProvider })
+                /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "AI Provider:" }),
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: forkAiProvider })
                 ] }),
-                /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Model:" }),
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: forkModel })
+                /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Model:" }),
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: forkModel })
                 ] }),
-                /* @__PURE__ */ jsxs10("box", { flexDirection: "row", children: [
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, width: 20, children: "Channel:" }),
-                  /* @__PURE__ */ jsx10("text", { fg: t.fg.primary, children: "telegram" })
+                /* @__PURE__ */ jsxs11("box", { flexDirection: "row", children: [
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, width: 20, children: "Channel:" }),
+                  /* @__PURE__ */ jsx11("text", { fg: t.fg.primary, children: "telegram" })
                 ] })
               ]
             }
           ),
-          error && /* @__PURE__ */ jsx10("text", { fg: t.status.error, marginTop: 1, children: error }),
-          /* @__PURE__ */ jsx10("text", { fg: t.status.warning, marginTop: 2, children: "Press Y to confirm, N to go back" })
+          error && /* @__PURE__ */ jsx11("text", { fg: t.status.error, marginTop: 1, children: error }),
+          /* @__PURE__ */ jsx11("text", { fg: t.status.warning, marginTop: 2, children: "Press Y to confirm, N to go back" })
         ] });
     }
   };
@@ -6326,34 +6855,464 @@ function TemplatesView({ context }) {
         return renderForking();
     }
   };
-  return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", width: "100%", padding: 1, children: [
-    /* @__PURE__ */ jsxs10("box", { flexDirection: "row", marginBottom: 2, children: [
-      /* @__PURE__ */ jsx10("text", { fg: t.accent, children: "/templates" }),
-      /* @__PURE__ */ jsx10("text", { fg: t.fg.secondary, children: " - Manage deployment templates" })
+  return /* @__PURE__ */ jsxs11("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+    /* @__PURE__ */ jsxs11("box", { flexDirection: "row", marginBottom: 2, children: [
+      /* @__PURE__ */ jsx11("text", { fg: t.accent, children: "/templates" }),
+      /* @__PURE__ */ jsx11("text", { fg: t.fg.secondary, children: " - Manage deployment templates" })
     ] }),
     renderContent()
   ] });
 }
 
+// src/components/DashboardView.tsx
+import { useState as useState11, useCallback as useCallback3 } from "react";
+import { useKeyboard as useKeyboard11, useRenderer } from "@opentui/react";
+import { spawnSync as spawnSync2 } from "child_process";
+import { platform as platform2 } from "os";
+
+// src/services/tunnel.ts
+import { spawn as spawn2 } from "child_process";
+import { createServer } from "net";
+var activeTunnels = /* @__PURE__ */ new Map();
+function isPortAvailable(port) {
+  return new Promise((resolve) => {
+    const server = createServer();
+    server.once("error", () => resolve(false));
+    server.once("listening", () => {
+      server.close(() => resolve(true));
+    });
+    server.listen(port, "127.0.0.1");
+  });
+}
+async function findAvailablePort(startPort) {
+  for (let port = startPort; port < startPort + 100; port++) {
+    if (await isPortAvailable(port)) return port;
+  }
+  throw new Error(`No available port found in range ${startPort}\u2013${startPort + 99}`);
+}
+async function startTunnel(deploymentName, serverIp, remotePort = 18789) {
+  const existing = getTunnel(deploymentName);
+  if (existing) return existing;
+  const sshKeyPath = getSSHKeyPath(deploymentName);
+  const localPort = await findAvailablePort(remotePort);
+  const proc = spawn2("ssh", [
+    "-N",
+    "-L",
+    `${localPort}:127.0.0.1:${remotePort}`,
+    "-i",
+    sshKeyPath,
+    "-o",
+    "StrictHostKeyChecking=no",
+    "-o",
+    "UserKnownHostsFile=/dev/null",
+    "-o",
+    "ServerAliveInterval=15",
+    "-o",
+    "ServerAliveCountMax=3",
+    "-o",
+    "ExitOnForwardFailure=yes",
+    `root@${serverIp}`
+  ], {
+    stdio: ["ignore", "pipe", "pipe"],
+    detached: false
+  });
+  const tunnel = {
+    deploymentName,
+    serverIp,
+    localPort,
+    remotePort,
+    process: proc,
+    dashboardUrl: null,
+    startedAt: (/* @__PURE__ */ new Date()).toISOString()
+  };
+  activeTunnels.set(deploymentName, tunnel);
+  proc.on("exit", () => {
+    activeTunnels.delete(deploymentName);
+  });
+  await new Promise((resolve) => setTimeout(resolve, 2500));
+  if (proc.exitCode !== null || proc.killed) {
+    activeTunnels.delete(deploymentName);
+    throw new Error("SSH tunnel failed to establish. Check that the server is reachable.");
+  }
+  return tunnel;
+}
+function stopTunnel(deploymentName) {
+  const tunnel = activeTunnels.get(deploymentName);
+  if (tunnel) {
+    tunnel.process.kill();
+    activeTunnels.delete(deploymentName);
+  }
+}
+function getTunnel(deploymentName) {
+  const tunnel = activeTunnels.get(deploymentName);
+  if (tunnel && tunnel.process.exitCode === null && !tunnel.process.killed) {
+    return tunnel;
+  }
+  if (tunnel) activeTunnels.delete(deploymentName);
+  return null;
+}
+function getActiveTunnels() {
+  for (const [name, tunnel] of activeTunnels) {
+    if (tunnel.process.exitCode !== null || tunnel.process.killed) {
+      activeTunnels.delete(name);
+    }
+  }
+  return Array.from(activeTunnels.values());
+}
+
+// src/components/DashboardView.tsx
+import { jsx as jsx12, jsxs as jsxs12 } from "@opentui/react/jsx-runtime";
+function openInBrowser(url) {
+  try {
+    if (platform2() === "darwin") {
+      spawnSync2("open", [url]);
+    } else {
+      spawnSync2("xdg-open", [url]);
+    }
+    return true;
+  } catch {
+    return false;
+  }
+}
+function DashboardView({ context }) {
+  const renderer = useRenderer();
+  const [viewState, setViewState] = useState11("selecting");
+  const [selectedIndex, setSelectedIndex] = useState11(0);
+  const [error, setError] = useState11(null);
+  const [activeTunnel, setActiveTunnel] = useState11(null);
+  const [dashboardUrl, setDashboardUrl] = useState11(null);
+  const [connectMessage, setConnectMessage] = useState11("");
+  const [copied, setCopied] = useState11(false);
+  const deployedDeployments = context.deployments.filter(
+    (d) => d.state.status === "deployed" && d.state.serverIp
+  );
+  const connectToDashboard = useCallback3(async (deployment) => {
+    setViewState("connecting");
+    setError(null);
+    setCopied(false);
+    setConnectMessage("Establishing SSH tunnel...");
+    try {
+      const serverIp = deployment.state.serverIp;
+      const remotePort = deployment.config.openclawConfig?.gateway?.port || 18789;
+      const tunnel = await startTunnel(
+        deployment.config.name,
+        serverIp,
+        remotePort
+      );
+      setActiveTunnel(tunnel);
+      if (tunnel.dashboardUrl) {
+        setDashboardUrl(tunnel.dashboardUrl);
+        setViewState("active");
+        return;
+      }
+      setConnectMessage("Retrieving dashboard URL...");
+      const localToken = deployment.state.gatewayToken;
+      if (localToken) {
+        const localUrl = `http://127.0.0.1:${tunnel.localPort}/?token=${encodeURIComponent(localToken)}`;
+        tunnel.dashboardUrl = localUrl;
+        setDashboardUrl(localUrl);
+        setViewState("active");
+        return;
+      }
+      const ssh = await connectToDeployment(
+        deployment.config.name,
+        serverIp
+      );
+      try {
+        const info = await getDashboardUrl(ssh);
+        const parsed = new URL(info.url);
+        parsed.hostname = "127.0.0.1";
+        parsed.port = String(tunnel.localPort);
+        const localUrl = parsed.toString();
+        tunnel.dashboardUrl = localUrl;
+        setDashboardUrl(localUrl);
+        setViewState("active");
+      } finally {
+        ssh.disconnect();
+      }
+    } catch (err) {
+      setError(err instanceof Error ? err.message : String(err));
+      setViewState("error");
+    }
+  }, []);
+  useKeyboard11((key) => {
+    if (viewState === "selecting") {
+      if (deployedDeployments.length === 0) {
+        if (key.name === "escape" || key.name === "return") {
+          context.navigateTo("home");
+        }
+        return;
+      }
+      if (key.name === "up" && selectedIndex > 0) {
+        setSelectedIndex(selectedIndex - 1);
+      } else if (key.name === "down" && selectedIndex < deployedDeployments.length - 1) {
+        setSelectedIndex(selectedIndex + 1);
+      } else if (key.name === "return") {
+        const deployment = deployedDeployments[selectedIndex];
+        const existing = getTunnel(deployment.config.name);
+        if (existing && existing.dashboardUrl) {
+          setActiveTunnel(existing);
+          setDashboardUrl(existing.dashboardUrl);
+          setViewState("active");
+          return;
+        }
+        connectToDashboard(deployment);
+      } else if (key.name === "escape") {
+        context.navigateTo("home");
+      }
+    } else if (viewState === "active") {
+      if (key.sequence === "o" || key.sequence === "O") {
+        if (dashboardUrl) openInBrowser(dashboardUrl);
+      } else if (key.sequence === "c" || key.sequence === "C") {
+        if (dashboardUrl) {
+          renderer.copyToClipboardOSC52(dashboardUrl);
+          setCopied(true);
+          setTimeout(() => setCopied(false), 3e3);
+        }
+      } else if (key.sequence === "d" || key.sequence === "D") {
+        if (activeTunnel) {
+          stopTunnel(activeTunnel.deploymentName);
+          setActiveTunnel(null);
+          setDashboardUrl(null);
+          setViewState("selecting");
+        }
+      } else if (key.name === "escape") {
+        setViewState("selecting");
+      }
+    } else if (viewState === "error") {
+      if (key.name === "escape" || key.name === "return") {
+        setViewState("selecting");
+      }
+    }
+  });
+  if (deployedDeployments.length === 0) {
+    return /* @__PURE__ */ jsxs12("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs12("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx12("text", { fg: t.accent, children: "/dashboard" }),
+        /* @__PURE__ */ jsx12("text", { fg: t.fg.secondary, children: " - Open OpenClaw dashboard" })
+      ] }),
+      /* @__PURE__ */ jsxs12(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.default,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsx12("text", { fg: t.status.warning, children: "No deployed instances found!" }),
+            /* @__PURE__ */ jsx12("text", { fg: t.fg.secondary, marginTop: 1, children: "Deploy an instance first with /deploy" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx12("text", { fg: t.fg.muted, marginTop: 2, children: "Press any key to return to home" })
+    ] });
+  }
+  if (viewState === "selecting") {
+    const tunnels = getActiveTunnels();
+    return /* @__PURE__ */ jsxs12("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs12("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx12("text", { fg: t.accent, children: "/dashboard" }),
+        /* @__PURE__ */ jsxs12("text", { fg: t.fg.secondary, children: [
+          " ",
+          "- Select a deployment to open its dashboard"
+        ] })
+      ] }),
+      tunnels.length > 0 && /* @__PURE__ */ jsxs12(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.status.success,
+          padding: 1,
+          marginBottom: 1,
+          children: [
+            /* @__PURE__ */ jsxs12("text", { fg: t.status.success, children: [
+              tunnels.length,
+              " active tunnel",
+              tunnels.length > 1 ? "s" : ""
+            ] }),
+            tunnels.map((tun) => /* @__PURE__ */ jsxs12("text", { fg: t.fg.secondary, children: [
+              tun.deploymentName,
+              ": 127.0.0.1:",
+              tun.localPort,
+              " \u2192",
+              " ",
+              tun.serverIp,
+              ":",
+              tun.remotePort
+            ] }, tun.deploymentName))
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx12(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.default,
+          padding: 1,
+          marginBottom: 1,
+          children: deployedDeployments.map((deployment, index) => {
+            const isSelected = index === selectedIndex;
+            const hasTunnel = getTunnel(deployment.config.name) !== null;
+            return /* @__PURE__ */ jsxs12(
+              "box",
+              {
+                flexDirection: "row",
+                backgroundColor: isSelected ? t.selection.bg : void 0,
+                children: [
+                  /* @__PURE__ */ jsx12("text", { fg: isSelected ? t.selection.fg : t.fg.secondary, children: isSelected ? "> " : "  " }),
+                  /* @__PURE__ */ jsx12(
+                    "text",
+                    {
+                      fg: isSelected ? t.selection.fg : t.fg.primary,
+                      width: 25,
+                      children: deployment.config.name
+                    }
+                  ),
+                  /* @__PURE__ */ jsx12("text", { fg: t.accent, width: 18, children: deployment.state.serverIp }),
+                  hasTunnel && /* @__PURE__ */ jsx12("text", { fg: t.status.success, children: "[tunnel active]" })
+                ]
+              },
+              deployment.config.name
+            );
+          })
+        }
+      ),
+      /* @__PURE__ */ jsx12("text", { fg: t.fg.muted, children: "Arrow keys to select | Enter to connect | Esc to go back" })
+    ] });
+  }
+  if (viewState === "connecting") {
+    return /* @__PURE__ */ jsxs12("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs12("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx12("text", { fg: t.accent, children: "/dashboard" }),
+        /* @__PURE__ */ jsx12("text", { fg: t.fg.secondary, children: " - Connecting..." })
+      ] }),
+      /* @__PURE__ */ jsxs12(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.focus,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsx12("text", { fg: t.status.info, children: connectMessage }),
+            /* @__PURE__ */ jsx12("text", { fg: t.fg.muted, marginTop: 1, children: "This may take a few seconds..." })
+          ]
+        }
+      )
+    ] });
+  }
+  if (viewState === "active" && activeTunnel && dashboardUrl) {
+    return /* @__PURE__ */ jsxs12("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs12("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx12("text", { fg: t.status.success, children: "/dashboard" }),
+        /* @__PURE__ */ jsxs12("text", { fg: t.fg.secondary, children: [
+          " ",
+          "- ",
+          activeTunnel.deploymentName
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs12(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "double",
+          borderColor: t.status.success,
+          padding: 1,
+          marginBottom: 1,
+          children: [
+            /* @__PURE__ */ jsx12("text", { fg: t.status.success, children: "Dashboard Ready" }),
+            /* @__PURE__ */ jsxs12("text", { fg: t.fg.primary, marginTop: 1, children: [
+              "Tunnel: 127.0.0.1:",
+              activeTunnel.localPort,
+              " \u2192",
+              " ",
+              activeTunnel.serverIp,
+              ":",
+              activeTunnel.remotePort
+            ] })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs12(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.accent,
+          padding: 1,
+          marginBottom: 1,
+          children: [
+            /* @__PURE__ */ jsx12("text", { fg: t.fg.secondary, children: "Dashboard URL:" }),
+            /* @__PURE__ */ jsx12("text", { fg: t.accent, marginTop: 1, children: dashboardUrl })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs12("box", { flexDirection: "column", marginBottom: 1, children: [
+        /* @__PURE__ */ jsxs12("box", { flexDirection: "row", children: [
+          /* @__PURE__ */ jsx12("text", { fg: t.accent, width: 4, children: "O" }),
+          /* @__PURE__ */ jsx12("text", { fg: t.fg.primary, children: "Open in browser" })
+        ] }),
+        /* @__PURE__ */ jsxs12("box", { flexDirection: "row", children: [
+          /* @__PURE__ */ jsx12("text", { fg: t.accent, width: 4, children: "C" }),
+          /* @__PURE__ */ jsx12("text", { fg: t.fg.primary, children: "Copy URL to clipboard" })
+        ] }),
+        /* @__PURE__ */ jsxs12("box", { flexDirection: "row", children: [
+          /* @__PURE__ */ jsx12("text", { fg: t.accent, width: 4, children: "D" }),
+          /* @__PURE__ */ jsx12("text", { fg: t.fg.primary, children: "Disconnect tunnel" })
+        ] }),
+        /* @__PURE__ */ jsxs12("box", { flexDirection: "row", children: [
+          /* @__PURE__ */ jsx12("text", { fg: t.accent, width: 4, children: "Esc" }),
+          /* @__PURE__ */ jsx12("text", { fg: t.fg.primary, children: "Back to selection (tunnel stays active)" })
+        ] })
+      ] }),
+      copied && /* @__PURE__ */ jsx12("text", { fg: t.status.success, children: "URL copied to clipboard!" })
+    ] });
+  }
+  if (viewState === "error") {
+    return /* @__PURE__ */ jsxs12("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs12("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx12("text", { fg: t.status.error, children: "/dashboard" }),
+        /* @__PURE__ */ jsx12("text", { fg: t.fg.secondary, children: " - Connection failed" })
+      ] }),
+      /* @__PURE__ */ jsx12(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.status.error,
+          padding: 1,
+          marginBottom: 1,
+          children: /* @__PURE__ */ jsx12("text", { fg: t.status.error, children: error })
+        }
+      ),
+      /* @__PURE__ */ jsx12("text", { fg: t.fg.muted, children: "Press Enter or Esc to go back" })
+    ] });
+  }
+  return null;
+}
+
 // src/App.tsx
-import { jsx as jsx11 } from "@opentui/react/jsx-runtime";
+import { jsx as jsx13 } from "@opentui/react/jsx-runtime";
 function App() {
-  const renderer = useRenderer();
-  const [currentView, setCurrentView] = useState10("home");
-  const [selectedDeployment, setSelectedDeployment] = useState10(null);
-  const [deployments, setDeployments] = useState10(() => {
+  const renderer = useRenderer2();
+  const [currentView, setCurrentView] = useState12("home");
+  const [selectedDeployment, setSelectedDeployment] = useState12(null);
+  const [deployments, setDeployments] = useState12(() => {
     try {
       return getAllDeployments();
     } catch {
       return [];
     }
   });
-  const [selectedTemplate, setSelectedTemplate] = useState10(null);
-  const wasDraggingRef = useRef5(false);
-  const handleMouseDrag = useCallback3(() => {
+  const [selectedTemplate, setSelectedTemplate] = useState12(null);
+  const [editingDeployment, setEditingDeployment] = useState12(null);
+  const wasDraggingRef = useRef6(false);
+  const handleMouseDrag = useCallback4(() => {
     wasDraggingRef.current = true;
   }, []);
-  const handleMouseUp = useCallback3(() => {
+  const handleMouseUp = useCallback4(() => {
     if (!wasDraggingRef.current) return;
     wasDraggingRef.current = false;
     const selection = renderer.getSelection();
@@ -6364,14 +7323,14 @@ function App() {
       }
     }
   }, [renderer]);
-  const refreshDeployments = useCallback3(() => {
+  const refreshDeployments = useCallback4(() => {
     try {
       setDeployments(getAllDeployments());
     } catch {
       setDeployments([]);
     }
   }, []);
-  const navigateTo = useCallback3((view, deployment) => {
+  const navigateTo = useCallback4((view, deployment) => {
     if (deployment !== void 0) {
       setSelectedDeployment(deployment);
     }
@@ -6384,35 +7343,41 @@ function App() {
     deployments,
     refreshDeployments,
     selectedTemplate,
-    setSelectedTemplate
+    setSelectedTemplate,
+    editingDeployment,
+    setEditingDeployment
   };
   const renderView = () => {
     switch (currentView) {
       case "home":
-        return /* @__PURE__ */ jsx11(Home, { context });
+        return /* @__PURE__ */ jsx13(Home, { context });
       case "new":
-        return /* @__PURE__ */ jsx11(NewDeployment, { context });
+        return /* @__PURE__ */ jsx13(NewDeployment, { context });
+      case "list":
+        return /* @__PURE__ */ jsx13(ListView, { context });
       case "deploy":
-        return /* @__PURE__ */ jsx11(DeployView, { context });
+        return /* @__PURE__ */ jsx13(DeployView, { context });
       case "deploying":
-        return /* @__PURE__ */ jsx11(DeployingView, { context });
+        return /* @__PURE__ */ jsx13(DeployingView, { context });
       case "status":
-        return /* @__PURE__ */ jsx11(StatusView, { context });
+        return /* @__PURE__ */ jsx13(StatusView, { context });
       case "ssh":
-        return /* @__PURE__ */ jsx11(SSHView, { context });
+        return /* @__PURE__ */ jsx13(SSHView, { context });
       case "logs":
-        return /* @__PURE__ */ jsx11(LogsView, { context });
+        return /* @__PURE__ */ jsx13(LogsView, { context });
+      case "dashboard":
+        return /* @__PURE__ */ jsx13(DashboardView, { context });
       case "destroy":
-        return /* @__PURE__ */ jsx11(DestroyView, { context });
+        return /* @__PURE__ */ jsx13(DestroyView, { context });
       case "help":
-        return /* @__PURE__ */ jsx11(HelpView, { context });
+        return /* @__PURE__ */ jsx13(HelpView, { context });
       case "templates":
-        return /* @__PURE__ */ jsx11(TemplatesView, { context });
+        return /* @__PURE__ */ jsx13(TemplatesView, { context });
       default:
-        return /* @__PURE__ */ jsx11(Home, { context });
+        return /* @__PURE__ */ jsx13(Home, { context });
     }
   };
-  return /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx13(
     "scrollbox",
     {
       width: "100%",
@@ -6439,7 +7404,7 @@ function App() {
 }
 
 // src/index.tsx
-import { jsx as jsx12 } from "@opentui/react/jsx-runtime";
+import { jsx as jsx14 } from "@opentui/react/jsx-runtime";
 var args = process.argv.slice(2);
 if (args.includes("--version") || args.includes("-v")) {
   const require2 = createRequire(import.meta.url);
@@ -6473,6 +7438,6 @@ async function main() {
     useMouse: true
   });
   const root = createRoot(renderer);
-  root.render(/* @__PURE__ */ jsx12(App, {}));
+  root.render(/* @__PURE__ */ jsx14(App, {}));
 }
 main().catch(console.error);