@burdenoff/microfe-vibecontrols 2026.601.7 → 2026.601.9

package/dist/components/graph/MeshDeployWizard.js

@@ -0,0 +1,393 @@
+import { useDeployAgentViaMeshMutation as e, useMeshDeployJobStatusLazyQuery as t } from "../../generated/wspace-operations.js";
+import { useTr as n } from "../../shared/hooks/useTr.js";
+import { useCallback as r, useEffect as i, useMemo as a, useState as o } from "react";
+import { Check as s, CheckCircle as ee, Laptop as te, Loader2 as c, Server as ne, X as re, XCircle as l } from "lucide-react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/graph/MeshDeployWizard.tsx
+var f = {
+	probe: "Probing target",
+	"install-bun": "Installing Bun runtime",
+	"install-agent": "Installing VibeControls Agent",
+	autostart: "Configuring autostart",
+	plugins: "Installing plugins",
+	start: "Starting agent",
+	bootstrap: "Bootstrapping tunnel",
+	onboard: "Onboarding agent",
+	"store-creds": "Storing credentials",
+	"report-link": "Linking into mesh",
+	"probe-peer": "Probing new peer"
+};
+function p(e) {
+	return e && typeof e == "object" && !Array.isArray(e) ? e : null;
+}
+function m(e, t) {
+	let n = e?.[t];
+	return typeof n == "string" ? n : null;
+}
+var h = "px-3 py-2 text-sm rounded-md bg-bg-sunken border border-border-default text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/40 w-full", g = "text-xs font-medium text-text-secondary mb-1 block";
+function _({ sourceAgents: _, initialSourceAgentId: v, availablePermissions: y, onClose: b, onCompleted: x }) {
+	let S = n(), [C, ie] = o(v ?? _[0]?.id ?? ""), [w, T] = o("ssh"), [E, D] = o(""), [O, k] = o(22), [A, j] = o(""), [M, N] = o("agent"), [P, F] = o(""), [I, L] = o(""), [R, z] = o(!1), [B, V] = o(/* @__PURE__ */ new Set()), [H, U] = o(null), [W, G] = o(null), [K, q] = o(null), [J, { loading: Y }] = e(), [X] = t({ fetchPolicy: "network-only" }), Z = a(() => C ? w === "ssh" ? E.trim().length > 0 && A.trim().length > 0 : !0 : !1, [
+		C,
+		w,
+		E,
+		A
+	]), ae = r((e) => {
+		V((t) => {
+			let n = new Set(t);
+			return n.has(e) ? n.delete(e) : n.add(e), n;
+		});
+	}, []), Q = r(() => {
+		if (w === "same") return "localhost";
+		let e = E.trim(), t = A.trim(), n = t ? `${t}@${e}` : e;
+		return O && O !== 22 ? `${n}:${O}` : n;
+	}, [
+		w,
+		E,
+		A,
+		O
+	]), oe = r(async () => {
+		if (Z) {
+			q(null), G(null), U(null);
+			try {
+				let e = await J({ variables: {
+					rootAgentId: C,
+					input: {
+						target: Q(),
+						permissions: B.size > 0 ? Array.from(B) : void 0,
+						identityFile: w === "ssh" && M === "key" && P || void 0,
+						label: I || void 0,
+						connectExisting: R
+					}
+				} }), t = e.data?.deployAgentViaMesh;
+				if (e.error || t?.error || t?.ok === !1) {
+					q(t?.error ?? e.error?.message ?? S("mesh.deploy.failed", "Deploy failed"));
+					return;
+				}
+				let n = p(t?.data), r = m(n, "jobId");
+				if (!r) {
+					q(S("mesh.deploy.noJob", "Deploy started but no job id was returned by the agent."));
+					return;
+				}
+				U(r), G({
+					status: m(n, "status") ?? "running",
+					steps: []
+				});
+			} catch (e) {
+				q(e instanceof Error ? e.message : String(e));
+			}
+		}
+	}, [
+		Z,
+		J,
+		C,
+		Q,
+		B,
+		w,
+		M,
+		P,
+		I,
+		R,
+		S
+	]);
+	i(() => {
+		if (!H || !C) return;
+		let e = !1, t = () => {
+			X({ variables: {
+				rootAgentId: C,
+				jobId: H
+			} }).then((t) => {
+				if (e) return;
+				let n = t.data?.meshDeployJobStatus, r = p(n?.data);
+				if (!r) return;
+				let i = Array.isArray(r.steps) ? r.steps : [];
+				G({
+					status: m(r, "status") ?? "running",
+					steps: i,
+					error: m(r, "error") ?? n?.error ?? void 0
+				}), m(r, "status") === "completed" && x();
+			}).catch(() => {});
+		};
+		t();
+		let n = setInterval(t, 2e3);
+		return () => {
+			e = !0, clearInterval(n);
+		};
+	}, [
+		H,
+		C,
+		X,
+		x
+	]);
+	let $ = W?.status === "running" || H !== null && W?.status !== "completed" && W?.status !== "failed";
+	return /* @__PURE__ */ d("div", {
+		className: "fixed inset-0 z-50 flex items-center justify-center",
+		children: [/* @__PURE__ */ u("div", {
+			role: "button",
+			tabIndex: 0,
+			"aria-label": S("mesh.deploy.close", "Close"),
+			className: "fixed inset-0 bg-bg-overlay backdrop-blur-sm",
+			onClick: $ ? void 0 : b,
+			onKeyDown: (e) => {
+				!$ && (e.key === "Escape" || e.key === "Enter") && b();
+			}
+		}), /* @__PURE__ */ d("div", {
+			className: "relative bg-bg-surface rounded-xl shadow-2xl border border-border-default max-w-lg w-full mx-4 p-6 max-h-[90vh] overflow-auto",
+			children: [/* @__PURE__ */ d("div", {
+				className: "flex items-center justify-between mb-4",
+				children: [/* @__PURE__ */ u("h2", {
+					className: "text-lg font-semibold text-text-primary",
+					children: S("mesh.deploy.title", "Deploy Agent via Mesh")
+				}), !$ && /* @__PURE__ */ u("button", {
+					type: "button",
+					onClick: b,
+					className: "p-1 rounded-lg hover:bg-bg-sunken",
+					"aria-label": S("mesh.deploy.close", "Close"),
+					children: /* @__PURE__ */ u(re, { size: 18 })
+				})]
+			}), H ? /* @__PURE__ */ d("div", {
+				className: "space-y-3",
+				children: [
+					/* @__PURE__ */ u("p", {
+						className: "text-sm text-text-secondary",
+						children: S("mesh.deploy.deploying", "Deploying through {{agent}}…", { agent: _.find((e) => e.id === C)?.name ?? "agent" })
+					}),
+					/* @__PURE__ */ u("div", {
+						className: "space-y-2",
+						children: W && W.steps.length > 0 ? W.steps.map((e, t) => /* @__PURE__ */ d("div", {
+							className: "flex items-center gap-3",
+							children: [
+								e.status === "running" && /* @__PURE__ */ u(c, {
+									className: "animate-spin text-action-primary-bg",
+									size: 16
+								}),
+								e.status === "completed" && /* @__PURE__ */ u(ee, {
+									className: "text-status-success-text",
+									size: 16
+								}),
+								e.status === "failed" && /* @__PURE__ */ u(l, {
+									className: "text-status-error-text",
+									size: 16
+								}),
+								e.status === "skipped" && /* @__PURE__ */ u(s, {
+									className: "text-text-tertiary",
+									size: 16
+								}),
+								e.status === "pending" && /* @__PURE__ */ u("div", { className: "size-4 rounded-full border-2 border-border-default" }),
+								/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("div", {
+									className: "text-sm font-medium text-text-primary",
+									children: S(`mesh.deploy.step.${e.step}`, f[e.step] ?? e.step)
+								}), e.message ? /* @__PURE__ */ u("div", {
+									className: "text-xs text-text-tertiary",
+									children: e.message
+								}) : null] })
+							]
+						}, `${e.step}-${t}`)) : /* @__PURE__ */ d("div", {
+							className: "flex items-center gap-3",
+							children: [/* @__PURE__ */ u(c, {
+								className: "animate-spin text-action-primary-bg",
+								size: 16
+							}), /* @__PURE__ */ u("span", {
+								className: "text-sm text-text-secondary",
+								children: S("mesh.deploy.starting", "Starting deploy job…")
+							})]
+						})
+					}),
+					W?.status === "completed" && /* @__PURE__ */ u("div", {
+						className: "rounded-lg border border-status-success-border bg-status-success-bg-subtle p-3 text-sm text-status-success-text",
+						children: S("mesh.deploy.success", "Agent deployed successfully!")
+					}),
+					W?.status === "failed" && /* @__PURE__ */ u("div", {
+						className: "rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text",
+						children: W.error ?? S("mesh.deploy.jobFailed", "Deploy failed.")
+					}),
+					/* @__PURE__ */ u("button", {
+						type: "button",
+						onClick: b,
+						disabled: $,
+						className: "w-full px-4 py-2 rounded-md border border-border-default hover:bg-bg-sunken transition-colors disabled:opacity-50 disabled:cursor-not-allowed text-sm font-medium text-text-primary",
+						children: $ ? S("mesh.deploy.deployingShort", "Deploying…") : S("common.close", "Close")
+					})
+				]
+			}) : /* @__PURE__ */ d("div", {
+				className: "space-y-4",
+				children: [
+					/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+						className: g,
+						htmlFor: "mesh-source-agent",
+						children: S("mesh.deploy.sourceAgent", "Source agent (deploys from)")
+					}), /* @__PURE__ */ d("select", {
+						id: "mesh-source-agent",
+						value: C,
+						onChange: (e) => ie(e.target.value),
+						className: h,
+						children: [_.length === 0 && /* @__PURE__ */ u("option", {
+							value: "",
+							children: S("mesh.deploy.noAgents", "No agents available")
+						}), _.map((e) => /* @__PURE__ */ d("option", {
+							value: e.id,
+							children: [
+								e.name,
+								" (",
+								e.hostname,
+								")",
+								e.isActive ? "" : " · offline"
+							]
+						}, e.id))]
+					})] }),
+					/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("span", {
+						className: g,
+						children: S("mesh.deploy.mode", "Deploy mode")
+					}), /* @__PURE__ */ d("div", {
+						className: "flex gap-2",
+						children: [/* @__PURE__ */ d("button", {
+							type: "button",
+							onClick: () => T("ssh"),
+							className: `flex-1 inline-flex items-center justify-center gap-2 px-3 py-2 text-sm rounded-md border transition-colors ${w === "ssh" ? "border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+							children: [/* @__PURE__ */ u(ne, { size: 14 }), S("mesh.deploy.modeSsh", "Remote (SSH)")]
+						}), /* @__PURE__ */ d("button", {
+							type: "button",
+							onClick: () => T("same"),
+							className: `flex-1 inline-flex items-center justify-center gap-2 px-3 py-2 text-sm rounded-md border transition-colors ${w === "same" ? "border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+							children: [/* @__PURE__ */ u(te, { size: 14 }), S("mesh.deploy.modeSame", "Same machine")]
+						})]
+					})] }),
+					w === "ssh" && /* @__PURE__ */ d("div", {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ d("div", {
+								className: "grid grid-cols-3 gap-2",
+								children: [/* @__PURE__ */ d("div", {
+									className: "col-span-2",
+									children: [/* @__PURE__ */ u("label", {
+										className: g,
+										htmlFor: "mesh-host",
+										children: S("mesh.deploy.host", "Host / alias")
+									}), /* @__PURE__ */ u("input", {
+										id: "mesh-host",
+										type: "text",
+										value: E,
+										onChange: (e) => D(e.target.value),
+										placeholder: "prod-web-01 or 10.0.0.5",
+										className: `${h} font-mono`
+									})]
+								}), /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+									className: g,
+									htmlFor: "mesh-port",
+									children: S("mesh.deploy.port", "Port")
+								}), /* @__PURE__ */ u("input", {
+									id: "mesh-port",
+									type: "number",
+									value: O,
+									onChange: (e) => k(Number(e.target.value) || 22),
+									className: h
+								})] })]
+							}),
+							/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+								className: g,
+								htmlFor: "mesh-user",
+								children: S("mesh.deploy.user", "User")
+							}), /* @__PURE__ */ u("input", {
+								id: "mesh-user",
+								type: "text",
+								value: A,
+								onChange: (e) => j(e.target.value),
+								placeholder: "root",
+								className: `${h} font-mono`
+							})] }),
+							/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("span", {
+								className: g,
+								children: S("mesh.deploy.auth", "Authentication")
+							}), /* @__PURE__ */ d("div", {
+								className: "flex gap-4",
+								children: [/* @__PURE__ */ d("label", {
+									className: "inline-flex items-center gap-2 text-sm text-text-primary cursor-pointer",
+									children: [/* @__PURE__ */ u("input", {
+										type: "radio",
+										name: "mesh-auth",
+										checked: M === "agent",
+										onChange: () => N("agent")
+									}), S("mesh.deploy.authAgent", "SSH agent / default key")]
+								}), /* @__PURE__ */ d("label", {
+									className: "inline-flex items-center gap-2 text-sm text-text-primary cursor-pointer",
+									children: [/* @__PURE__ */ u("input", {
+										type: "radio",
+										name: "mesh-auth",
+										checked: M === "key",
+										onChange: () => N("key")
+									}), S("mesh.deploy.authKey", "Key path")]
+								})]
+							})] }),
+							M === "key" && /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+								className: g,
+								htmlFor: "mesh-key",
+								children: S("mesh.deploy.keyPath", "Identity file (key path)")
+							}), /* @__PURE__ */ u("input", {
+								id: "mesh-key",
+								type: "text",
+								value: P,
+								onChange: (e) => F(e.target.value),
+								placeholder: "~/.ssh/id_ed25519",
+								className: `${h} font-mono`
+							})] })
+						]
+					}),
+					/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+						className: g,
+						htmlFor: "mesh-label",
+						children: S("mesh.deploy.label", "Label (optional)")
+					}), /* @__PURE__ */ u("input", {
+						id: "mesh-label",
+						type: "text",
+						value: I,
+						onChange: (e) => L(e.target.value),
+						placeholder: S("mesh.deploy.labelPlaceholder", "e.g. Production web tier"),
+						className: h
+					})] }),
+					y && y.length > 0 && /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("span", {
+						className: g,
+						children: S("mesh.deploy.permissions", "Grant permissions on the new link")
+					}), /* @__PURE__ */ u("div", {
+						className: "flex flex-wrap gap-2",
+						children: y.map((e) => /* @__PURE__ */ u("button", {
+							type: "button",
+							onClick: () => ae(e),
+							className: `px-3 py-1.5 text-xs font-medium rounded-lg border transition-colors ${B.has(e) ? "border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg" : "border-border-default text-text-secondary hover:bg-bg-sunken"}`,
+							children: e
+						}, e))
+					})] }),
+					/* @__PURE__ */ d("label", {
+						className: "flex items-center gap-2 text-sm text-text-primary cursor-pointer",
+						children: [/* @__PURE__ */ u("input", {
+							type: "checkbox",
+							checked: R,
+							onChange: (e) => z(e.target.checked)
+						}), S("mesh.deploy.connectExisting", "Connect to an existing agent on the target instead of installing")]
+					}),
+					K && /* @__PURE__ */ u("div", {
+						className: "rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text",
+						children: K
+					}),
+					/* @__PURE__ */ d("div", {
+						className: "flex justify-end gap-2 pt-2 border-t border-border-default",
+						children: [/* @__PURE__ */ u("button", {
+							type: "button",
+							onClick: b,
+							className: "px-4 py-2 text-sm rounded-lg border border-border-default hover:bg-bg-sunken text-text-primary",
+							children: S("common.cancel", "Cancel")
+						}), /* @__PURE__ */ d("button", {
+							type: "button",
+							onClick: () => void oe(),
+							disabled: !Z || Y,
+							className: "inline-flex items-center gap-2 px-4 py-2 text-sm bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg-hover disabled:opacity-50",
+							children: [Y ? /* @__PURE__ */ u(c, { className: "size-4 animate-spin" }) : null, S("mesh.deploy.submit", "Deploy")]
+						})]
+					})
+				]
+			})]
+		})]
+	});
+}
+//#endregion
+export { _ as MeshDeployWizard };
+
+//# sourceMappingURL=MeshDeployWizard.js.map

package/dist/components/graph/MeshDeployWizard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MeshDeployWizard.js","names":[],"sources":["../../../src/components/graph/MeshDeployWizard.tsx"],"sourcesContent":["/**\n * MeshDeployWizard — deploy a new agent THROUGH the mesh from a chosen source\n * (root) agent. Supports two modes:\n *   - \"Remote (SSH)\": deploy onto another machine over SSH (host/user/port/key).\n *   - \"Same machine\": deploy a sibling agent on the source agent's own host.\n *\n * Submitting calls `deployAgentViaMesh({ rootAgentId, input })`, reads the\n * `{ jobId }` out of the AgentProxyResponse, then polls\n * `meshDeployJobStatus(rootAgentId, jobId)` on a 2s interval, rendering the\n * job's step list in a progress panel. On completion it calls `onCompleted`\n * so the caller can refetch the mesh graph.\n */\n\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { X, Loader2, CheckCircle, XCircle, Check, Server, Laptop } from 'lucide-react';\nimport { useTr } from '../../shared/hooks/useTr';\nimport {\n  useDeployAgentViaMeshMutation,\n  useMeshDeployJobStatusLazyQuery,\n} from '@/generated/wspace-operations';\n\n// Step labels for the mesh-deploy job. Extends the install-job labels with the\n// mesh-specific bootstrap/onboard/peer-probe steps.\nconst stepLabels: Record<string, string> = {\n  probe: 'Probing target',\n  'install-bun': 'Installing Bun runtime',\n  'install-agent': 'Installing VibeControls Agent',\n  autostart: 'Configuring autostart',\n  plugins: 'Installing plugins',\n  start: 'Starting agent',\n  bootstrap: 'Bootstrapping tunnel',\n  onboard: 'Onboarding agent',\n  'store-creds': 'Storing credentials',\n  'report-link': 'Linking into mesh',\n  'probe-peer': 'Probing new peer',\n};\n\ninterface DeployJobStep {\n  step: string;\n  status: string;\n  message?: string;\n}\n\ninterface DeployJob {\n  status: 'running' | 'completed' | 'failed' | string;\n  steps: DeployJobStep[];\n  error?: string;\n}\n\ninterface SourceAgentOption {\n  id: string;\n  name: string;\n  hostname: string;\n  isActive: boolean;\n}\n\ninterface MeshDeployWizardProps {\n  /** Agents that can act as the deploying root. */\n  sourceAgents: SourceAgentOption[];\n  /** Pre-seeded source (root) agent id (e.g. \"deploy from here\" on a node). */\n  initialSourceAgentId?: string | null;\n  availablePermissions?: string[];\n  onClose: () => void;\n  onCompleted: () => void;\n}\n\ntype DeployMode = 'ssh' | 'same';\ntype AuthMethod = 'agent' | 'key';\n\nfunction asRecord(v: unknown): Record<string, unknown> | null {\n  return v && typeof v === 'object' && !Array.isArray(v) ? (v as Record<string, unknown>) : null;\n}\nfunction jstr(obj: Record<string, unknown> | null, key: string): string | null {\n  const v = obj?.[key];\n  return typeof v === 'string' ? v : null;\n}\n\nconst INPUT_CLASS =\n  'px-3 py-2 text-sm rounded-md bg-bg-sunken border border-border-default text-text-primary focus:outline-none focus:ring-2 focus:ring-action-primary-bg/40 w-full';\nconst LABEL_CLASS = 'text-xs font-medium text-text-secondary mb-1 block';\n\nexport function MeshDeployWizard({\n  sourceAgents,\n  initialSourceAgentId,\n  availablePermissions,\n  onClose,\n  onCompleted,\n}: MeshDeployWizardProps) {\n  const tr = useTr();\n\n  const [sourceAgentId, setSourceAgentId] = useState<string>(\n    initialSourceAgentId ?? sourceAgents[0]?.id ?? ''\n  );\n  const [mode, setMode] = useState<DeployMode>('ssh');\n  const [host, setHost] = useState('');\n  const [port, setPort] = useState(22);\n  const [user, setUser] = useState('');\n  const [authMethod, setAuthMethod] = useState<AuthMethod>('agent');\n  const [keyPath, setKeyPath] = useState('');\n  const [label, setLabel] = useState('');\n  const [connectExisting, setConnectExisting] = useState(false);\n  const [permissions, setPermissions] = useState<Set<string>>(new Set());\n\n  const [jobId, setJobId] = useState<string | null>(null);\n  const [job, setJob] = useState<DeployJob | null>(null);\n  const [submitError, setSubmitError] = useState<string | null>(null);\n\n  const [deploy, { loading: deploying }] = useDeployAgentViaMeshMutation();\n  const [fetchJobStatus] = useMeshDeployJobStatusLazyQuery({ fetchPolicy: 'network-only' });\n\n  const canSubmit = useMemo(() => {\n    if (!sourceAgentId) return false;\n    if (mode === 'ssh') {\n      const targetSpec = host.trim();\n      return targetSpec.length > 0 && user.trim().length > 0;\n    }\n    return true;\n  }, [sourceAgentId, mode, host, user]);\n\n  const togglePermission = useCallback((p: string) => {\n    setPermissions((prev) => {\n      const next = new Set(prev);\n      if (next.has(p)) next.delete(p);\n      else next.add(p);\n      return next;\n    });\n  }, []);\n\n  // Build the SSH `target` string the backend expects (user@host:port).\n  const buildTargetString = useCallback((): string => {\n    if (mode === 'same') return 'localhost';\n    const trimmedHost = host.trim();\n    const trimmedUser = user.trim();\n    const base = trimmedUser ? `${trimmedUser}@${trimmedHost}` : trimmedHost;\n    return port && port !== 22 ? `${base}:${port}` : base;\n  }, [mode, host, user, port]);\n\n  const handleSubmit = useCallback(async () => {\n    if (!canSubmit) return;\n    setSubmitError(null);\n    setJob(null);\n    setJobId(null);\n    try {\n      const res = await deploy({\n        variables: {\n          rootAgentId: sourceAgentId,\n          input: {\n            target: buildTargetString(),\n            permissions: permissions.size > 0 ? Array.from(permissions) : undefined,\n            identityFile: mode === 'ssh' && authMethod === 'key' ? keyPath || undefined : undefined,\n            label: label || undefined,\n            connectExisting,\n          },\n        },\n      });\n      const proxy = res.data?.deployAgentViaMesh;\n      if (res.error || proxy?.error || proxy?.ok === false) {\n        setSubmitError(\n          proxy?.error ?? res.error?.message ?? tr('mesh.deploy.failed', 'Deploy failed')\n        );\n        return;\n      }\n      const data = asRecord(proxy?.data);\n      const newJobId = jstr(data, 'jobId');\n      if (!newJobId) {\n        setSubmitError(\n          tr('mesh.deploy.noJob', 'Deploy started but no job id was returned by the agent.')\n        );\n        return;\n      }\n      setJobId(newJobId);\n      setJob({ status: jstr(data, 'status') ?? 'running', steps: [] });\n    } catch (err) {\n      setSubmitError(err instanceof Error ? err.message : String(err));\n    }\n  }, [\n    canSubmit,\n    deploy,\n    sourceAgentId,\n    buildTargetString,\n    permissions,\n    mode,\n    authMethod,\n    keyPath,\n    label,\n    connectExisting,\n    tr,\n  ]);\n\n  // Poll the mesh-deploy job once a jobId is established.\n  useEffect(() => {\n    if (!jobId || !sourceAgentId) return;\n    let cancelled = false;\n\n    const poll = () => {\n      void fetchJobStatus({ variables: { rootAgentId: sourceAgentId, jobId } })\n        .then((result) => {\n          if (cancelled) return;\n          const proxy = result.data?.meshDeployJobStatus;\n          const data = asRecord(proxy?.data);\n          if (!data) return;\n          const rawSteps = Array.isArray(data.steps) ? (data.steps as DeployJobStep[]) : [];\n          setJob({\n            status: jstr(data, 'status') ?? 'running',\n            steps: rawSteps,\n            error: jstr(data, 'error') ?? proxy?.error ?? undefined,\n          });\n          const status = jstr(data, 'status');\n          if (status === 'completed') {\n            onCompleted();\n          }\n        })\n        .catch(() => {\n          // transient — retry on next interval\n        });\n    };\n\n    poll();\n    const interval = setInterval(poll, 2000);\n    return () => {\n      cancelled = true;\n      clearInterval(interval);\n    };\n  }, [jobId, sourceAgentId, fetchJobStatus, onCompleted]);\n\n  const jobRunning =\n    job?.status === 'running' ||\n    (jobId !== null && job?.status !== 'completed' && job?.status !== 'failed');\n\n  return (\n    <div className=\"fixed inset-0 z-50 flex items-center justify-center\">\n      <div\n        role=\"button\"\n        tabIndex={0}\n        aria-label={tr('mesh.deploy.close', 'Close')}\n        className=\"fixed inset-0 bg-bg-overlay backdrop-blur-sm\"\n        onClick={!jobRunning ? onClose : undefined}\n        onKeyDown={(e) => {\n          if (!jobRunning && (e.key === 'Escape' || e.key === 'Enter')) onClose();\n        }}\n      />\n      <div className=\"relative bg-bg-surface rounded-xl shadow-2xl border border-border-default max-w-lg w-full mx-4 p-6 max-h-[90vh] overflow-auto\">\n        <div className=\"flex items-center justify-between mb-4\">\n          <h2 className=\"text-lg font-semibold text-text-primary\">\n            {tr('mesh.deploy.title', 'Deploy Agent via Mesh')}\n          </h2>\n          {!jobRunning && (\n            <button\n              type=\"button\"\n              onClick={onClose}\n              className=\"p-1 rounded-lg hover:bg-bg-sunken\"\n              aria-label={tr('mesh.deploy.close', 'Close')}\n            >\n              <X size={18} />\n            </button>\n          )}\n        </div>\n\n        {/* Job progress takes over once a job is running */}\n        {jobId ? (\n          <div className=\"space-y-3\">\n            <p className=\"text-sm text-text-secondary\">\n              {tr('mesh.deploy.deploying', 'Deploying through {{agent}}…', {\n                agent: sourceAgents.find((a) => a.id === sourceAgentId)?.name ?? 'agent',\n              })}\n            </p>\n            <div className=\"space-y-2\">\n              {job && job.steps.length > 0 ? (\n                job.steps.map((step, idx) => (\n                  <div key={`${step.step}-${idx}`} className=\"flex items-center gap-3\">\n                    {step.status === 'running' && (\n                      <Loader2 className=\"animate-spin text-action-primary-bg\" size={16} />\n                    )}\n                    {step.status === 'completed' && (\n                      <CheckCircle className=\"text-status-success-text\" size={16} />\n                    )}\n                    {step.status === 'failed' && (\n                      <XCircle className=\"text-status-error-text\" size={16} />\n                    )}\n                    {step.status === 'skipped' && (\n                      <Check className=\"text-text-tertiary\" size={16} />\n                    )}\n                    {step.status === 'pending' && (\n                      <div className=\"size-4 rounded-full border-2 border-border-default\" />\n                    )}\n                    <div>\n                      <div className=\"text-sm font-medium text-text-primary\">\n                        {tr(`mesh.deploy.step.${step.step}`, stepLabels[step.step] ?? step.step)}\n                      </div>\n                      {step.message ? (\n                        <div className=\"text-xs text-text-tertiary\">{step.message}</div>\n                      ) : null}\n                    </div>\n                  </div>\n                ))\n              ) : (\n                <div className=\"flex items-center gap-3\">\n                  <Loader2 className=\"animate-spin text-action-primary-bg\" size={16} />\n                  <span className=\"text-sm text-text-secondary\">\n                    {tr('mesh.deploy.starting', 'Starting deploy job…')}\n                  </span>\n                </div>\n              )}\n            </div>\n\n            {job?.status === 'completed' && (\n              <div className=\"rounded-lg border border-status-success-border bg-status-success-bg-subtle p-3 text-sm text-status-success-text\">\n                {tr('mesh.deploy.success', 'Agent deployed successfully!')}\n              </div>\n            )}\n            {job?.status === 'failed' && (\n              <div className=\"rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text\">\n                {job.error ?? tr('mesh.deploy.jobFailed', 'Deploy failed.')}\n              </div>\n            )}\n\n            <button\n              type=\"button\"\n              onClick={onClose}\n              disabled={jobRunning}\n              className=\"w-full px-4 py-2 rounded-md border border-border-default hover:bg-bg-sunken transition-colors disabled:opacity-50 disabled:cursor-not-allowed text-sm font-medium text-text-primary\"\n            >\n              {jobRunning\n                ? tr('mesh.deploy.deployingShort', 'Deploying…')\n                : tr('common.close', 'Close')}\n            </button>\n          </div>\n        ) : (\n          <div className=\"space-y-4\">\n            {/* Source agent */}\n            <div>\n              <label className={LABEL_CLASS} htmlFor=\"mesh-source-agent\">\n                {tr('mesh.deploy.sourceAgent', 'Source agent (deploys from)')}\n              </label>\n              <select\n                id=\"mesh-source-agent\"\n                value={sourceAgentId}\n                onChange={(e) => setSourceAgentId(e.target.value)}\n                className={INPUT_CLASS}\n              >\n                {sourceAgents.length === 0 && (\n                  <option value=\"\">{tr('mesh.deploy.noAgents', 'No agents available')}</option>\n                )}\n                {sourceAgents.map((a) => (\n                  <option key={a.id} value={a.id}>\n                    {a.name} ({a.hostname}){a.isActive ? '' : ' · offline'}\n                  </option>\n                ))}\n              </select>\n            </div>\n\n            {/* Mode toggle */}\n            <div>\n              <span className={LABEL_CLASS}>{tr('mesh.deploy.mode', 'Deploy mode')}</span>\n              <div className=\"flex gap-2\">\n                <button\n                  type=\"button\"\n                  onClick={() => setMode('ssh')}\n                  className={`flex-1 inline-flex items-center justify-center gap-2 px-3 py-2 text-sm rounded-md border transition-colors ${\n                    mode === 'ssh'\n                      ? 'border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg'\n                      : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n                  }`}\n                >\n                  <Server size={14} />\n                  {tr('mesh.deploy.modeSsh', 'Remote (SSH)')}\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setMode('same')}\n                  className={`flex-1 inline-flex items-center justify-center gap-2 px-3 py-2 text-sm rounded-md border transition-colors ${\n                    mode === 'same'\n                      ? 'border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg'\n                      : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n                  }`}\n                >\n                  <Laptop size={14} />\n                  {tr('mesh.deploy.modeSame', 'Same machine')}\n                </button>\n              </div>\n            </div>\n\n            {/* SSH fields */}\n            {mode === 'ssh' && (\n              <div className=\"space-y-3\">\n                <div className=\"grid grid-cols-3 gap-2\">\n                  <div className=\"col-span-2\">\n                    <label className={LABEL_CLASS} htmlFor=\"mesh-host\">\n                      {tr('mesh.deploy.host', 'Host / alias')}\n                    </label>\n                    <input\n                      id=\"mesh-host\"\n                      type=\"text\"\n                      value={host}\n                      onChange={(e) => setHost(e.target.value)}\n                      placeholder=\"prod-web-01 or 10.0.0.5\"\n                      className={`${INPUT_CLASS} font-mono`}\n                    />\n                  </div>\n                  <div>\n                    <label className={LABEL_CLASS} htmlFor=\"mesh-port\">\n                      {tr('mesh.deploy.port', 'Port')}\n                    </label>\n                    <input\n                      id=\"mesh-port\"\n                      type=\"number\"\n                      value={port}\n                      onChange={(e) => setPort(Number(e.target.value) || 22)}\n                      className={INPUT_CLASS}\n                    />\n                  </div>\n                </div>\n                <div>\n                  <label className={LABEL_CLASS} htmlFor=\"mesh-user\">\n                    {tr('mesh.deploy.user', 'User')}\n                  </label>\n                  <input\n                    id=\"mesh-user\"\n                    type=\"text\"\n                    value={user}\n                    onChange={(e) => setUser(e.target.value)}\n                    placeholder=\"root\"\n                    className={`${INPUT_CLASS} font-mono`}\n                  />\n                </div>\n                <div>\n                  <span className={LABEL_CLASS}>{tr('mesh.deploy.auth', 'Authentication')}</span>\n                  <div className=\"flex gap-4\">\n                    <label className=\"inline-flex items-center gap-2 text-sm text-text-primary cursor-pointer\">\n                      <input\n                        type=\"radio\"\n                        name=\"mesh-auth\"\n                        checked={authMethod === 'agent'}\n                        onChange={() => setAuthMethod('agent')}\n                      />\n                      {tr('mesh.deploy.authAgent', 'SSH agent / default key')}\n                    </label>\n                    <label className=\"inline-flex items-center gap-2 text-sm text-text-primary cursor-pointer\">\n                      <input\n                        type=\"radio\"\n                        name=\"mesh-auth\"\n                        checked={authMethod === 'key'}\n                        onChange={() => setAuthMethod('key')}\n                      />\n                      {tr('mesh.deploy.authKey', 'Key path')}\n                    </label>\n                  </div>\n                </div>\n                {authMethod === 'key' && (\n                  <div>\n                    <label className={LABEL_CLASS} htmlFor=\"mesh-key\">\n                      {tr('mesh.deploy.keyPath', 'Identity file (key path)')}\n                    </label>\n                    <input\n                      id=\"mesh-key\"\n                      type=\"text\"\n                      value={keyPath}\n                      onChange={(e) => setKeyPath(e.target.value)}\n                      placeholder=\"~/.ssh/id_ed25519\"\n                      className={`${INPUT_CLASS} font-mono`}\n                    />\n                  </div>\n                )}\n              </div>\n            )}\n\n            {/* Label */}\n            <div>\n              <label className={LABEL_CLASS} htmlFor=\"mesh-label\">\n                {tr('mesh.deploy.label', 'Label (optional)')}\n              </label>\n              <input\n                id=\"mesh-label\"\n                type=\"text\"\n                value={label}\n                onChange={(e) => setLabel(e.target.value)}\n                placeholder={tr('mesh.deploy.labelPlaceholder', 'e.g. Production web tier')}\n                className={INPUT_CLASS}\n              />\n            </div>\n\n            {/* Permission chips */}\n            {availablePermissions && availablePermissions.length > 0 && (\n              <div>\n                <span className={LABEL_CLASS}>\n                  {tr('mesh.deploy.permissions', 'Grant permissions on the new link')}\n                </span>\n                <div className=\"flex flex-wrap gap-2\">\n                  {availablePermissions.map((p) => (\n                    <button\n                      type=\"button\"\n                      key={p}\n                      onClick={() => togglePermission(p)}\n                      className={`px-3 py-1.5 text-xs font-medium rounded-lg border transition-colors ${\n                        permissions.has(p)\n                          ? 'border-action-primary-bg bg-action-primary-bg/10 text-action-primary-bg'\n                          : 'border-border-default text-text-secondary hover:bg-bg-sunken'\n                      }`}\n                    >\n                      {p}\n                    </button>\n                  ))}\n                </div>\n              </div>\n            )}\n\n            <label className=\"flex items-center gap-2 text-sm text-text-primary cursor-pointer\">\n              <input\n                type=\"checkbox\"\n                checked={connectExisting}\n                onChange={(e) => setConnectExisting(e.target.checked)}\n              />\n              {tr(\n                'mesh.deploy.connectExisting',\n                'Connect to an existing agent on the target instead of installing'\n              )}\n            </label>\n\n            {submitError && (\n              <div className=\"rounded-lg border border-status-error-border bg-status-error-bg-subtle p-3 text-sm text-status-error-text\">\n                {submitError}\n              </div>\n            )}\n\n            <div className=\"flex justify-end gap-2 pt-2 border-t border-border-default\">\n              <button\n                type=\"button\"\n                onClick={onClose}\n                className=\"px-4 py-2 text-sm rounded-lg border border-border-default hover:bg-bg-sunken text-text-primary\"\n              >\n                {tr('common.cancel', 'Cancel')}\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => void handleSubmit()}\n                disabled={!canSubmit || deploying}\n                className=\"inline-flex items-center gap-2 px-4 py-2 text-sm bg-action-primary-bg text-action-primary-text rounded-lg hover:bg-action-primary-bg-hover disabled:opacity-50\"\n              >\n                {deploying ? <Loader2 className=\"size-4 animate-spin\" /> : null}\n                {tr('mesh.deploy.submit', 'Deploy')}\n              </button>\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/graph/MeshGraphView.js

@@ -0,0 +1,190 @@
+import { __toESM as e } from "../../_virtual/_rolldown/runtime.js";
+import { useTr as t } from "../../shared/hooks/useTr.js";
+import { require_dagre as n } from "../../node_modules/dagre/index.js";
+import { MeshAgentNode as r } from "./MeshAgentNode.js";
+import { ConnectionPermissionsDialog as i } from "./ConnectionPermissionsDialog.js";
+import { isMeshLinkLive as a, isSharedAgent as o } from "./meshTypes.js";
+import { useCallback as s, useEffect as c, useMemo as l, useState as u } from "react";
+import { CheckCircle as d } from "lucide-react";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { Background as h, BackgroundVariant as g, Controls as _, MarkerType as v, MiniMap as y, ReactFlow as b, useEdgesState as x, useNodesState as S } from "@xyflow/react";
+import "@xyflow/react/dist/style.css";
+//#region src/components/graph/MeshGraphView.tsx
+var C = /* @__PURE__ */ e(n(), 1), w = 200, T = 72, E = { meshAgentNode: r };
+function D(e, t, n) {
+	let r = new C.default.graphlib.Graph();
+	r.setGraph({
+		rankdir: "LR",
+		nodesep: 40,
+		ranksep: 90,
+		marginx: 16,
+		marginy: 16
+	}), r.setDefaultEdgeLabel(() => ({})), e.forEach((e) => {
+		r.setNode(`agent-${e.id}`, {
+			width: w,
+			height: T
+		});
+	});
+	let i = t.filter((t) => e.some((e) => e.id === t.sourceAgent.id) && e.some((e) => e.id === t.destinationAgent.id));
+	return i.forEach((e) => {
+		r.setEdge(`agent-${e.sourceAgent.id}`, `agent-${e.destinationAgent.id}`);
+	}), C.default.layout(r), {
+		nodes: e.map((e) => {
+			let t = r.node(`agent-${e.id}`), i = {
+				name: e.name,
+				version: e.version,
+				isActive: e.isActive,
+				isShared: o(e.ownerUserId),
+				hostType: e.target?.type ?? null,
+				hostLabel: e.target?.host ?? e.hostname,
+				onActivate: n ? () => n(e.id) : void 0
+			};
+			return {
+				id: `agent-${e.id}`,
+				type: "meshAgentNode",
+				position: {
+					x: (t?.x ?? 0) - w / 2,
+					y: (t?.y ?? 0) - T / 2
+				},
+				data: i,
+				className: n ? "cursor-pointer" : void 0
+			};
+		}),
+		edges: i.map((e) => {
+			let t = a(e.status);
+			return {
+				id: `mesh-${e.id}`,
+				source: `agent-${e.sourceAgent.id}`,
+				target: `agent-${e.destinationAgent.id}`,
+				label: e.label ?? void 0,
+				data: e,
+				type: "default",
+				animated: t,
+				markerEnd: { type: v.ArrowClosed },
+				style: {
+					stroke: t ? "var(--color-status-success-border)" : "var(--color-border-strong)",
+					strokeWidth: 2
+				},
+				labelStyle: {
+					fontSize: 10,
+					fontWeight: 600
+				},
+				labelBgStyle: { fill: "transparent" },
+				labelBgPadding: [4, 2]
+			};
+		})
+	};
+}
+function O({ agents: e, meshLinks: n, onUpdatePermissions: r, availablePermissions: a, availableScopes: o, onNodeClick: v, fullHeight: C }) {
+	let w = t(), { nodes: T, edges: O } = l(() => D(e, n, v), [
+		e,
+		n,
+		v
+	]), [k, A, j] = S(T), [M, N, P] = x(O), [F, I] = u(null), [L, R] = u(!1);
+	c(() => {
+		let { nodes: t, edges: r } = D(e, n, v);
+		A(t), N(r);
+	}, [
+		e,
+		n,
+		v,
+		A,
+		N
+	]);
+	let z = s((e, t) => {
+		if (!v) return;
+		let n = t.id.replace(/^agent-/, "");
+		n && v(n);
+	}, [v]), B = s((e, t) => {
+		let r = n.find((e) => `mesh-${e.id}` === t.id);
+		r && I(r);
+	}, [n]), V = s((e, t) => {
+		F && r && r(F.id, e, t), I(null), R(!0), setTimeout(() => R(!1), 3e3);
+	}, [F, r]);
+	return /* @__PURE__ */ m(f, { children: [
+		/* @__PURE__ */ p("div", {
+			className: "w-full rounded-lg border border-border-default overflow-hidden bg-bg-secondary",
+			style: { height: C ? "100%" : "500px" },
+			children: /* @__PURE__ */ m(b, {
+				nodes: k,
+				edges: M,
+				nodesDraggable: !1,
+				onNodesChange: j,
+				onEdgesChange: P,
+				onNodeClick: z,
+				onEdgeClick: B,
+				nodeTypes: E,
+				fitView: !0,
+				fitViewOptions: { padding: .2 },
+				minZoom: .2,
+				maxZoom: 2,
+				panOnDrag: !0,
+				proOptions: { hideAttribution: !0 },
+				children: [
+					/* @__PURE__ */ p(h, {
+						variant: g.Dots,
+						gap: 20,
+						size: 1,
+						className: "!fill-text-tertiary/10"
+					}),
+					/* @__PURE__ */ p(_, {
+						showInteractive: !1,
+						style: {
+							background: "var(--color-bg-primary)",
+							border: "1px solid var(--color-border-default)",
+							borderRadius: 8,
+							boxShadow: "0 1px 4px var(--color-border-default)"
+						},
+						className: "[&_button]:!bg-[var(--color-bg-primary)] [&_button]:!border-[var(--color-border-default)] [&_button]:!fill-[var(--color-text-secondary)] [&_button:hover]:!bg-[var(--color-bg-sunken)]"
+					}),
+					/* @__PURE__ */ p(y, {
+						zoomable: !0,
+						pannable: !0,
+						style: {
+							height: 80,
+							width: 120,
+							background: "var(--color-bg-primary)",
+							border: "1px solid var(--color-border-default)",
+							borderRadius: 8
+						},
+						maskColor: "var(--color-bg-default)"
+					})
+				]
+			})
+		}),
+		F && /* @__PURE__ */ p(i, {
+			connection: {
+				id: F.id,
+				protocol: F.status,
+				permissions: F.permissions,
+				scopes: F.scopes,
+				label: F.label,
+				description: F.description,
+				sourceAgent: F.sourceAgent,
+				target: {
+					id: F.destinationAgent.id,
+					name: F.destinationAgent.name
+				}
+			},
+			availablePermissions: a,
+			availableScopes: o,
+			onSave: V,
+			onClose: () => I(null)
+		}),
+		L && /* @__PURE__ */ m("div", {
+			"data-testid": "mesh-save-toast",
+			className: "fixed bottom-4 right-4 z-[200] flex items-center gap-2 bg-bg-elevated border border-border-default rounded-lg shadow-lg px-4 py-2.5 text-sm",
+			children: [/* @__PURE__ */ p(d, {
+				size: 16,
+				className: "text-status-success-text flex-shrink-0"
+			}), /* @__PURE__ */ p("span", {
+				className: "text-text-primary",
+				children: w("vibecontrols.mesh.permissionsSaved", "Permissions saved")
+			})]
+		})
+	] });
+}
+//#endregion
+export { O as MeshGraphView };
+
+//# sourceMappingURL=MeshGraphView.js.map