@burdenoff/microfe-vibecontrols 2026.601.12 → 2026.601.13

package/dist/pages/AgentGraphPage.js

@@ -1,183 +1,316 @@
-import { useAgentConnectionConfigQuery as e, useGetAgentGraphQuery as t, useListTargetsQuery as n, useUpdateConnectionPermissionsMutation as r } from "../generated/wspace-operations.js";
-import { useVibeControls as i, useVibeNavigate as a } from "../providers/VibeControlsProvider.js";
-import o from "../hooks/useCachedInitialData.js";
-import { PageHeader as s } from "../components/shared/PageHeader.js";
-import { LoadingState as c } from "../components/shared/LoadingState.js";
-import { ErrorState as l } from "../components/shared/ErrorState.js";
-import { EmptyState as u } from "../components/shared/EmptyState.js";
-import { GetHelpButton as d } from "../components/shared/GetHelpButton.js";
-import { SearchableSelect as f } from "../components/shared/SearchableSelect.js";
+import { useAgentConnectionConfigQuery as e, useGetAgentMeshGraphQuery as t, useStartMeshAgentSessionMutation as n, useUpdateMeshLinkPermissionsMutation as r } from "../generated/wspace-operations.js";
+import { useVibeControls as i, useVibeNavigate as ee } from "../providers/VibeControlsProvider.js";
+import te from "../hooks/useCachedInitialData.js";
+import { PageHeader as a } from "../components/shared/PageHeader.js";
+import { LoadingState as o } from "../components/shared/LoadingState.js";
+import { ErrorState as s } from "../components/shared/ErrorState.js";
+import { MeshSessionKind as ne } from "../generated/wspace-types.js";
+import { EmptyState as c } from "../components/shared/EmptyState.js";
+import { GetHelpButton as re } from "../components/shared/GetHelpButton.js";
+import { SearchableSelect as ie } from "../components/shared/SearchableSelect.js";
 import "../components/shared/index.js";
-import { VIBE_PERMISSIONS as ee } from "../constants/permissions.js";
-import { AgentGraphView as p } from "../components/graph/AgentGraphView.js";
-import { useCallback as m, useMemo as te, useState as h } from "react";
-import { useI18n as g } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { GitBranch as _, Loader2 as v, Network as y } from "lucide-react";
-import { usePermissions as b } from "@burdenoff/fe-libs/shared/providers/shell";
-import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
-import { MotionPage as w } from "@burdenoff/fe-libs/shared/motion";
+import { VIBE_PERMISSIONS as l } from "../constants/permissions.js";
+import { MeshGraphView as ae } from "../components/graph/MeshGraphView.js";
+import { MeshDeployWizard as oe } from "../components/graph/MeshDeployWizard.js";
+import { MeshRequestPanel as se } from "../components/graph/MeshRequestPanel.js";
+import { MeshNodeActions as u } from "../components/graph/MeshNodeActions.js";
+import { useCallback as d, useMemo as f, useState as p } from "react";
+import { useI18n as ce } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { CheckCircle as le, GitBranch as ue, Loader2 as m, Network as h, Rocket as de, Send as fe } from "lucide-react";
+import { usePermissions as pe } from "@burdenoff/fe-libs/shared/providers/shell";
+import { Fragment as me, jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { MotionPage as he } from "@burdenoff/fe-libs/shared/motion";
 //#region src/pages/AgentGraphPage.tsx
-function T() {
-	let { workspaceId: T } = i(), E = a(), { t: D } = g(), { hasPermission: O, isLoading: k, permissions: A } = b(), [j, M] = h(null), N = m((e, t, n) => {
-		let r = D(e, n), i = r === e ? t : r;
+function v() {
+	let { workspaceId: v, currentUser: ge } = i(), y = ee(), { t: b } = ce(), { hasPermission: _e, isLoading: ve, permissions: x } = pe(), [S, ye] = p(null), C = d((e, t, n) => {
+		let r = b(e, n), i = r === e ? t : r;
 		return n ? Object.entries(n).reduce((e, [t, n]) => e.replace(`{{${t}}}`, String(n)), i) : i;
-	}, [D]), { agents: P } = o(), { data: F } = n({
-		variables: { workspaceId: T ?? "" },
-		skip: !T,
-		fetchPolicy: "cache-and-network"
-	}), I = F?.targets?.items ?? [], L = te(() => {
-		let e = P.map((e) => ({
-			value: e.id,
-			label: N("agentGraph.scopeAgentPrefix", "Agent: {{name}}", { name: e.name })
-		}));
-		return [...I.map((e) => ({
-			value: `target:${e.id}`,
-			label: N("agentGraph.scopeTargetPrefix", "Target: {{name}}", { name: e.name })
-		})), ...e];
-	}, [
-		P,
-		I,
-		N
-	]), [R, z] = h(""), { data: B } = e({ skip: !T }), V = B?.agentConnectionConfig.permissions ?? [], H = B?.agentConnectionConfig.scopes ?? [], { data: U, previousData: W, loading: G, error: K, refetch: q } = t({
+	}, [b]), { agents: w } = te(), be = f(() => w.map((e) => ({
+		value: e.id,
+		label: C("agentGraph.scopeAgentPrefix", "Agent: {{name}}", { name: e.name })
+	})), [w, C]), [T, xe] = p(""), { data: E } = e({ skip: !v }), D = E?.agentConnectionConfig.permissions ?? [], O = E?.agentConnectionConfig.scopes ?? [], { data: k, previousData: A, loading: j, error: M, refetch: N } = t({
 		variables: {
-			workspaceId: T || "",
-			rootAgentId: j || void 0
+			workspaceId: v || "",
+			rootAgentId: S || void 0
 		},
-		skip: !T
-	}), J = U?.agentGraph ?? W?.agentGraph, Y = J?.targets ?? [], X = J?.connections ?? [], Z = G, ne = Z && !J, Q = Z && !!J, [$] = r(), re = m((e, t) => {
-		if (e === "target") {
-			E(`/agents?${new URLSearchParams({
-				tab: "targets",
-				selectedTargetId: t
-			}).toString()}`);
-			return;
+		skip: !v
+	}), P = k?.agentMeshGraph ?? A?.agentMeshGraph, F = f(() => (P?.agents ?? []).map((e) => ({
+		id: e.id,
+		name: e.name,
+		hostname: e.hostname,
+		platform: e.platform,
+		version: e.version,
+		isActive: e.isActive,
+		ownerUserId: e.ownerUserId ?? null,
+		targetId: e.targetId,
+		tunnelStatus: e.tunnelStatus ?? null,
+		target: e.target ? {
+			id: e.target.id,
+			name: e.target.name,
+			type: String(e.target.type),
+			host: e.target.host ?? null
+		} : null
+	})), [P]), I = f(() => (P?.meshLinks ?? []).map((e) => ({
+		id: e.id,
+		workspaceId: e.workspaceId,
+		status: e.status,
+		permissions: e.permissions,
+		scopes: e.scopes,
+		label: e.label ?? null,
+		description: e.description ?? null,
+		createdAt: e.createdAt,
+		updatedAt: e.updatedAt,
+		sourceAgent: {
+			id: e.sourceAgent.id,
+			name: e.sourceAgent.name
+		},
+		destinationAgent: {
+			id: e.destinationAgent.id,
+			name: e.destinationAgent.name,
+			hostname: e.destinationAgent.hostname,
+			target: e.destinationAgent.target ? {
+				id: e.destinationAgent.target.id,
+				name: e.destinationAgent.target.name,
+				type: String(e.destinationAgent.target.type),
+				host: e.destinationAgent.target.host ?? null
+			} : null
 		}
-		E(`/agents/${t}`);
-	}, [E]), ie = m(async (e, t, n) => {
-		await $({ variables: {
-			connectionId: e,
+	})), [P]), L = j, Se = L && !P, R = L && !!P, z = f(() => F.length > 0 ? F.map((e) => ({
+		id: e.id,
+		name: e.name,
+		hostname: e.hostname,
+		isActive: e.isActive
+	})) : w.map((e) => ({
+		id: e.id,
+		name: e.name,
+		hostname: e.hostname,
+		isActive: e.isActive
+	})), [F, w]), [B] = r(), [V] = n(), [Ce, H] = p(!1), [we, U] = p(null), [Te, W] = p(!1), [Ee, G] = p(null), [K, q] = p(null), [J, Y] = p(null), X = d((e) => {
+		Y(e), setTimeout(() => Y(null), 3500);
+	}, []), De = d(async (e, t, n) => {
+		await B({ variables: {
+			meshLinkId: e,
 			input: {
 				permissions: t,
 				scopes: n
 			}
-		} }), await q();
-	}, [q, $]);
-	return k ? /* @__PURE__ */ S("div", {
+		} }), await N();
+	}, [N, B]), Z = S ?? z[0]?.id ?? null, Oe = d(async (e) => {
+		if (q(null), Z && e === Z) {
+			y(`/agents/${e}?tab=terminal`);
+			return;
+		}
+		if (!Z) {
+			X(C("mesh.terminal.noRoot", "No reachable root agent to start a terminal from."));
+			return;
+		}
+		try {
+			await V({ variables: {
+				rootAgentId: Z,
+				destinationAgentId: e,
+				input: { kind: ne.Terminal }
+			} }), y(`/agents/${e}?tab=terminal`);
+		} catch {
+			X(C("mesh.terminal.comingSoon", "Deep-terminal coming soon"));
+		}
+	}, [
+		Z,
+		V,
+		y,
+		X,
+		C
+	]), ke = d((e) => {
+		q(null), G(e), W(!0);
+	}, []), Ae = d((e) => {
+		q(null), U(e), H(!0);
+	}, []), je = d((e) => {
+		q(null), y(`/agents/${e}`);
+	}, [y]), Me = d((e) => {
+		q(e);
+	}, []), Q = f(() => F.find((e) => e.id === K) ?? null, [F, K]);
+	if (ve) return /* @__PURE__ */ g("div", {
 		className: "flex items-center justify-center min-h-[400px]",
-		children: /* @__PURE__ */ S("p", {
+		children: /* @__PURE__ */ g("p", {
 			className: "text-text-secondary",
 			children: "Loading permissions…"
 		})
-	}) : A && (A.permissionStrings?.length ?? 0) > 0 && !O(ee.AGENT_READ) ? /* @__PURE__ */ S("div", {
+	});
+	if (x && (x.permissionStrings?.length ?? 0) > 0 && !_e(l.AGENT_READ)) return /* @__PURE__ */ g("div", {
 		className: "flex items-center justify-center min-h-[400px]",
-		children: /* @__PURE__ */ C("div", {
+		children: /* @__PURE__ */ _("div", {
 			className: "text-center space-y-2",
-			children: [/* @__PURE__ */ S("h2", {
+			children: [/* @__PURE__ */ g("h2", {
 				className: "text-lg font-semibold text-foreground",
 				children: "Access Denied"
-			}), /* @__PURE__ */ S("p", {
+			}), /* @__PURE__ */ g("p", {
 				className: "text-sm text-text-secondary",
 				children: "You don't have permission to access this page."
 			})]
 		})
-	}) : /* @__PURE__ */ C(w, { children: [
-		/* @__PURE__ */ S(s, {
-			title: N("nav.agentGraph", "Agent Graph"),
-			description: N("agentGraph.description", "Visualize and manage connections between targets and agents.")
+	});
+	let $ = F.length > 0;
+	return /* @__PURE__ */ _(he, { children: [
+		/* @__PURE__ */ _("div", {
+			className: "flex items-start justify-between gap-3",
+			children: [/* @__PURE__ */ g(a, {
+				title: C("nav.agentGraph", "Agent Mesh"),
+				description: C("agentGraph.meshDescription", "Visualize and manage the agent-to-agent mesh: deploy new agents, edit link permissions, and run requests across hops.")
+			}), /* @__PURE__ */ _("div", {
+				className: "flex items-center gap-2 pt-1",
+				children: [/* @__PURE__ */ _("button", {
+					type: "button",
+					onClick: () => {
+						W((e) => !e), G(null);
+					},
+					className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md border border-border-default text-text-primary hover:bg-bg-sunken transition-colors",
+					children: [/* @__PURE__ */ g(fe, { className: "size-4" }), C("mesh.requestPanelToggle", "Mesh request")]
+				}), /* @__PURE__ */ _("button", {
+					type: "button",
+					onClick: () => {
+						U(S), H(!0);
+					},
+					disabled: z.length === 0,
+					className: "inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50",
+					children: [/* @__PURE__ */ g(de, { className: "size-4" }), C("mesh.deployButton", "Deploy Agent")]
+				})]
+			})]
 		}),
-		ne && /* @__PURE__ */ S(c, { message: N("agentGraph.loading", "Loading agent graph...") }),
-		!Z && K && Y.length === 0 && /* @__PURE__ */ S(l, {
-			title: N("agentGraph.failedLoad", "Failed to load agent graph"),
-			message: K.message
+		Se && /* @__PURE__ */ g(o, { message: C("agentGraph.loading", "Loading agent mesh...") }),
+		!L && M && !$ && /* @__PURE__ */ g(s, {
+			title: C("agentGraph.failedLoad", "Failed to load agent mesh"),
+			message: M.message
 		}),
-		!Z && !K && Y.length === 0 && !R && /* @__PURE__ */ S(u, {
-			icon: /* @__PURE__ */ S(y, { className: "size-8 text-text-secondary" }),
-			title: N("agentGraph.noTargetsConnected", "No targets connected"),
-			description: N("agentGraph.noTargetsDescription", "Register an agent on a target to start visualizing your infrastructure topology."),
-			action: /* @__PURE__ */ S(d, { prompt: "What is the Agent Graph in VibeControls and what does it show?" })
+		!L && !M && !$ && !T && /* @__PURE__ */ g(c, {
+			icon: /* @__PURE__ */ g(h, { className: "size-8 text-text-secondary" }),
+			title: C("agentGraph.noAgentsConnected", "No agents in the mesh"),
+			description: C("agentGraph.noAgentsDescription", "Deploy an agent to start building your agent mesh topology."),
+			action: /* @__PURE__ */ g(re, { prompt: "What is the Agent Mesh in VibeControls and how do I deploy agents?" })
 		}),
-		(Y.length > 0 || R || Q) && /* @__PURE__ */ C(x, { children: [
-			/* @__PURE__ */ C("div", {
+		Te && /* @__PURE__ */ g("div", {
+			className: "mt-4",
+			children: /* @__PURE__ */ g(se, {
+				rootAgentId: Z,
+				destinations: F,
+				initialDestinationId: Ee,
+				onClose: () => W(!1)
+			})
+		}),
+		($ || T || R) && /* @__PURE__ */ _(me, { children: [
+			/* @__PURE__ */ _("div", {
 				className: "flex items-center gap-3 mt-4",
 				children: [
-					/* @__PURE__ */ C("div", {
+					/* @__PURE__ */ _("div", {
 						className: "flex items-center gap-2",
 						children: [
-							/* @__PURE__ */ S(_, {
+							/* @__PURE__ */ g(ue, {
 								size: 16,
 								className: "text-text-tertiary"
 							}),
-							/* @__PURE__ */ S("span", {
+							/* @__PURE__ */ g("span", {
 								className: "text-sm font-medium text-text-secondary",
-								children: N("agentGraph.countSummary", "{{targets}} targets, {{connections}} connections", {
-									targets: Y.length,
-									connections: X.length
+								children: C("agentGraph.meshCountSummary", "{{agents}} agents, {{links}} links", {
+									agents: F.length,
+									links: I.length
 								})
 							}),
-							Q && /* @__PURE__ */ C("span", {
+							R && /* @__PURE__ */ _("span", {
 								role: "status",
 								"aria-live": "polite",
 								className: "inline-flex items-center gap-1.5 rounded-full border border-border-default bg-bg-surface px-2.5 py-1 text-xs font-medium text-text-secondary",
-								children: [/* @__PURE__ */ S(v, { className: "size-3.5 animate-spin text-action-primary-bg" }), N("agentGraph.refreshing", "Refreshing graph...")]
+								children: [/* @__PURE__ */ g(m, { className: "size-3.5 animate-spin text-action-primary-bg" }), C("agentGraph.refreshing", "Refreshing graph...")]
 							})
 						]
 					}),
-					/* @__PURE__ */ S("div", { className: "flex-1" }),
-					/* @__PURE__ */ C("div", {
+					/* @__PURE__ */ g("div", { className: "flex-1" }),
+					/* @__PURE__ */ _("div", {
 						className: "flex items-center gap-2",
-						children: [/* @__PURE__ */ S("label", {
+						children: [/* @__PURE__ */ g("label", {
 							className: "text-xs font-medium text-text-secondary",
-							children: N("agentGraph.scopeLabel", "Scope:")
-						}), /* @__PURE__ */ S(f, {
-							value: R,
+							children: C("agentGraph.scopeLabel", "Scope:")
+						}), /* @__PURE__ */ g(ie, {
+							value: T,
 							onChange: (e) => {
-								z(e), e.startsWith("target:") ? M(null) : M(e || null);
+								xe(e), ye(e || null);
 							},
-							options: L,
-							placeholder: N("agentGraph.scopeAll", "All targets & agents"),
+							options: be,
+							placeholder: C("agentGraph.scopeAllAgents", "All agents"),
 							clearable: !0,
-							disabled: Z,
+							disabled: L,
 							dropdownAlign: "right"
 						})]
 					})
 				]
 			}),
-			!Z && K && /* @__PURE__ */ S(l, {
-				title: N("agentGraph.failedRefresh", "Failed to refresh agent graph"),
-				message: K.message
+			!L && M && /* @__PURE__ */ g(s, {
+				title: C("agentGraph.failedRefresh", "Failed to refresh agent mesh"),
+				message: M.message
 			}),
-			!Z && Y.length === 0 && R && /* @__PURE__ */ S(u, {
-				icon: /* @__PURE__ */ S(y, { className: "size-8 text-text-secondary" }),
-				title: N("agentGraph.noScopeResults", "No results for this scope"),
-				description: N("agentGraph.noScopeDescription", "No targets match the selected scope. Clear the filter to view all targets.")
+			!L && !$ && T && /* @__PURE__ */ g(c, {
+				icon: /* @__PURE__ */ g(h, { className: "size-8 text-text-secondary" }),
+				title: C("agentGraph.noScopeResults", "No results for this scope"),
+				description: C("agentGraph.noScopeAgentDescription", "No agents match the selected scope. Clear the filter to view the full mesh.")
 			}),
-			(Y.length > 0 || Q) && /* @__PURE__ */ C("div", {
+			($ || R) && /* @__PURE__ */ _("div", {
 				className: "mt-4 relative",
 				style: {
 					height: "calc(100vh - 280px)",
 					minHeight: "400px"
 				},
-				"aria-busy": Q,
-				children: [/* @__PURE__ */ S(p, {
-					targets: Y,
-					connections: X,
-					onUpdatePermissions: ie,
-					availablePermissions: V,
-					availableScopes: H,
-					onNodeClick: re,
-					fullHeight: !0
-				}), Q && /* @__PURE__ */ S("div", {
-					className: "absolute inset-0 z-10 flex items-center justify-center bg-bg-surface/60 backdrop-blur-[1px]",
-					children: /* @__PURE__ */ C("div", {
-						className: "inline-flex items-center gap-2 rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-secondary shadow-md",
-						children: [/* @__PURE__ */ S(v, { className: "size-4 animate-spin text-action-primary-bg" }), /* @__PURE__ */ S("span", { children: R ? N("agentGraph.loadingScope", "Applying selected scope...") : N("agentGraph.refreshing", "Refreshing graph...") })]
+				"aria-busy": R,
+				children: [
+					/* @__PURE__ */ g(ae, {
+						agents: F,
+						meshLinks: I,
+						currentUserId: ge?.id ?? null,
+						onUpdatePermissions: De,
+						availablePermissions: D,
+						availableScopes: O,
+						onNodeClick: Me,
+						fullHeight: !0
+					}),
+					Q && /* @__PURE__ */ g("div", {
+						className: "absolute right-4 top-4 z-20",
+						children: /* @__PURE__ */ g(u, {
+							agent: Q,
+							onRunCommand: ke,
+							onStartTerminal: (e) => void Oe(e),
+							onDeployFromHere: Ae,
+							onOpenAgent: je,
+							onClose: () => q(null)
+						})
+					}),
+					R && /* @__PURE__ */ g("div", {
+						className: "absolute inset-0 z-10 flex items-center justify-center bg-bg-surface/60 backdrop-blur-[1px]",
+						children: /* @__PURE__ */ _("div", {
+							className: "inline-flex items-center gap-2 rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-secondary shadow-md",
+							children: [/* @__PURE__ */ g(m, { className: "size-4 animate-spin text-action-primary-bg" }), /* @__PURE__ */ g("span", { children: T ? C("agentGraph.loadingScope", "Applying selected scope...") : C("agentGraph.refreshing", "Refreshing graph...") })]
+						})
 					})
-				})]
+				]
 			})
-		] })
+		] }),
+		Ce && /* @__PURE__ */ g(oe, {
+			sourceAgents: z,
+			initialSourceAgentId: we,
+			availablePermissions: D,
+			onClose: () => H(!1),
+			onCompleted: () => {
+				N();
+			}
+		}),
+		J && /* @__PURE__ */ _("div", {
+			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__ */ g(le, {
+				size: 16,
+				className: "text-status-success-text flex-shrink-0"
+			}), /* @__PURE__ */ g("span", {
+				className: "text-text-primary",
+				children: J
+			})]
+		})
 	] });
 }
 //#endregion
-export { T as AgentGraphPage };
+export { v as AgentGraphPage };
 
 //# sourceMappingURL=AgentGraphPage.js.map

package/dist/pages/AgentGraphPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AgentGraphPage.js","names":[],"sources":["../../src/pages/AgentGraphPage.tsx"],"sourcesContent":["/**\n * Agent Graph Page — Dedicated full-page view of the agent connection graph.\n *\n * Shows targets as group nodes with agents inside (sub-flows) and\n * connections as directed edges. Supports root-node scoping and\n * RBAC permission editing.\n */\n\nimport { useState, useMemo, useCallback } from 'react';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { VIBE_PERMISSIONS } from '../constants/permissions';\nimport { GitBranch, Loader2, Network } from 'lucide-react';\nimport {\n  PageHeader,\n  SearchableSelect,\n  LoadingState,\n  ErrorState,\n  EmptyState,\n  GetHelpButton,\n} from '@/components/shared';\nimport { MotionPage } from '@burdenoff/fe-libs/shared/motion';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useVibeControls, useVibeNavigate } from '@/providers/VibeControlsProvider';\nimport { useCachedInitialData } from '@/hooks/useCachedInitialData';\nimport {\n  useGetAgentGraphQuery,\n  useUpdateConnectionPermissionsMutation,\n  useAgentConnectionConfigQuery,\n  useListTargetsQuery,\n  type ListTargetsQuery,\n} from '@/generated/wspace-operations';\n\ntype TargetItem = NonNullable<ListTargetsQuery['targets']['items'][number]>;\nimport { AgentGraphView } from '@/components/graph/AgentGraphView';\n\nexport function AgentGraphPage() {\n  const { workspaceId } = useVibeControls();\n  const navigate = useVibeNavigate();\n  const { t } = useI18n();\n  const { hasPermission, isLoading: permissionsLoading, permissions } = usePermissions();\n  const [rootAgentId, setRootAgentId] = useState<string | null>(null);\n\n  const tr = useCallback(\n    (key: string, fallback: string, params?: Record<string, string | number>): string => {\n      const translated = t(key, params);\n      const template = translated === key ? fallback : translated;\n\n      if (!params) return template;\n\n      return Object.entries(params).reduce(\n        (acc, [paramKey, paramValue]) => acc.replace(`{{${paramKey}}}`, String(paramValue)),\n        template\n      );\n    },\n    [t]\n  );\n\n  // Use cached initial data for agents; fetch targets directly\n  const { agents: cachedAgents } = useCachedInitialData();\n  const { data: targetsData } = useListTargetsQuery({\n    variables: { workspaceId: workspaceId ?? '' },\n    skip: !workspaceId,\n    fetchPolicy: 'cache-and-network',\n  });\n  const cachedTargets = targetsData?.targets?.items ?? [];\n  const scopeOptions = useMemo(() => {\n    const agentOpts = cachedAgents.map((a) => ({\n      value: a.id,\n      label: tr('agentGraph.scopeAgentPrefix', 'Agent: {{name}}', { name: a.name }),\n    }));\n    const targetOpts = cachedTargets.map((tgt: TargetItem) => ({\n      value: `target:${tgt.id}`,\n      label: tr('agentGraph.scopeTargetPrefix', 'Target: {{name}}', { name: tgt.name }),\n    }));\n    return [...targetOpts, ...agentOpts];\n  }, [cachedAgents, cachedTargets, tr]);\n\n  const [scopeValue, setScopeValue] = useState<string>('');\n\n  const { data: connectionConfigData } = useAgentConnectionConfigQuery({\n    skip: !workspaceId,\n  });\n\n  const availablePermissions = connectionConfigData?.agentConnectionConfig.permissions ?? [];\n  const availableScopes = connectionConfigData?.agentConnectionConfig.scopes ?? [];\n\n  const {\n    data: graphData,\n    previousData,\n    loading,\n    error,\n    refetch,\n  } = useGetAgentGraphQuery({\n    variables: {\n      workspaceId: workspaceId || '',\n      rootAgentId: rootAgentId || undefined,\n    },\n    skip: !workspaceId,\n  });\n\n  const resolvedAgentGraph = graphData?.agentGraph ?? previousData?.agentGraph;\n  const graphTargets = resolvedAgentGraph?.targets ?? [];\n  const graphConnections = resolvedAgentGraph?.connections ?? [];\n  const isGraphLoading = loading;\n  // Covers first load (including first scoped load) when no prior graph snapshot exists.\n  const isInitialLoad = isGraphLoading && !resolvedAgentGraph;\n  const isRefreshingGraph = isGraphLoading && Boolean(resolvedAgentGraph);\n\n  const [updateConnectionPerms] = useUpdateConnectionPermissionsMutation();\n\n  const handleNodeNavigate = useCallback(\n    (nodeType: 'target' | 'agent', id: string) => {\n      if (nodeType === 'target') {\n        const targetParams = new URLSearchParams({\n          tab: 'targets',\n          selectedTargetId: id,\n        });\n        navigate(`/agents?${targetParams.toString()}`);\n        return;\n      }\n      navigate(`/agents/${id}`);\n    },\n    [navigate]\n  );\n\n  const handleUpdatePermissions = useCallback(\n    async (connectionId: string, permissions: string[], scopes: string[]) => {\n      await updateConnectionPerms({\n        variables: { connectionId, input: { permissions, scopes } },\n      });\n      await refetch();\n    },\n    [refetch, updateConnectionPerms]\n  );\n\n  if (permissionsLoading)\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <p className=\"text-text-secondary\">Loading permissions…</p>\n      </div>\n    );\n  if (\n    permissions &&\n    (permissions.permissionStrings?.length ?? 0) > 0 &&\n    !hasPermission(VIBE_PERMISSIONS.AGENT_READ)\n  )\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <h2 className=\"text-lg font-semibold text-foreground\">Access Denied</h2>\n          <p className=\"text-sm text-text-secondary\">\n            You don't have permission to access this page.\n          </p>\n        </div>\n      </div>\n    );\n\n  return (\n    <MotionPage>\n      <PageHeader\n        title={tr('nav.agentGraph', 'Agent Graph')}\n        description={tr(\n          'agentGraph.description',\n          'Visualize and manage connections between targets and agents.'\n        )}\n      />\n\n      {isInitialLoad && (\n        <LoadingState message={tr('agentGraph.loading', 'Loading agent graph...')} />\n      )}\n\n      {/* Non-fatal error: show banner but don't hide graph if data is available */}\n      {!isGraphLoading && error && graphTargets.length === 0 && (\n        <ErrorState\n          title={tr('agentGraph.failedLoad', 'Failed to load agent graph')}\n          message={error.message}\n        />\n      )}\n\n      {!isGraphLoading && !error && graphTargets.length === 0 && !scopeValue && (\n        <EmptyState\n          icon={<Network className=\"size-8 text-text-secondary\" />}\n          title={tr('agentGraph.noTargetsConnected', 'No targets connected')}\n          description={tr(\n            'agentGraph.noTargetsDescription',\n            'Register an agent on a target to start visualizing your infrastructure topology.'\n          )}\n          action={\n            <GetHelpButton prompt=\"What is the Agent Graph in VibeControls and what does it show?\" />\n          }\n        />\n      )}\n\n      {/* Scope controls + graph: shown whenever we have data, or when a scope filter is\n          active (so the user can always clear the filter and recover the full view) */}\n      {(graphTargets.length > 0 || scopeValue || isRefreshingGraph) && (\n        <>\n          {/* Filters — always rendered so user can clear an active scope filter */}\n          <div className=\"flex items-center gap-3 mt-4\">\n            <div className=\"flex items-center gap-2\">\n              <GitBranch size={16} className=\"text-text-tertiary\" />\n              <span className=\"text-sm font-medium text-text-secondary\">\n                {tr('agentGraph.countSummary', '{{targets}} targets, {{connections}} connections', {\n                  targets: graphTargets.length,\n                  connections: graphConnections.length,\n                })}\n              </span>\n\n              {isRefreshingGraph && (\n                <span\n                  role=\"status\"\n                  aria-live=\"polite\"\n                  className=\"inline-flex items-center gap-1.5 rounded-full border border-border-default bg-bg-surface px-2.5 py-1 text-xs font-medium text-text-secondary\"\n                >\n                  <Loader2 className=\"size-3.5 animate-spin text-action-primary-bg\" />\n                  {tr('agentGraph.refreshing', 'Refreshing graph...')}\n                </span>\n              )}\n            </div>\n            <div className=\"flex-1\" />\n            <div className=\"flex items-center gap-2\">\n              <label className=\"text-xs font-medium text-text-secondary\">\n                {tr('agentGraph.scopeLabel', 'Scope:')}\n              </label>\n              <SearchableSelect\n                value={scopeValue}\n                onChange={(v: string) => {\n                  setScopeValue(v);\n                  // If selecting a target, clear rootAgentId; if agent, set it\n                  if (v.startsWith('target:')) {\n                    setRootAgentId(null);\n                  } else {\n                    setRootAgentId(v || null);\n                  }\n                }}\n                options={scopeOptions}\n                placeholder={tr('agentGraph.scopeAll', 'All targets & agents')}\n                clearable\n                disabled={isGraphLoading}\n                dropdownAlign=\"right\"\n              />\n            </div>\n          </div>\n\n          {!isGraphLoading && error && (\n            <ErrorState\n              title={tr('agentGraph.failedRefresh', 'Failed to refresh agent graph')}\n              message={error.message}\n            />\n          )}\n\n          {!isGraphLoading && graphTargets.length === 0 && scopeValue && (\n            <EmptyState\n              icon={<Network className=\"size-8 text-text-secondary\" />}\n              title={tr('agentGraph.noScopeResults', 'No results for this scope')}\n              description={tr(\n                'agentGraph.noScopeDescription',\n                'No targets match the selected scope. Clear the filter to view all targets.'\n              )}\n            />\n          )}\n\n          {(graphTargets.length > 0 || isRefreshingGraph) && (\n            <div\n              className=\"mt-4 relative\"\n              style={{ height: 'calc(100vh - 280px)', minHeight: '400px' }}\n              aria-busy={isRefreshingGraph}\n            >\n              <AgentGraphView\n                targets={\n                  graphTargets as Array<{\n                    id: string;\n                    name: string;\n                    type: string;\n                    status: string;\n                    host?: string | null;\n                    agents: Array<{ id: string; name: string; version: string; isActive: boolean }>;\n                  }>\n                }\n                connections={\n                  graphConnections as Array<{\n                    id: string;\n                    protocol: string;\n                    status: string;\n                    permissions?: string[];\n                    scopes?: string[];\n                    label?: string | null;\n                    description?: string | null;\n                    sourceAgent: { id: string; name: string };\n                    target: { id: string; name: string; type: string };\n                  }>\n                }\n                onUpdatePermissions={handleUpdatePermissions}\n                availablePermissions={availablePermissions}\n                availableScopes={availableScopes}\n                onNodeClick={handleNodeNavigate}\n                fullHeight\n              />\n              {isRefreshingGraph && (\n                <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-bg-surface/60 backdrop-blur-[1px]\">\n                  <div className=\"inline-flex items-center gap-2 rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-secondary shadow-md\">\n                    <Loader2 className=\"size-4 animate-spin text-action-primary-bg\" />\n                    <span>\n                      {scopeValue\n                        ? tr('agentGraph.loadingScope', 'Applying selected scope...')\n                        : tr('agentGraph.refreshing', 'Refreshing graph...')}\n                    </span>\n                  </div>\n                </div>\n              )}\n            </div>\n          )}\n        </>\n      )}\n    </MotionPage>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"AgentGraphPage.js","names":[],"sources":["../../src/pages/AgentGraphPage.tsx"],"sourcesContent":["/**\n * Agent Graph Page — Dedicated full-page view of the agent MESH graph.\n *\n * Agents are first-class nodes; AgentMeshLinks are the directed agent->agent\n * edges. Supports root-agent scoping, RBAC permission editing on links, a\n * \"Deploy Agent\" wizard, and an on-demand mesh request panel + per-node\n * quick-actions.\n */\n\nimport { useState, useMemo, useCallback } from 'react';\nimport { usePermissions } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { VIBE_PERMISSIONS } from '../constants/permissions';\nimport { GitBranch, Loader2, Network, Rocket, Send, CheckCircle } from 'lucide-react';\nimport {\n  PageHeader,\n  SearchableSelect,\n  LoadingState,\n  ErrorState,\n  EmptyState,\n  GetHelpButton,\n} from '@/components/shared';\nimport { MotionPage } from '@burdenoff/fe-libs/shared/motion';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useVibeControls, useVibeNavigate } from '@/providers/VibeControlsProvider';\nimport { useCachedInitialData } from '@/hooks/useCachedInitialData';\nimport {\n  useGetAgentMeshGraphQuery,\n  useUpdateMeshLinkPermissionsMutation,\n  useStartMeshAgentSessionMutation,\n  useAgentConnectionConfigQuery,\n} from '@/generated/wspace-operations';\nimport { MeshSessionKind } from '@/generated/wspace-types';\nimport type { GetAgentMeshGraphQuery } from '@/generated/wspace-operations';\nimport { MeshGraphView } from '@/components/graph/MeshGraphView';\nimport { MeshDeployWizard } from '@/components/graph/MeshDeployWizard';\nimport { MeshRequestPanel } from '@/components/graph/MeshRequestPanel';\nimport { MeshNodeActions } from '@/components/graph/MeshNodeActions';\nimport type { MeshAgentUi, MeshLinkUi } from '@/components/graph/meshTypes';\n\nexport function AgentGraphPage() {\n  const { workspaceId, currentUser } = useVibeControls();\n  const navigate = useVibeNavigate();\n  const { t } = useI18n();\n  const { hasPermission, isLoading: permissionsLoading, permissions } = usePermissions();\n  const [rootAgentId, setRootAgentId] = useState<string | null>(null);\n\n  const tr = useCallback(\n    (key: string, fallback: string, params?: Record<string, string | number>): string => {\n      const translated = t(key, params);\n      const template = translated === key ? fallback : translated;\n      if (!params) return template;\n      return Object.entries(params).reduce(\n        (acc, [paramKey, paramValue]) => acc.replace(`{{${paramKey}}}`, String(paramValue)),\n        template\n      );\n    },\n    [t]\n  );\n\n  const { agents: cachedAgents } = useCachedInitialData();\n\n  const scopeOptions = useMemo(\n    () =>\n      cachedAgents.map((a) => ({\n        value: a.id,\n        label: tr('agentGraph.scopeAgentPrefix', 'Agent: {{name}}', { name: a.name }),\n      })),\n    [cachedAgents, tr]\n  );\n\n  const [scopeValue, setScopeValue] = useState<string>('');\n\n  const { data: connectionConfigData } = useAgentConnectionConfigQuery({\n    skip: !workspaceId,\n  });\n  const availablePermissions = connectionConfigData?.agentConnectionConfig.permissions ?? [];\n  const availableScopes = connectionConfigData?.agentConnectionConfig.scopes ?? [];\n\n  const {\n    data: graphData,\n    previousData,\n    loading,\n    error,\n    refetch,\n  } = useGetAgentMeshGraphQuery({\n    variables: {\n      workspaceId: workspaceId || '',\n      rootAgentId: rootAgentId || undefined,\n    },\n    skip: !workspaceId,\n  });\n\n  const resolvedMeshGraph: GetAgentMeshGraphQuery['agentMeshGraph'] | undefined =\n    graphData?.agentMeshGraph ?? previousData?.agentMeshGraph;\n\n  type MeshGraphAgent = GetAgentMeshGraphQuery['agentMeshGraph']['agents'][number];\n  type MeshGraphLink = GetAgentMeshGraphQuery['agentMeshGraph']['meshLinks'][number];\n\n  // Map generated shapes (enum target.type) into the plain UI shapes.\n  const meshAgents = useMemo<MeshAgentUi[]>(\n    () =>\n      (resolvedMeshGraph?.agents ?? []).map((a: MeshGraphAgent) => ({\n        id: a.id,\n        name: a.name,\n        hostname: a.hostname,\n        platform: a.platform,\n        version: a.version,\n        isActive: a.isActive,\n        ownerUserId: a.ownerUserId ?? null,\n        targetId: a.targetId,\n        tunnelStatus: a.tunnelStatus ?? null,\n        target: a.target\n          ? {\n              id: a.target.id,\n              name: a.target.name,\n              type: String(a.target.type),\n              host: a.target.host ?? null,\n            }\n          : null,\n      })),\n    [resolvedMeshGraph]\n  );\n\n  const meshLinks = useMemo<MeshLinkUi[]>(\n    () =>\n      (resolvedMeshGraph?.meshLinks ?? []).map((l: MeshGraphLink) => ({\n        id: l.id,\n        workspaceId: l.workspaceId,\n        status: l.status,\n        permissions: l.permissions,\n        scopes: l.scopes,\n        label: l.label ?? null,\n        description: l.description ?? null,\n        createdAt: l.createdAt,\n        updatedAt: l.updatedAt,\n        sourceAgent: { id: l.sourceAgent.id, name: l.sourceAgent.name },\n        destinationAgent: {\n          id: l.destinationAgent.id,\n          name: l.destinationAgent.name,\n          hostname: l.destinationAgent.hostname,\n          target: l.destinationAgent.target\n            ? {\n                id: l.destinationAgent.target.id,\n                name: l.destinationAgent.target.name,\n                type: String(l.destinationAgent.target.type),\n                host: l.destinationAgent.target.host ?? null,\n              }\n            : null,\n        },\n      })),\n    [resolvedMeshGraph]\n  );\n\n  const isGraphLoading = loading;\n  const isInitialLoad = isGraphLoading && !resolvedMeshGraph;\n  const isRefreshingGraph = isGraphLoading && Boolean(resolvedMeshGraph);\n\n  // Source agents available to act as deploy root / request root: prefer the\n  // mesh agents (already scoped), fall back to the cached fleet.\n  const sourceAgents = useMemo(\n    () =>\n      meshAgents.length > 0\n        ? meshAgents.map((a) => ({\n            id: a.id,\n            name: a.name,\n            hostname: a.hostname,\n            isActive: a.isActive,\n          }))\n        : cachedAgents.map((a) => ({\n            id: a.id,\n            name: a.name,\n            hostname: a.hostname,\n            isActive: a.isActive,\n          })),\n    [meshAgents, cachedAgents]\n  );\n\n  const [updateMeshLinkPerms] = useUpdateMeshLinkPermissionsMutation();\n  const [startMeshSession] = useStartMeshAgentSessionMutation();\n\n  // ── UI panels / toast ──────────────────────────────────────────────────\n  const [showDeployWizard, setShowDeployWizard] = useState(false);\n  const [deploySeedSourceId, setDeploySeedSourceId] = useState<string | null>(null);\n  const [showRequestPanel, setShowRequestPanel] = useState(false);\n  const [requestDestinationId, setRequestDestinationId] = useState<string | null>(null);\n  const [actionsForAgentId, setActionsForAgentId] = useState<string | null>(null);\n  const [toast, setToast] = useState<string | null>(null);\n\n  const flashToast = useCallback((message: string) => {\n    setToast(message);\n    setTimeout(() => setToast(null), 3500);\n  }, []);\n\n  const handleUpdatePermissions = useCallback(\n    async (meshLinkId: string, perms: string[], scopes: string[]) => {\n      await updateMeshLinkPerms({\n        variables: { meshLinkId, input: { permissions: perms, scopes } },\n      });\n      await refetch();\n    },\n    [refetch, updateMeshLinkPerms]\n  );\n\n  // The \"request root\" is the scoped root agent, else the first source agent.\n  const requestRootAgentId = rootAgentId ?? sourceAgents[0]?.id ?? null;\n\n  const handleStartTerminal = useCallback(\n    async (agentId: string) => {\n      setActionsForAgentId(null);\n      // For a DIRECT / root agent, prefer the existing terminal flow.\n      if (requestRootAgentId && agentId === requestRootAgentId) {\n        navigate(`/agents/${agentId}?tab=terminal`);\n        return;\n      }\n      if (!requestRootAgentId) {\n        flashToast(tr('mesh.terminal.noRoot', 'No reachable root agent to start a terminal from.'));\n        return;\n      }\n      try {\n        await startMeshSession({\n          variables: {\n            rootAgentId: requestRootAgentId,\n            destinationAgentId: agentId,\n            input: { kind: MeshSessionKind.Terminal },\n          },\n        });\n        // If the agent route ever lands, navigate; for now this rarely succeeds.\n        navigate(`/agents/${agentId}?tab=terminal`);\n      } catch {\n        flashToast(tr('mesh.terminal.comingSoon', 'Deep-terminal coming soon'));\n      }\n    },\n    [requestRootAgentId, startMeshSession, navigate, flashToast, tr]\n  );\n\n  const handleRunCommand = useCallback((agentId: string) => {\n    setActionsForAgentId(null);\n    setRequestDestinationId(agentId);\n    setShowRequestPanel(true);\n  }, []);\n\n  const handleDeployFromHere = useCallback((agentId: string) => {\n    setActionsForAgentId(null);\n    setDeploySeedSourceId(agentId);\n    setShowDeployWizard(true);\n  }, []);\n\n  const handleOpenAgent = useCallback(\n    (agentId: string) => {\n      setActionsForAgentId(null);\n      navigate(`/agents/${agentId}`);\n    },\n    [navigate]\n  );\n\n  const handleNodeClick = useCallback((agentId: string) => {\n    setActionsForAgentId(agentId);\n  }, []);\n\n  const actionsAgent = useMemo(\n    () => meshAgents.find((a) => a.id === actionsForAgentId) ?? null,\n    [meshAgents, actionsForAgentId]\n  );\n\n  if (permissionsLoading)\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <p className=\"text-text-secondary\">Loading permissions…</p>\n      </div>\n    );\n  if (\n    permissions &&\n    (permissions.permissionStrings?.length ?? 0) > 0 &&\n    !hasPermission(VIBE_PERMISSIONS.AGENT_READ)\n  )\n    return (\n      <div className=\"flex items-center justify-center min-h-[400px]\">\n        <div className=\"text-center space-y-2\">\n          <h2 className=\"text-lg font-semibold text-foreground\">Access Denied</h2>\n          <p className=\"text-sm text-text-secondary\">\n            You don't have permission to access this page.\n          </p>\n        </div>\n      </div>\n    );\n\n  const hasAgents = meshAgents.length > 0;\n\n  return (\n    <MotionPage>\n      <div className=\"flex items-start justify-between gap-3\">\n        <PageHeader\n          title={tr('nav.agentGraph', 'Agent Mesh')}\n          description={tr(\n            'agentGraph.meshDescription',\n            'Visualize and manage the agent-to-agent mesh: deploy new agents, edit link permissions, and run requests across hops.'\n          )}\n        />\n        <div className=\"flex items-center gap-2 pt-1\">\n          <button\n            type=\"button\"\n            onClick={() => {\n              setShowRequestPanel((v) => !v);\n              setRequestDestinationId(null);\n            }}\n            className=\"inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md border border-border-default text-text-primary hover:bg-bg-sunken transition-colors\"\n          >\n            <Send className=\"size-4\" />\n            {tr('mesh.requestPanelToggle', 'Mesh request')}\n          </button>\n          <button\n            type=\"button\"\n            onClick={() => {\n              setDeploySeedSourceId(rootAgentId);\n              setShowDeployWizard(true);\n            }}\n            disabled={sourceAgents.length === 0}\n            className=\"inline-flex items-center gap-2 px-3 py-2 text-sm font-medium rounded-md bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg-hover transition-colors disabled:opacity-50\"\n          >\n            <Rocket className=\"size-4\" />\n            {tr('mesh.deployButton', 'Deploy Agent')}\n          </button>\n        </div>\n      </div>\n\n      {isInitialLoad && (\n        <LoadingState message={tr('agentGraph.loading', 'Loading agent mesh...')} />\n      )}\n\n      {!isGraphLoading && error && !hasAgents && (\n        <ErrorState\n          title={tr('agentGraph.failedLoad', 'Failed to load agent mesh')}\n          message={error.message}\n        />\n      )}\n\n      {!isGraphLoading && !error && !hasAgents && !scopeValue && (\n        <EmptyState\n          icon={<Network className=\"size-8 text-text-secondary\" />}\n          title={tr('agentGraph.noAgentsConnected', 'No agents in the mesh')}\n          description={tr(\n            'agentGraph.noAgentsDescription',\n            'Deploy an agent to start building your agent mesh topology.'\n          )}\n          action={\n            <GetHelpButton prompt=\"What is the Agent Mesh in VibeControls and how do I deploy agents?\" />\n          }\n        />\n      )}\n\n      {showRequestPanel && (\n        <div className=\"mt-4\">\n          <MeshRequestPanel\n            rootAgentId={requestRootAgentId}\n            destinations={meshAgents}\n            initialDestinationId={requestDestinationId}\n            onClose={() => setShowRequestPanel(false)}\n          />\n        </div>\n      )}\n\n      {(hasAgents || scopeValue || isRefreshingGraph) && (\n        <>\n          <div className=\"flex items-center gap-3 mt-4\">\n            <div className=\"flex items-center gap-2\">\n              <GitBranch size={16} className=\"text-text-tertiary\" />\n              <span className=\"text-sm font-medium text-text-secondary\">\n                {tr('agentGraph.meshCountSummary', '{{agents}} agents, {{links}} links', {\n                  agents: meshAgents.length,\n                  links: meshLinks.length,\n                })}\n              </span>\n              {isRefreshingGraph && (\n                <span\n                  role=\"status\"\n                  aria-live=\"polite\"\n                  className=\"inline-flex items-center gap-1.5 rounded-full border border-border-default bg-bg-surface px-2.5 py-1 text-xs font-medium text-text-secondary\"\n                >\n                  <Loader2 className=\"size-3.5 animate-spin text-action-primary-bg\" />\n                  {tr('agentGraph.refreshing', 'Refreshing graph...')}\n                </span>\n              )}\n            </div>\n            <div className=\"flex-1\" />\n            <div className=\"flex items-center gap-2\">\n              <label className=\"text-xs font-medium text-text-secondary\">\n                {tr('agentGraph.scopeLabel', 'Scope:')}\n              </label>\n              <SearchableSelect\n                value={scopeValue}\n                onChange={(v: string) => {\n                  setScopeValue(v);\n                  setRootAgentId(v || null);\n                }}\n                options={scopeOptions}\n                placeholder={tr('agentGraph.scopeAllAgents', 'All agents')}\n                clearable\n                disabled={isGraphLoading}\n                dropdownAlign=\"right\"\n              />\n            </div>\n          </div>\n\n          {!isGraphLoading && error && (\n            <ErrorState\n              title={tr('agentGraph.failedRefresh', 'Failed to refresh agent mesh')}\n              message={error.message}\n            />\n          )}\n\n          {!isGraphLoading && !hasAgents && scopeValue && (\n            <EmptyState\n              icon={<Network className=\"size-8 text-text-secondary\" />}\n              title={tr('agentGraph.noScopeResults', 'No results for this scope')}\n              description={tr(\n                'agentGraph.noScopeAgentDescription',\n                'No agents match the selected scope. Clear the filter to view the full mesh.'\n              )}\n            />\n          )}\n\n          {(hasAgents || isRefreshingGraph) && (\n            <div\n              className=\"mt-4 relative\"\n              style={{ height: 'calc(100vh - 280px)', minHeight: '400px' }}\n              aria-busy={isRefreshingGraph}\n            >\n              <MeshGraphView\n                agents={meshAgents}\n                meshLinks={meshLinks}\n                currentUserId={currentUser?.id ?? null}\n                onUpdatePermissions={handleUpdatePermissions}\n                availablePermissions={availablePermissions}\n                availableScopes={availableScopes}\n                onNodeClick={handleNodeClick}\n                fullHeight\n              />\n\n              {/* Node quick-actions popover */}\n              {actionsAgent && (\n                <div className=\"absolute right-4 top-4 z-20\">\n                  <MeshNodeActions\n                    agent={actionsAgent}\n                    onRunCommand={handleRunCommand}\n                    onStartTerminal={(id) => void handleStartTerminal(id)}\n                    onDeployFromHere={handleDeployFromHere}\n                    onOpenAgent={handleOpenAgent}\n                    onClose={() => setActionsForAgentId(null)}\n                  />\n                </div>\n              )}\n\n              {isRefreshingGraph && (\n                <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-bg-surface/60 backdrop-blur-[1px]\">\n                  <div className=\"inline-flex items-center gap-2 rounded-md border border-border-default bg-bg-surface px-3 py-2 text-sm text-text-secondary shadow-md\">\n                    <Loader2 className=\"size-4 animate-spin text-action-primary-bg\" />\n                    <span>\n                      {scopeValue\n                        ? tr('agentGraph.loadingScope', 'Applying selected scope...')\n                        : tr('agentGraph.refreshing', 'Refreshing graph...')}\n                    </span>\n                  </div>\n                </div>\n              )}\n            </div>\n          )}\n        </>\n      )}\n\n      {showDeployWizard && (\n        <MeshDeployWizard\n          sourceAgents={sourceAgents}\n          initialSourceAgentId={deploySeedSourceId}\n          availablePermissions={availablePermissions}\n          onClose={() => setShowDeployWizard(false)}\n          onCompleted={() => {\n            void refetch();\n          }}\n        />\n      )}\n\n      {toast && (\n        <div 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\">\n          <CheckCircle size={16} className=\"text-status-success-text flex-shrink-0\" />\n          <span className=\"text-text-primary\">{toast}</span>\n        </div>\n      )}\n    </MotionPage>\n  );\n}\n"],"mappings":"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"}