hypervibes 0.0.0-stage → 0.4.0

package/.build/server/assets/_authenticated.agents._agentId.settings-PEzEvOfo.js

@@ -0,0 +1,751 @@
+import { l as deleteAgent } from "./agents-CZq-0mna.js";
+import { o as invalidateAgentCollection, t as agentChatQueryOptions } from "./agent-queries-Cmx8RiUx.js";
+import { n as saveRiskSettings, t as riskQueryOptions } from "./risk-queries-JQpByHT2.js";
+import { a as saveNotificationSettings, r as notificationSettingsQueryOptions, t as notificationKeys } from "./notification-queries-0CJUkBt9.js";
+import { a as getGatewayStatus, i as disconnectGateway, n as gatewayQueryOptions, o as startGatewayLink, r as addGatewayToken, t as Route } from "./_authenticated.agents._agentId.settings-DDwjT3Ui.js";
+import { n as configButton } from "./config-dialog-9gSAjwwT.js";
+import { t as InstrumentPicker } from "./instrument-picker-CRroLwVq.js";
+import { t as AgentEnablementControl } from "./agent-enablement-control-C90f0uIb.js";
+import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { useRouter } from "@tanstack/react-router";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { useMutation, useQuery, useQueryClient, useSuspenseQuery } from "@tanstack/react-query";
+import { toast } from "sonner";
+import { createPortal } from "react-dom";
+//#region src/components/notification-settings-section.tsx
+var checkbox = "size-4 cursor-pointer accent-violet-500 disabled:cursor-not-allowed disabled:opacity-50";
+function SettingsForm({ agentId, saved }) {
+	const client = useQueryClient();
+	const [draft, setDraft] = useState(saved);
+	const mutation = useMutation({
+		mutationFn: (settings) => saveNotificationSettings({ data: {
+			agentId,
+			...settings
+		} }),
+		onSuccess: async (settings) => {
+			client.setQueryData(notificationSettingsQueryOptions(agentId).queryKey, settings);
+			toast.success("Notification settings saved");
+			await client.invalidateQueries({ queryKey: notificationKeys.all(agentId) });
+		}
+	});
+	const dirty = draft.enabled !== saved.enabled || draft.submissions !== saved.submissions || draft.fills !== saved.fills;
+	return /* @__PURE__ */ jsxs("form", {
+		className: "mt-4 space-y-4",
+		onSubmit: (event) => {
+			event.preventDefault();
+			if (!mutation.isPending && dirty) mutation.mutate(draft);
+		},
+		children: [/* @__PURE__ */ jsxs("fieldset", {
+			disabled: mutation.isPending,
+			className: "space-y-3 text-sm text-zinc-300",
+			children: [
+				/* @__PURE__ */ jsxs("label", {
+					className: "flex cursor-pointer items-center gap-3",
+					children: [/* @__PURE__ */ jsx("input", {
+						type: "checkbox",
+						className: checkbox,
+						checked: draft.enabled,
+						onChange: (event) => setDraft((current) => ({
+							...current,
+							enabled: event.target.checked
+						}))
+					}), "Enable Telegram notifications"]
+				}),
+				/* @__PURE__ */ jsxs("fieldset", {
+					disabled: !draft.enabled,
+					className: "space-y-3 pl-7 disabled:opacity-50",
+					children: [/* @__PURE__ */ jsxs("label", {
+						className: "flex cursor-pointer items-center gap-3",
+						children: [/* @__PURE__ */ jsx("input", {
+							type: "checkbox",
+							className: checkbox,
+							checked: draft.submissions,
+							onChange: (event) => setDraft((current) => ({
+								...current,
+								submissions: event.target.checked
+							}))
+						}), "Order submissions"]
+					}), /* @__PURE__ */ jsxs("label", {
+						className: "flex cursor-pointer items-center gap-3",
+						children: [/* @__PURE__ */ jsx("input", {
+							type: "checkbox",
+							className: checkbox,
+							checked: draft.fills,
+							onChange: (event) => setDraft((current) => ({
+								...current,
+								fills: event.target.checked
+							}))
+						}), "Order fills (including external/manual trades)"]
+					})]
+				}),
+				dirty && /* @__PURE__ */ jsx("button", {
+					type: "submit",
+					disabled: mutation.isPending,
+					className: "cursor-pointer rounded-full bg-violet-600 px-4 py-2 text-sm text-white hover:bg-violet-500 disabled:cursor-wait disabled:opacity-50",
+					children: mutation.isPending ? "Saving…" : "Save Telegram notification settings"
+				})
+			]
+		}), mutation.error && /* @__PURE__ */ jsx("p", {
+			role: "alert",
+			className: "text-sm text-red-300",
+			children: mutation.error.message
+		})]
+	});
+}
+function NotificationSettingsSection({ agentId }) {
+	const query = useQuery(notificationSettingsQueryOptions(agentId));
+	return /* @__PURE__ */ jsxs("section", {
+		id: "notifications",
+		"aria-label": "Notifications",
+		className: "mt-6 scroll-mt-2 border-t border-zinc-800 pt-6",
+		children: [
+			/* @__PURE__ */ jsx("h3", {
+				className: "font-medium text-white",
+				children: "Notifications"
+			}),
+			query.isPending ? /* @__PURE__ */ jsx("p", {
+				role: "status",
+				className: "mt-4 text-sm text-zinc-400",
+				children: "Loading notification settings…"
+			}) : query.data ? /* @__PURE__ */ jsx(SettingsForm, {
+				agentId,
+				saved: query.data
+			}, agentId) : null,
+			query.error && /* @__PURE__ */ jsxs("p", {
+				role: "alert",
+				className: "mt-3 text-sm text-red-300",
+				children: [
+					query.error.message,
+					" ",
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: "cursor-pointer text-violet-300 hover:underline",
+						onClick: () => {
+							query.refetch();
+						},
+						children: "Retry"
+					})
+				]
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/agent-settings-page.tsx
+var button = "cursor-pointer rounded-full bg-violet-600 px-4 py-2 text-sm text-white hover:bg-violet-500 disabled:cursor-not-allowed disabled:opacity-50";
+var outlinedButton = "cursor-pointer rounded-full border border-violet-600 px-4 py-2 text-sm text-violet-300 hover:border-violet-500 hover:bg-violet-950 disabled:cursor-not-allowed disabled:opacity-50";
+var radio = "size-4 shrink-0 cursor-pointer appearance-none rounded-full border border-zinc-600 bg-zinc-950 transition checked:border-[5px] checked:border-violet-500 checked:bg-white hover:border-violet-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-violet-400 focus-visible:ring-offset-2 focus-visible:ring-offset-zinc-950 disabled:cursor-wait disabled:opacity-50";
+function NotionalLimit({ title, inputLabel, placeholder, value, onChange }) {
+	const id = useId();
+	return /* @__PURE__ */ jsxs("fieldset", {
+		className: "min-w-0 space-y-3 text-sm text-zinc-300",
+		children: [
+			/* @__PURE__ */ jsx("legend", {
+				className: "mb-3 font-medium",
+				children: title
+			}),
+			/* @__PURE__ */ jsxs("label", {
+				className: "flex w-fit cursor-pointer items-center gap-2",
+				children: [/* @__PURE__ */ jsx("input", {
+					type: "radio",
+					name: id,
+					value: "unlimited",
+					className: radio,
+					checked: !value.limited,
+					onChange: () => onChange({
+						...value,
+						limited: false
+					})
+				}), "No limit"]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-3",
+				children: [/* @__PURE__ */ jsxs("label", {
+					className: "flex shrink-0 cursor-pointer items-center gap-2",
+					children: [/* @__PURE__ */ jsx("input", {
+						type: "radio",
+						name: id,
+						value: "limited",
+						className: radio,
+						checked: value.limited,
+						onChange: () => onChange({
+							...value,
+							limited: true
+						})
+					}), "Limit:"]
+				}), /* @__PURE__ */ jsxs("div", {
+					className: `relative min-w-0 flex-1 ${value.limited ? "" : "opacity-50"}`,
+					children: [/* @__PURE__ */ jsx("input", {
+						"aria-label": inputLabel,
+						"aria-describedby": `${id}-currency`,
+						className: "block w-full rounded-lg border border-zinc-700 bg-zinc-950 py-2.5 pl-3 pr-16 text-sm text-white focus-visible:border-violet-400 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-violet-400 disabled:cursor-not-allowed",
+						inputMode: "decimal",
+						placeholder,
+						disabled: !value.limited,
+						value: value.amount,
+						onChange: (event) => onChange({
+							...value,
+							amount: event.target.value
+						})
+					}), /* @__PURE__ */ jsx("span", {
+						id: `${id}-currency`,
+						className: "pointer-events-none absolute inset-y-0 right-3 flex items-center text-xs text-zinc-500",
+						children: "USDC"
+					})]
+				})]
+			})
+		]
+	});
+}
+/** The only host-enforced trading rules; everything else is instructions/insights. */
+function RiskManagementSection({ agentId }) {
+	const client = useQueryClient();
+	const { data: saved, error: refreshError } = useSuspenseQuery(riskQueryOptions(agentId));
+	const [enabled, setEnabled] = useState(saved.tradingEnabled);
+	const [instruments, setInstruments] = useState(saved.allowedInstruments);
+	const [maxOrder, setMaxOrder] = useState({
+		limited: saved.maxOrderNotional !== null,
+		amount: saved.maxOrderNotional ?? ""
+	});
+	const [maxTotal, setMaxTotal] = useState({
+		limited: saved.maxTotalNotional !== null,
+		amount: saved.maxTotalNotional ?? ""
+	});
+	const mutation = useMutation({
+		mutationFn: async (settings) => {
+			if (maxOrder.limited && !maxOrder.amount.trim()) throw new Error("Enter a max order notional limit or select No limit.");
+			if (maxTotal.limited && !maxTotal.amount.trim()) throw new Error("Enter a max total exposure limit or select No limit.");
+			return saveRiskSettings({ data: {
+				agentId,
+				settings
+			} });
+		},
+		onSuccess: async (settings) => {
+			client.setQueryData(riskQueryOptions(agentId).queryKey, settings);
+			toast.success("Risk settings saved");
+			await invalidateAgentCollection(client);
+		}
+	});
+	const busy = mutation.isPending;
+	const error = mutation.error?.message ?? refreshError?.message;
+	const settings = {
+		tradingEnabled: enabled,
+		allowedInstruments: instruments,
+		maxOrderNotional: maxOrder.limited ? maxOrder.amount.trim() : null,
+		maxTotalNotional: maxTotal.limited ? maxTotal.amount.trim() : null
+	};
+	const dirty = settings.tradingEnabled !== saved.tradingEnabled || JSON.stringify(settings.allowedInstruments === null ? null : [...settings.allowedInstruments].sort()) !== JSON.stringify(saved.allowedInstruments === null ? null : [...saved.allowedInstruments].sort()) || settings.maxOrderNotional !== saved.maxOrderNotional || settings.maxTotalNotional !== saved.maxTotalNotional;
+	function save() {
+		if (!busy && dirty) mutation.mutate(settings);
+	}
+	return /* @__PURE__ */ jsxs("section", {
+		id: "risk-management",
+		className: "w-full scroll-mt-2 rounded-2xl border border-zinc-800 bg-[#0d0d10] p-6",
+		"aria-label": "Risk management",
+		children: [
+			/* @__PURE__ */ jsx("h2", {
+				className: "text-lg font-medium text-white",
+				children: "Risk management"
+			}),
+			/* @__PURE__ */ jsxs("fieldset", {
+				disabled: busy,
+				className: "mt-4 space-y-4",
+				children: [
+					/* @__PURE__ */ jsxs("label", {
+						className: "flex cursor-pointer items-center gap-3 text-sm text-zinc-300",
+						children: [/* @__PURE__ */ jsxs("span", {
+							className: "relative inline-flex size-5 shrink-0",
+							children: [/* @__PURE__ */ jsx("input", {
+								type: "checkbox",
+								className: "peer size-5 cursor-pointer appearance-none rounded border border-zinc-600 bg-zinc-950 transition checked:border-violet-500 checked:bg-violet-600 hover:border-violet-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-violet-400 focus-visible:ring-offset-2 focus-visible:ring-offset-zinc-950 disabled:cursor-wait disabled:opacity-50",
+								checked: enabled,
+								onChange: (event) => setEnabled(event.target.checked)
+							}), /* @__PURE__ */ jsx("svg", {
+								"aria-hidden": "true",
+								viewBox: "0 0 20 20",
+								fill: "none",
+								stroke: "currentColor",
+								strokeWidth: 2.5,
+								className: "pointer-events-none absolute inset-0.5 size-4 text-white opacity-0 transition peer-checked:opacity-100 peer-disabled:text-zinc-400",
+								children: /* @__PURE__ */ jsx("path", {
+									strokeLinecap: "round",
+									strokeLinejoin: "round",
+									d: "m4 10 4 4 8-8"
+								})
+							})]
+						}), /* @__PURE__ */ jsx("span", { children: "Enable Trading" })]
+					}),
+					/* @__PURE__ */ jsx(InstrumentPicker, {
+						agentId,
+						value: instruments,
+						onChange: setInstruments,
+						disabled: busy
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "grid gap-4 sm:grid-cols-2",
+						children: [/* @__PURE__ */ jsx(NotionalLimit, {
+							title: "Max order notional",
+							inputLabel: "Max order notional",
+							placeholder: "1000",
+							value: maxOrder,
+							onChange: setMaxOrder
+						}), /* @__PURE__ */ jsx(NotionalLimit, {
+							title: "Max total exposure",
+							inputLabel: "Max total notional",
+							placeholder: "5000",
+							value: maxTotal,
+							onChange: setMaxTotal
+						})]
+					}),
+					dirty && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						className: button,
+						disabled: busy,
+						onClick: () => {
+							save();
+						},
+						children: busy ? "Saving…" : "Save risk settings"
+					})
+				]
+			}),
+			error && /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "mt-3 text-sm text-red-300",
+				children: error
+			})
+		]
+	});
+}
+function DeleteAgentSection({ agent }) {
+	const router = useRouter();
+	const [confirming, setConfirming] = useState(false);
+	const [confirmation, setConfirmation] = useState("");
+	const client = useQueryClient();
+	const mutation = useMutation({
+		mutationFn: () => deleteAgent({ data: {
+			id: agent.id,
+			confirmation
+		} }),
+		onSuccess: async () => {
+			await router.navigate({ to: "/agents" });
+			for (const key of [
+				"agent",
+				"agent-chat",
+				"agent-history",
+				"agent-dashboard",
+				"risk",
+				"journal",
+				"journal-notes",
+				"journal-audit",
+				"subagents",
+				"memories",
+				"insights",
+				"artifacts",
+				"chart-instruments",
+				"chart-layouts",
+				"chart-history",
+				"chart-fills",
+				"notifications",
+				"notification-settings"
+			]) client.removeQueries({ queryKey: [key, agent.id] });
+			toast.success("Agent deleted");
+		},
+		onSettled: async (_data, error) => {
+			await invalidateAgentCollection(client);
+			if (error) await Promise.all([client.invalidateQueries({ queryKey: ["agent", agent.id] }), client.invalidateQueries({ queryKey: ["agent-chat", agent.id] })]);
+		}
+	});
+	const busy = mutation.isPending;
+	const error = mutation.error?.message;
+	function remove() {
+		if (!busy && confirmation === agent.name) mutation.mutate();
+	}
+	return /* @__PURE__ */ jsxs("section", {
+		"aria-label": "Danger zone",
+		className: "rounded-2xl border border-red-900/60 bg-[#0d0d10] p-6",
+		children: [
+			/* @__PURE__ */ jsx("h2", {
+				className: "text-lg font-medium text-red-300",
+				children: "Danger zone"
+			}),
+			/* @__PURE__ */ jsx("p", {
+				className: "mt-3 text-sm text-zinc-400",
+				children: "Deleting this agent stops its workers, removes its configuration and application history, and releases its Hyperliquid account for reuse. Existing exchange orders and positions are not changed. This cannot be undone."
+			}),
+			agent.error && (agent.state === "stopping" || agent.state === "stopped") && /* @__PURE__ */ jsx("p", {
+				role: "status",
+				className: "mt-3 text-sm text-red-300",
+				children: agent.error
+			}),
+			!confirming ? /* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: () => setConfirming(true),
+				className: "mt-4 cursor-pointer rounded-full border border-red-800 px-4 py-2 text-sm text-red-300 hover:bg-red-950",
+				children: "Delete agent"
+			}) : /* @__PURE__ */ jsxs("form", {
+				className: "mt-4 space-y-3",
+				onSubmit: (event) => {
+					event.preventDefault();
+					remove();
+				},
+				children: [/* @__PURE__ */ jsxs("label", {
+					className: "block text-sm text-zinc-300",
+					children: [
+						"Type ",
+						/* @__PURE__ */ jsx("strong", { children: agent.name }),
+						" to confirm deletion",
+						/* @__PURE__ */ jsx("input", {
+							"aria-label": "Agent name confirmation",
+							autoComplete: "off",
+							value: confirmation,
+							disabled: busy,
+							onChange: (event) => setConfirmation(event.target.value),
+							className: "mt-2 block w-full rounded-lg border border-zinc-700 bg-zinc-950 px-3 py-2 text-white"
+						})
+					]
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "flex gap-3",
+					children: [/* @__PURE__ */ jsx("button", {
+						type: "button",
+						disabled: busy,
+						onClick: () => {
+							setConfirming(false);
+							setConfirmation("");
+							mutation.reset();
+						},
+						className: "cursor-pointer rounded-full border border-zinc-700 px-4 py-2 text-sm text-zinc-300 disabled:cursor-not-allowed",
+						children: "Cancel"
+					}), /* @__PURE__ */ jsx("button", {
+						type: "submit",
+						disabled: busy || confirmation !== agent.name,
+						className: "cursor-pointer rounded-full bg-red-700 px-4 py-2 text-sm text-white hover:bg-red-600 disabled:cursor-not-allowed disabled:opacity-50",
+						children: busy ? "Stopping and deleting…" : "Permanently delete agent"
+					})]
+				})]
+			}),
+			error && /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "mt-3 text-sm text-red-300",
+				children: error
+			})
+		]
+	});
+}
+/** The Telegram setup wizard, one step per gateway state: token, chat link, connected. */
+function TelegramSetupDialog({ agentId, initial, pollMs = 4e3, onClose, onChanged }) {
+	const dialog = useRef(null);
+	const titleId = useId();
+	const [status, setStatus] = useState(initial);
+	const [token, setToken] = useState("");
+	const [link, setLink] = useState(null);
+	useEffect(() => {
+		const element = dialog.current;
+		element.showModal();
+		return () => element.close();
+	}, []);
+	useEffect(() => {
+		if (!status.hasToken || status.connected) return;
+		const interval = setInterval(() => {
+			getGatewayStatus({ data: { id: agentId } }).then((fresh) => {
+				setStatus((current) => current.hasToken === fresh.hasToken && current.connected === fresh.connected ? current : fresh);
+				if (fresh.connected) onChanged(fresh);
+			}).catch(() => void 0);
+		}, pollMs);
+		return () => clearInterval(interval);
+	}, [
+		status.hasToken,
+		status.connected,
+		agentId,
+		pollMs,
+		onChanged
+	]);
+	const addMutation = useMutation({
+		mutationFn: () => addGatewayToken({ data: {
+			id: agentId,
+			token
+		} }),
+		onSuccess: (result) => {
+			setToken("");
+			setStatus(result);
+			onChanged(result);
+			toast.success("Telegram bot added");
+		}
+	});
+	const linkMutation = useMutation({
+		mutationFn: () => startGatewayLink({ data: { id: agentId } }),
+		onSuccess: ({ link }) => setLink(link)
+	});
+	const removeMutation = useMutation({
+		mutationFn: () => disconnectGateway({ data: { id: agentId } }),
+		onSuccess: (result) => {
+			setLink(null);
+			setStatus(result);
+			onChanged(result);
+		}
+	});
+	const busy = addMutation.isPending || linkMutation.isPending || removeMutation.isPending;
+	const error = addMutation.error?.message ?? linkMutation.error?.message ?? removeMutation.error?.message;
+	return createPortal(/* @__PURE__ */ jsxs("dialog", {
+		ref: dialog,
+		"aria-labelledby": titleId,
+		onCancel: (event) => {
+			event.preventDefault();
+			onClose();
+		},
+		className: "m-auto flex max-h-[calc(100dvh-2rem)] w-[calc(100%_-_2rem)] max-w-md flex-col rounded-2xl border border-zinc-800 bg-[#0d0d10] p-6 text-zinc-200 shadow-2xl backdrop:bg-black/70 backdrop:backdrop-blur-sm",
+		children: [
+			/* @__PURE__ */ jsxs("h3", {
+				id: titleId,
+				className: "flex items-center gap-2 text-lg font-semibold text-white",
+				children: [/* @__PURE__ */ jsx("img", {
+					src: "/static/telegram.svg",
+					alt: "",
+					"aria-hidden": "true",
+					className: "h-5 w-5 rounded-full"
+				}), "Connect Telegram"]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "mt-3 min-h-0 flex-1 space-y-4 overflow-y-auto text-sm",
+				children: [!status.hasToken ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("p", {
+					className: "text-zinc-400",
+					children: [
+						"Create a bot with ",
+						/* @__PURE__ */ jsx("a", {
+							className: "cursor-pointer text-violet-400 underline hover:text-violet-300",
+							href: "https://t.me/BotFather",
+							target: "_blank",
+							rel: "noopener noreferrer",
+							children: "@BotFather"
+						}),
+						", then paste its token here. One bot can only serve one Agent."
+					]
+				}), /* @__PURE__ */ jsxs("form", {
+					onSubmit: (event) => {
+						event.preventDefault();
+						if (token.trim() && !busy) addMutation.mutate();
+					},
+					children: [/* @__PURE__ */ jsxs("label", {
+						className: "block text-zinc-300",
+						htmlFor: titleId + "-token",
+						children: ["Bot token", /* @__PURE__ */ jsx("input", {
+							id: titleId + "-token",
+							"aria-label": "Telegram bot token",
+							autoComplete: "off",
+							value: token,
+							disabled: busy,
+							onChange: (event) => setToken(event.target.value),
+							className: "mt-2 block w-full rounded-lg border border-zinc-700 bg-zinc-950 px-3 py-2 font-mono text-sm text-white",
+							placeholder: "123456789:AAE…"
+						})]
+					}), /* @__PURE__ */ jsx("button", {
+						type: "submit",
+						disabled: busy || !token.trim(),
+						className: `${button} mt-4`,
+						children: "Add bot token"
+					})]
+				})] }) : status.connected ? /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsxs("p", {
+					role: "status",
+					children: [
+						"Telegram connected — this Agent's main conversation is bridged to ",
+						/* @__PURE__ */ jsxs("span", {
+							className: "font-medium text-white",
+							children: ["@", status.botUsername]
+						}),
+						status.chatUsername && /* @__PURE__ */ jsxs(Fragment$1, { children: [" · chat ", /* @__PURE__ */ jsxs("span", {
+							className: "font-medium text-white",
+							children: ["@", status.chatUsername]
+						})] }),
+						status.chatId !== null && /* @__PURE__ */ jsxs(Fragment$1, { children: [" · id ", /* @__PURE__ */ jsx("span", {
+							className: "font-medium text-white",
+							children: status.chatId
+						})] }),
+						"."
+					]
+				}) }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [
+					/* @__PURE__ */ jsxs("p", {
+						className: "text-zinc-400",
+						children: [
+							"Bot ",
+							/* @__PURE__ */ jsxs("span", {
+								className: "font-medium text-white",
+								children: ["@", status.botUsername]
+							}),
+							" is ready. Link the Telegram chat this Agent should talk in."
+						]
+					}),
+					link ? /* @__PURE__ */ jsxs("div", {
+						className: "space-y-3",
+						children: [/* @__PURE__ */ jsx("a", {
+							className: `${button} inline-block`,
+							href: link,
+							target: "_blank",
+							rel: "noopener noreferrer",
+							children: "Open Telegram"
+						}), /* @__PURE__ */ jsxs("p", {
+							className: "text-zinc-500",
+							children: [
+								"Then send the prefilled ",
+								/* @__PURE__ */ jsx("code", {
+									className: "text-zinc-400",
+									children: "/start"
+								}),
+								" command. This dialog updates automatically once the chat is linked."
+							]
+						})]
+					}) : /* @__PURE__ */ jsx("button", {
+						type: "button",
+						disabled: busy,
+						onClick: () => linkMutation.mutate(),
+						className: button,
+						children: "Link Telegram chat"
+					}),
+					/* @__PURE__ */ jsx("button", {
+						type: "button",
+						disabled: busy,
+						onClick: () => removeMutation.mutate(),
+						className: "block rounded-full border border-zinc-700 px-4 py-2 text-sm text-zinc-300 hover:bg-zinc-900 disabled:cursor-not-allowed disabled:opacity-50",
+						children: "Remove bot token"
+					})
+				] }), error && /* @__PURE__ */ jsx("p", {
+					role: "alert",
+					className: "text-sm text-red-300",
+					children: error
+				})]
+			}),
+			/* @__PURE__ */ jsx("footer", {
+				className: "mt-6 flex shrink-0 justify-end border-t border-zinc-800 pt-4",
+				children: /* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: onClose,
+					className: configButton,
+					children: status.connected ? "Done" : "Close"
+				})
+			})
+		]
+	}), document.body);
+}
+function TelegramSection({ agentId, notificationsAvailable }) {
+	const client = useQueryClient();
+	const { data: saved } = useSuspenseQuery(gatewayQueryOptions(agentId));
+	const [open, setOpen] = useState(false);
+	const refresh = useCallback((status) => client.setQueryData(gatewayQueryOptions(agentId).queryKey, status), [client, agentId]);
+	const disconnectMutation = useMutation({
+		mutationFn: () => disconnectGateway({ data: { id: agentId } }),
+		onSuccess: async (status) => {
+			refresh(status);
+			toast.success("Telegram disconnected");
+		}
+	});
+	return /* @__PURE__ */ jsxs("section", {
+		id: "telegram",
+		className: "w-full scroll-mt-2 rounded-2xl border border-zinc-800 bg-[#0d0d10] p-6",
+		"aria-label": "Telegram",
+		children: [
+			/* @__PURE__ */ jsxs("h2", {
+				className: "flex items-center gap-2 text-lg font-medium text-white",
+				children: [/* @__PURE__ */ jsx("img", {
+					src: "/static/telegram.svg",
+					alt: "",
+					"aria-hidden": "true",
+					className: "h-5 w-5 rounded-full"
+				}), "Telegram"]
+			}),
+			saved.error && /* @__PURE__ */ jsx("p", {
+				role: "status",
+				className: "mt-3 text-sm text-amber-300",
+				children: saved.error
+			}),
+			saved.connected ? /* @__PURE__ */ jsxs("div", {
+				className: "mt-4 space-y-3 text-sm text-zinc-300",
+				children: [/* @__PURE__ */ jsxs("p", { children: [
+					"Connected to ",
+					/* @__PURE__ */ jsxs("span", {
+						className: "font-medium text-white",
+						children: ["@", saved.botUsername]
+					}),
+					saved.chatUsername && /* @__PURE__ */ jsxs(Fragment$1, { children: [" · chat ", /* @__PURE__ */ jsxs("span", {
+						className: "font-medium text-white",
+						children: ["@", saved.chatUsername]
+					})] }),
+					saved.chatId !== null && /* @__PURE__ */ jsxs(Fragment$1, { children: [" · id ", /* @__PURE__ */ jsx("span", {
+						className: "font-medium text-white",
+						children: saved.chatId
+					})] })
+				] }), /* @__PURE__ */ jsx("button", {
+					type: "button",
+					disabled: disconnectMutation.isPending,
+					onClick: () => disconnectMutation.mutate(),
+					className: "cursor-pointer rounded-full border border-red-800 px-4 py-2 text-sm text-red-300 hover:bg-red-950 disabled:cursor-not-allowed disabled:opacity-50",
+					children: "Disconnect Telegram"
+				})]
+			}) : /* @__PURE__ */ jsx("button", {
+				type: "button",
+				"aria-haspopup": "dialog",
+				onClick: () => setOpen(true),
+				className: `${outlinedButton} mt-4`,
+				children: "Connect Telegram"
+			}),
+			disconnectMutation.error && /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "mt-3 text-sm text-red-300",
+				children: disconnectMutation.error.message
+			}),
+			saved.connected && notificationsAvailable && /* @__PURE__ */ jsx(NotificationSettingsSection, { agentId }),
+			open && /* @__PURE__ */ jsx(TelegramSetupDialog, {
+				agentId,
+				initial: saved,
+				onClose: () => setOpen(false),
+				onChanged: refresh
+			})
+		]
+	});
+}
+function AgentSettingsPage({ initial }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "w-full space-y-2",
+		children: [
+			/* @__PURE__ */ jsxs("section", {
+				className: "rounded-2xl border border-zinc-800 bg-[#0d0d10] p-6",
+				children: [/* @__PURE__ */ jsx("h2", {
+					className: "text-lg font-medium text-white",
+					children: "Settings"
+				}), /* @__PURE__ */ jsxs("dl", {
+					className: "mt-4 grid gap-4 sm:grid-cols-2",
+					children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", {
+						className: "text-xs uppercase tracking-wide text-zinc-500",
+						children: "Trading account"
+					}), /* @__PURE__ */ jsx("dd", {
+						className: "mt-2 break-all font-mono text-sm text-zinc-300",
+						children: initial.agent.tradingAccountAddress ?? "No account linked (chat only)"
+					})] }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("dt", {
+						className: "text-xs uppercase tracking-wide text-zinc-500",
+						children: "Lifecycle status"
+					}), /* @__PURE__ */ jsx("dd", {
+						className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-2 text-sm text-zinc-300",
+						children: initial.agent.state === "stopping" || initial.agent.state === "stopped" ? initial.agent.state : /* @__PURE__ */ jsx(AgentEnablementControl, {
+							id: initial.agent.id,
+							name: initial.agent.name,
+							enabled: initial.agent.enabled,
+							variant: "settings"
+						})
+					})] })]
+				})]
+			}),
+			initial.agent.state !== "stopping" && initial.agent.state !== "stopped" && /* @__PURE__ */ jsx(RiskManagementSection, { agentId: initial.agent.id }),
+			/* @__PURE__ */ jsx(TelegramSection, {
+				agentId: initial.agent.id,
+				notificationsAvailable: initial.agent.state !== "stopping" && initial.agent.state !== "stopped"
+			}),
+			/* @__PURE__ */ jsx(DeleteAgentSection, { agent: initial.agent })
+		]
+	});
+}
+//#endregion
+//#region src/routes/_authenticated.agents.$agentId.settings.tsx?tsr-split=component
+function SettingsRoute() {
+	const { agentId } = Route.useParams();
+	const { data: chat } = useSuspenseQuery(agentChatQueryOptions(agentId));
+	return /* @__PURE__ */ jsx(AgentSettingsPage, { initial: chat }, agentId);
+}
+//#endregion
+export { SettingsRoute as component };