@burdenoff/microfe-vibecontrols 2026.521.3 → 2026.522.2

package/dist/components/agent-manager/AgentManagerBookmarksDrawer.js

@@ -0,0 +1,174 @@
+import { useTr as e } from "../../shared/hooks/useTr.js";
+import { useDeleteAgentMessageBookmarkMutation as t, useMyAgentMessageBookmarksQuery as n, useUpdateAgentMessageBookmarkMutation as r } from "../../generated/wspace-operations.js";
+import { relativeTime as i } from "../../utils/relativeTime.js";
+import { useState as a } from "react";
+import { Bookmark as o, Check as s, ChevronRight as c, ExternalLink as l, Pencil as u, Trash2 as d, X as f } from "lucide-react";
+import { useNavigate as p } from "react-router-dom";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/components/agent-manager/AgentManagerBookmarksDrawer.tsx
+var g = 80;
+function _(e) {
+	if (!e) return "";
+	let t = e.trim().replace(/\s+/g, " ");
+	return t.length > g ? `${t.slice(0, g)}…` : t;
+}
+var v = ({ open: g, onClose: v, sessionId: y, messages: b, onJump: x }) => {
+	let S = p(), C = e(), [w, T] = a(null), [E, D] = a(""), { data: O, loading: k } = n({
+		variables: { filter: { sessionId: y } },
+		skip: !g,
+		fetchPolicy: "cache-and-network"
+	}), [A] = r({ refetchQueries: ["MyAgentMessageBookmarks"] }), [j] = t({ refetchQueries: ["MyAgentMessageBookmarks"] }), M = O?.myAgentMessageBookmarks.items ?? [], N = new Map(b.map((e) => [e.id, e])), P = (e, t) => {
+		T(e), D(t ?? "");
+	}, F = async (e) => {
+		await A({ variables: {
+			id: e,
+			input: { label: E || null }
+		} }), T(null), D("");
+	}, I = async (e) => {
+		await j({ variables: { id: e } });
+	};
+	return g ? /* @__PURE__ */ h("div", {
+		className: "fixed inset-0 z-40 flex",
+		children: [/* @__PURE__ */ m("div", {
+			className: "flex-1 bg-bg-overlay/40",
+			onClick: v,
+			"aria-hidden": !0
+		}), /* @__PURE__ */ h("aside", {
+			className: "w-full max-w-md h-full bg-bg-surface border-l border-border-default shadow-xl flex flex-col",
+			role: "dialog",
+			"aria-label": C("vibecontrols.agentManager.bookmarksDrawer.title", "Bookmarks in this session"),
+			"data-testid": "agent-manager-bookmarks-drawer",
+			children: [
+				/* @__PURE__ */ h("header", {
+					className: "flex items-center justify-between px-4 py-3 border-b border-border-default flex-shrink-0",
+					children: [/* @__PURE__ */ h("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ m(o, { className: "w-4 h-4 text-text-secondary" }), /* @__PURE__ */ m("h3", {
+							className: "text-sm font-semibold text-text-primary",
+							children: C("vibecontrols.agentManager.bookmarksDrawer.title", "Bookmarks in this session")
+						})]
+					}), /* @__PURE__ */ m("button", {
+						type: "button",
+						onClick: v,
+						className: "p-1 rounded hover:bg-bg-sunken transition-colors",
+						"aria-label": C("vibecontrols.common.close", "Close"),
+						children: /* @__PURE__ */ m(f, { className: "w-4 h-4 text-text-secondary" })
+					})]
+				}),
+				/* @__PURE__ */ h("div", {
+					className: "flex-1 min-h-0 overflow-y-auto",
+					children: [
+						k && M.length === 0 && /* @__PURE__ */ m("div", {
+							className: "px-4 py-6 text-xs text-text-tertiary",
+							children: C("vibecontrols.common.loading", "Loading...")
+						}),
+						!k && M.length === 0 && /* @__PURE__ */ h("div", {
+							className: "px-4 py-10 flex flex-col items-center text-center gap-2",
+							children: [
+								/* @__PURE__ */ m(o, { className: "w-8 h-8 text-text-muted" }),
+								/* @__PURE__ */ m("p", {
+									className: "text-sm font-medium text-text-primary",
+									children: C("vibecontrols.agentManager.bookmarksDrawer.empty", "No bookmarks in this session yet")
+								}),
+								/* @__PURE__ */ m("p", {
+									className: "text-xs text-text-secondary max-w-xs",
+									children: C("vibecontrols.agentManager.bookmarksDrawer.emptyHint", "Click the bookmark icon on any message to save it for later.")
+								})
+							]
+						}),
+						/* @__PURE__ */ m("ul", {
+							className: "divide-y divide-border-subtle",
+							children: M.map((e) => {
+								let t = N.get(e.messageId), n = !t, r = w === e.id;
+								return /* @__PURE__ */ m("li", {
+									className: "px-4 py-3 hover:bg-bg-elevated/40 transition-colors",
+									children: /* @__PURE__ */ h("div", {
+										className: "flex items-start gap-2",
+										children: [/* @__PURE__ */ h("div", {
+											className: "flex-1 min-w-0",
+											children: [
+												r ? /* @__PURE__ */ m("input", {
+													autoFocus: !0,
+													value: E,
+													onChange: (e) => D(e.target.value),
+													onKeyDown: (t) => {
+														t.key === "Enter" && F(e.id), t.key === "Escape" && (T(null), D(""));
+													},
+													placeholder: C("vibecontrols.agentManager.bookmarksDrawer.labelPlaceholder", "Add a label (optional)"),
+													className: "w-full bg-bg-sunken border border-border-subtle rounded px-2 py-1 text-xs text-text-primary placeholder:text-text-tertiary focus:outline-none focus:border-action-primary-bg"
+												}) : /* @__PURE__ */ m("p", {
+													className: "text-sm font-medium text-text-primary truncate",
+													children: e.label || (t?.role === "user" ? C("vibecontrols.agentManager.bookmarksDrawer.fromUser", "From you") : C("vibecontrols.agentManager.bookmarksDrawer.fromAssistant", "Assistant reply"))
+												}),
+												n ? /* @__PURE__ */ m("p", {
+													className: "text-xs text-text-tertiary italic mt-1",
+													children: C("vibecontrols.agentManager.bookmarksDrawer.stale", "Message no longer available")
+												}) : /* @__PURE__ */ m("p", {
+													className: "text-xs text-text-secondary mt-1 line-clamp-2",
+													children: _(t.content)
+												}),
+												/* @__PURE__ */ m("p", {
+													className: "text-[10px] text-text-tertiary mt-1",
+													children: i(e.createdAt)
+												})
+											]
+										}), /* @__PURE__ */ h("div", {
+											className: "flex items-center gap-0.5 shrink-0",
+											children: [
+												!n && !r && /* @__PURE__ */ m("button", {
+													type: "button",
+													onClick: () => {
+														x(e.messageId), v();
+													},
+													className: "p-1 rounded hover:bg-bg-sunken transition-colors",
+													title: C("vibecontrols.agentManager.bookmarksDrawer.jump", "Jump to message"),
+													"aria-label": C("vibecontrols.agentManager.bookmarksDrawer.jump", "Jump to message"),
+													children: /* @__PURE__ */ m(c, { className: "w-3.5 h-3.5 text-text-secondary" })
+												}),
+												r ? /* @__PURE__ */ m("button", {
+													type: "button",
+													onClick: () => void F(e.id),
+													className: "p-1 rounded hover:bg-bg-sunken transition-colors",
+													"aria-label": C("vibecontrols.common.save", "Save"),
+													children: /* @__PURE__ */ m(s, { className: "w-3.5 h-3.5 text-status-success-text" })
+												}) : /* @__PURE__ */ m("button", {
+													type: "button",
+													onClick: () => P(e.id, e.label),
+													className: "p-1 rounded hover:bg-bg-sunken transition-colors",
+													"aria-label": C("vibecontrols.agentManager.bookmarksDrawer.editLabel", "Edit label"),
+													children: /* @__PURE__ */ m(u, { className: "w-3.5 h-3.5 text-text-secondary" })
+												}),
+												/* @__PURE__ */ m("button", {
+													type: "button",
+													onClick: () => void I(e.id),
+													className: "p-1 rounded hover:bg-bg-sunken transition-colors",
+													"aria-label": C("vibecontrols.agentManager.messageItem.removeBookmark", "Remove bookmark"),
+													children: /* @__PURE__ */ m(d, { className: "w-3.5 h-3.5 text-status-danger-text" })
+												})
+											]
+										})]
+									})
+								}, e.id);
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ m("footer", {
+					className: "px-4 py-3 border-t border-border-default flex-shrink-0",
+					children: /* @__PURE__ */ h("button", {
+						type: "button",
+						onClick: () => {
+							v(), S("/vibecontrols/ai/bookmarks");
+						},
+						className: "inline-flex items-center gap-1.5 text-xs font-medium text-action-primary-text hover:underline",
+						children: [/* @__PURE__ */ m(l, { className: "w-3 h-3" }), C("vibecontrols.agentManager.bookmarksDrawer.seeAll", "See all bookmarks across sessions")]
+					})
+				})
+			]
+		})]
+	}) : null;
+};
+//#endregion
+export { v as AgentManagerBookmarksDrawer };
+
+//# sourceMappingURL=AgentManagerBookmarksDrawer.js.map

package/dist/components/agent-manager/AgentManagerBookmarksDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgentManagerBookmarksDrawer.js","names":[],"sources":["../../../src/components/agent-manager/AgentManagerBookmarksDrawer.tsx"],"sourcesContent":["/**\n * Side drawer listing the current user's bookmarks for ONE chat session.\n *\n * Each row resolves its message body from the currently-loaded session\n * messages. When the bookmarked message is no longer in the session\n * (agent log pruning / rotation), the row degrades to a \"Message no\n * longer available\" affordance with a remove-only action.\n */\n\nimport { useState, type FC } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport { Bookmark, X, ChevronRight, Pencil, Trash2, Check, ExternalLink } from 'lucide-react';\nimport { relativeTime } from '@/utils/relativeTime';\nimport {\n  useDeleteAgentMessageBookmarkMutation,\n  useMyAgentMessageBookmarksQuery,\n  useUpdateAgentMessageBookmarkMutation,\n  type AgentMessageBookmarkFieldsFragment,\n} from '../../generated/wspace-operations';\nimport type { AgentManagerMessage } from '@/types/agentManager';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface AgentManagerBookmarksDrawerProps {\n  open: boolean;\n  onClose: () => void;\n  sessionId: string;\n  messages: AgentManagerMessage[];\n  onJump: (messageId: string) => void;\n}\n\nconst PREVIEW_LEN = 80;\n\nfunction snippet(content: string): string {\n  if (!content) return '';\n  const trimmed = content.trim().replace(/\\s+/g, ' ');\n  return trimmed.length > PREVIEW_LEN ? `${trimmed.slice(0, PREVIEW_LEN)}…` : trimmed;\n}\n\nexport const AgentManagerBookmarksDrawer: FC<AgentManagerBookmarksDrawerProps> = ({\n  open,\n  onClose,\n  sessionId,\n  messages,\n  onJump,\n}) => {\n  const navigate = useNavigate();\n  const tr = useTr();\n  const [editingId, setEditingId] = useState<string | null>(null);\n  const [labelDraft, setLabelDraft] = useState('');\n\n  const { data, loading } = useMyAgentMessageBookmarksQuery({\n    variables: { filter: { sessionId } },\n    skip: !open,\n    fetchPolicy: 'cache-and-network',\n  });\n\n  const [updateMutation] = useUpdateAgentMessageBookmarkMutation({\n    refetchQueries: ['MyAgentMessageBookmarks'],\n  });\n  const [deleteMutation] = useDeleteAgentMessageBookmarkMutation({\n    refetchQueries: ['MyAgentMessageBookmarks'],\n  });\n\n  const bookmarks = data?.myAgentMessageBookmarks.items ?? [];\n  const messageById = new Map(messages.map((m) => [m.id, m]));\n\n  const startEdit = (id: string, current: string | null | undefined) => {\n    setEditingId(id);\n    setLabelDraft(current ?? '');\n  };\n\n  const saveEdit = async (id: string) => {\n    await updateMutation({ variables: { id, input: { label: labelDraft || null } } });\n    setEditingId(null);\n    setLabelDraft('');\n  };\n\n  const removeBookmark = async (id: string) => {\n    await deleteMutation({ variables: { id } });\n  };\n\n  if (!open) return null;\n\n  return (\n    <div className=\"fixed inset-0 z-40 flex\">\n      <div className=\"flex-1 bg-bg-overlay/40\" onClick={onClose} aria-hidden />\n      <aside\n        className=\"w-full max-w-md h-full bg-bg-surface border-l border-border-default shadow-xl flex flex-col\"\n        role=\"dialog\"\n        aria-label={tr(\n          'vibecontrols.agentManager.bookmarksDrawer.title',\n          'Bookmarks in this session'\n        )}\n        data-testid=\"agent-manager-bookmarks-drawer\"\n      >\n        <header className=\"flex items-center justify-between px-4 py-3 border-b border-border-default flex-shrink-0\">\n          <div className=\"flex items-center gap-2\">\n            <Bookmark className=\"w-4 h-4 text-text-secondary\" />\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              {tr('vibecontrols.agentManager.bookmarksDrawer.title', 'Bookmarks in this session')}\n            </h3>\n          </div>\n          <button\n            type=\"button\"\n            onClick={onClose}\n            className=\"p-1 rounded hover:bg-bg-sunken transition-colors\"\n            aria-label={tr('vibecontrols.common.close', 'Close')}\n          >\n            <X className=\"w-4 h-4 text-text-secondary\" />\n          </button>\n        </header>\n\n        <div className=\"flex-1 min-h-0 overflow-y-auto\">\n          {loading && bookmarks.length === 0 && (\n            <div className=\"px-4 py-6 text-xs text-text-tertiary\">\n              {tr('vibecontrols.common.loading', 'Loading...')}\n            </div>\n          )}\n\n          {!loading && bookmarks.length === 0 && (\n            <div className=\"px-4 py-10 flex flex-col items-center text-center gap-2\">\n              <Bookmark className=\"w-8 h-8 text-text-muted\" />\n              <p className=\"text-sm font-medium text-text-primary\">\n                {tr(\n                  'vibecontrols.agentManager.bookmarksDrawer.empty',\n                  'No bookmarks in this session yet'\n                )}\n              </p>\n              <p className=\"text-xs text-text-secondary max-w-xs\">\n                {tr(\n                  'vibecontrols.agentManager.bookmarksDrawer.emptyHint',\n                  'Click the bookmark icon on any message to save it for later.'\n                )}\n              </p>\n            </div>\n          )}\n\n          <ul className=\"divide-y divide-border-subtle\">\n            {bookmarks.map((bm: AgentMessageBookmarkFieldsFragment) => {\n              const msg = messageById.get(bm.messageId);\n              const isStale = !msg;\n              const isEditing = editingId === bm.id;\n\n              return (\n                <li key={bm.id} className=\"px-4 py-3 hover:bg-bg-elevated/40 transition-colors\">\n                  <div className=\"flex items-start gap-2\">\n                    <div className=\"flex-1 min-w-0\">\n                      {isEditing ? (\n                        <input\n                          autoFocus\n                          value={labelDraft}\n                          onChange={(e) => setLabelDraft(e.target.value)}\n                          onKeyDown={(e) => {\n                            if (e.key === 'Enter') void saveEdit(bm.id);\n                            if (e.key === 'Escape') {\n                              setEditingId(null);\n                              setLabelDraft('');\n                            }\n                          }}\n                          placeholder={tr(\n                            'vibecontrols.agentManager.bookmarksDrawer.labelPlaceholder',\n                            'Add a label (optional)'\n                          )}\n                          className=\"w-full bg-bg-sunken border border-border-subtle rounded px-2 py-1 text-xs text-text-primary placeholder:text-text-tertiary focus:outline-none focus:border-action-primary-bg\"\n                        />\n                      ) : (\n                        <p className=\"text-sm font-medium text-text-primary truncate\">\n                          {bm.label ||\n                            (msg?.role === 'user'\n                              ? tr('vibecontrols.agentManager.bookmarksDrawer.fromUser', 'From you')\n                              : tr(\n                                  'vibecontrols.agentManager.bookmarksDrawer.fromAssistant',\n                                  'Assistant reply'\n                                ))}\n                        </p>\n                      )}\n\n                      {isStale ? (\n                        <p className=\"text-xs text-text-tertiary italic mt-1\">\n                          {tr(\n                            'vibecontrols.agentManager.bookmarksDrawer.stale',\n                            'Message no longer available'\n                          )}\n                        </p>\n                      ) : (\n                        <p className=\"text-xs text-text-secondary mt-1 line-clamp-2\">\n                          {snippet(msg.content)}\n                        </p>\n                      )}\n\n                      <p className=\"text-[10px] text-text-tertiary mt-1\">\n                        {relativeTime(bm.createdAt)}\n                      </p>\n                    </div>\n\n                    <div className=\"flex items-center gap-0.5 shrink-0\">\n                      {!isStale && !isEditing && (\n                        <button\n                          type=\"button\"\n                          onClick={() => {\n                            onJump(bm.messageId);\n                            onClose();\n                          }}\n                          className=\"p-1 rounded hover:bg-bg-sunken transition-colors\"\n                          title={tr(\n                            'vibecontrols.agentManager.bookmarksDrawer.jump',\n                            'Jump to message'\n                          )}\n                          aria-label={tr(\n                            'vibecontrols.agentManager.bookmarksDrawer.jump',\n                            'Jump to message'\n                          )}\n                        >\n                          <ChevronRight className=\"w-3.5 h-3.5 text-text-secondary\" />\n                        </button>\n                      )}\n\n                      {isEditing ? (\n                        <button\n                          type=\"button\"\n                          onClick={() => void saveEdit(bm.id)}\n                          className=\"p-1 rounded hover:bg-bg-sunken transition-colors\"\n                          aria-label={tr('vibecontrols.common.save', 'Save')}\n                        >\n                          <Check className=\"w-3.5 h-3.5 text-status-success-text\" />\n                        </button>\n                      ) : (\n                        <button\n                          type=\"button\"\n                          onClick={() => startEdit(bm.id, bm.label)}\n                          className=\"p-1 rounded hover:bg-bg-sunken transition-colors\"\n                          aria-label={tr(\n                            'vibecontrols.agentManager.bookmarksDrawer.editLabel',\n                            'Edit label'\n                          )}\n                        >\n                          <Pencil className=\"w-3.5 h-3.5 text-text-secondary\" />\n                        </button>\n                      )}\n\n                      <button\n                        type=\"button\"\n                        onClick={() => void removeBookmark(bm.id)}\n                        className=\"p-1 rounded hover:bg-bg-sunken transition-colors\"\n                        aria-label={tr(\n                          'vibecontrols.agentManager.messageItem.removeBookmark',\n                          'Remove bookmark'\n                        )}\n                      >\n                        <Trash2 className=\"w-3.5 h-3.5 text-status-danger-text\" />\n                      </button>\n                    </div>\n                  </div>\n                </li>\n              );\n            })}\n          </ul>\n        </div>\n\n        <footer className=\"px-4 py-3 border-t border-border-default flex-shrink-0\">\n          <button\n            type=\"button\"\n            onClick={() => {\n              onClose();\n              navigate('/vibecontrols/ai/bookmarks');\n            }}\n            className=\"inline-flex items-center gap-1.5 text-xs font-medium text-action-primary-text hover:underline\"\n          >\n            <ExternalLink className=\"w-3 h-3\" />\n            {tr(\n              'vibecontrols.agentManager.bookmarksDrawer.seeAll',\n              'See all bookmarks across sessions'\n            )}\n          </button>\n        </footer>\n      </aside>\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/components/agent-manager/AgentManagerChatPane.js

@@ -4,31 +4,52 @@ import { useActiveAgentProfile as n } from "../../hooks/useActiveAgentProfile.js
 import { fetchSessionLogs as r } from "../../services/aiApi.js";
 import { useAgentManagerStore as i } from "../../store/agentManagerStore.js";
 import { useAgentManagerStreaming as a } from "../../hooks/useAgentManagerStreaming.js";
-import { AgentManagerMessageList as o } from "./AgentManagerMessageList.js";
-import { AgentManagerInputArea as s } from "./AgentManagerInputArea.js";
-import { PluginInstallModal as c } from "./PluginInstallModal.js";
-import { AIProviderCredentialsCard as l } from "../ai/AIProviderCredentialsCard.js";
-import { useCallback as u, useEffect as d, useMemo as f, useState as p } from "react";
-import { PackagePlus as m, Search as h, X as g } from "lucide-react";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { useToggleAgentBookmark as o } from "../../hooks/useToggleAgentBookmark.js";
+import { AgentManagerMessageList as s } from "./AgentManagerMessageList.js";
+import { AgentManagerInputArea as c } from "./AgentManagerInputArea.js";
+import { AgentManagerBookmarksDrawer as l } from "./AgentManagerBookmarksDrawer.js";
+import { PluginInstallModal as ee } from "./PluginInstallModal.js";
+import { AIProviderCredentialsCard as u } from "../ai/AIProviderCredentialsCard.js";
+import { useCallback as d, useEffect as f, useMemo as p, useRef as m, useState as h } from "react";
+import { Bookmark as g, PackagePlus as _, Search as v, X as y } from "lucide-react";
+import { useSearchParams as b } from "react-router-dom";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
 //#region src/components/agent-manager/AgentManagerChatPane.tsx
-var y = ({ sessionId: l, agentId: y }) => {
-	let [x, S] = p(!1), [C, w] = p(!1), [T, E] = p(""), [D, O] = p(!1), k = e(), { agents: A } = t(), j = f(() => A.find((e) => e.id === y) ?? null, [A, y]), M = i((e) => e.sessionStates[l]), N = i((e) => e.addMessage), P = M?.messages ?? [], { active: F } = n(j?.id ?? null), I = f(() => ({
-		id: y,
-		profile: F
-	}), [y, F]), { sendMessage: L, cancelStream: R, isStreaming: z } = a({
-		agent: I,
-		sessionId: l
-	}), B = u(() => {
-		w((e) => (e && E(""), !e));
+var C = ({ sessionId: u, agentId: C }) => {
+	let [T, E] = h(!1), [D, te] = h(!1), [O, k] = h(""), [A, j] = h(!1), [M, N] = h(!1), [P, F] = h(null), [I, L] = b(), R = I.get("messageId"), z = m(null), B = e(), { agents: V } = t(), H = p(() => V.find((e) => e.id === C) ?? null, [V, C]), U = i((e) => e.sessionStates[u]), W = i((e) => e.addMessage), G = p(() => U?.messages ?? [], [U?.messages]), { active: K } = n(H?.id ?? null), q = p(() => ({
+		id: C,
+		profile: K
+	}), [C, K]), { sendMessage: J, cancelStream: Y, isStreaming: X } = a({
+		agent: q,
+		sessionId: u
+	}), { bookmarkedIds: Z, toggle: Q } = o(u), $ = d((e) => {
+		let t = document.querySelector(`[data-message-id="${e}"]`);
+		t && (t.scrollIntoView({
+			behavior: "smooth",
+			block: "center"
+		}), F(e), window.setTimeout(() => {
+			F((t) => t === e ? null : t);
+		}, 1500));
+	}, []), ne = d((e) => {
+		Q({
+			agentId: C,
+			sessionId: u,
+			messageId: e
+		});
+	}, [
+		Q,
+		C,
+		u
+	]), re = d(() => {
+		te((e) => (e && k(""), !e));
 	}, []);
-	return d(() => {
+	return f(() => {
 		let e = !1;
 		return (async () => {
-			if (!(P.length > 0)) {
-				S(!0);
+			if (!(G.length > 0)) {
+				E(!0);
 				try {
-					let t = await r(I, l, { types: ["input", "output"] });
+					let t = await r(q, u, { types: ["input", "output"] });
 					if (e || t.length === 0) return;
 					let n = /* @__PURE__ */ new Set();
 					for (let e of t) {
@@ -38,7 +59,7 @@ var y = ({ sessionId: l, agentId: y }) => {
 							e.model ?? "",
 							i
 						].join("\0");
-						n.has(a) || (n.add(a), N(l, {
+						n.has(a) || (n.add(a), W(u, {
 							id: e.id,
 							role: e.type === "input" ? "user" : "assistant",
 							content: t,
@@ -51,116 +72,150 @@ var y = ({ sessionId: l, agentId: y }) => {
 						}));
 					}
 				} catch {} finally {
-					e || S(!1);
+					e || E(!1);
 				}
 			}
 		})(), () => {
 			e = !0;
 		};
-	}, [y, l]), /* @__PURE__ */ v("div", {
+	}, [C, u]), f(() => {
+		if (!R || T || z.current === R || !G.some((e) => e.id === R)) return;
+		z.current = R, $(R);
+		let e = new URLSearchParams(I);
+		e.delete("messageId"), L(e, { replace: !0 });
+	}, [
+		R,
+		T,
+		G,
+		$,
+		I,
+		L
+	]), /* @__PURE__ */ S("div", {
 		className: "flex flex-col h-full min-h-0",
 		"data-testid": "agent-manager-chat-pane",
 		children: [
-			/* @__PURE__ */ v("div", {
+			/* @__PURE__ */ S("div", {
 				className: "flex items-center gap-1 px-3 py-1 border-b border-border-default bg-bg-surface flex-shrink-0",
-				children: [/* @__PURE__ */ v("div", {
-					className: "flex items-center gap-1.5 min-w-0 flex-1",
-					children: [/* @__PURE__ */ _("button", {
-						type: "button",
-						onClick: B,
-						className: `p-1 rounded transition-colors shrink-0 ${C ? "bg-action-primary-bg/10 text-action-primary-text" : "text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated"}`,
-						title: k("vibecontrols.agentManager.chatPane.searchInSession", "Search in session (Ctrl+F)"),
-						"aria-label": k("vibecontrols.agentManager.chatPane.searchInSession", "Search in session"),
-						children: /* @__PURE__ */ _(h, { className: "w-3.5 h-3.5" })
-					}), C && /* @__PURE__ */ v("div", {
-						className: "flex items-center gap-1.5 flex-1 min-w-0",
-						children: [/* @__PURE__ */ _("input", {
-							type: "text",
-							value: T,
-							onChange: (e) => E(e.target.value),
-							placeholder: k("vibecontrols.agentManager.chatPane.searchPlaceholder", "Search in conversation..."),
-							autoFocus: !0,
-							className: "flex-1 min-w-0 bg-transparent text-xs text-text-primary placeholder:text-text-tertiary focus:outline-none"
-						}), T && /* @__PURE__ */ _("button", {
+				children: [
+					/* @__PURE__ */ S("div", {
+						className: "flex items-center gap-1.5 min-w-0 flex-1",
+						children: [/* @__PURE__ */ x("button", {
 							type: "button",
-							onClick: () => E(""),
-							className: "p-0.5 rounded hover:bg-bg-elevated transition-colors",
-							children: /* @__PURE__ */ _(g, { className: "w-3 h-3 text-text-tertiary" })
+							onClick: re,
+							className: `p-1 rounded transition-colors shrink-0 ${D ? "bg-action-primary-bg/10 text-action-primary-text" : "text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated"}`,
+							title: B("vibecontrols.agentManager.chatPane.searchInSession", "Search in session (Ctrl+F)"),
+							"aria-label": B("vibecontrols.agentManager.chatPane.searchInSession", "Search in session"),
+							children: /* @__PURE__ */ x(v, { className: "w-3.5 h-3.5" })
+						}), D && /* @__PURE__ */ S("div", {
+							className: "flex items-center gap-1.5 flex-1 min-w-0",
+							children: [/* @__PURE__ */ x("input", {
+								type: "text",
+								value: O,
+								onChange: (e) => k(e.target.value),
+								placeholder: B("vibecontrols.agentManager.chatPane.searchPlaceholder", "Search in conversation..."),
+								autoFocus: !0,
+								className: "flex-1 min-w-0 bg-transparent text-xs text-text-primary placeholder:text-text-tertiary focus:outline-none"
+							}), O && /* @__PURE__ */ x("button", {
+								type: "button",
+								onClick: () => k(""),
+								className: "p-0.5 rounded hover:bg-bg-elevated transition-colors",
+								children: /* @__PURE__ */ x(y, { className: "w-3 h-3 text-text-tertiary" })
+							})]
 						})]
-					})]
-				}), /* @__PURE__ */ v("button", {
-					type: "button",
-					onClick: () => O(!0),
-					className: "shrink-0 inline-flex items-center gap-1.5 rounded-md border border-border-default bg-bg-elevated px-2 py-1 text-xs font-medium text-text-primary transition-colors hover:bg-bg-sunken hover:border-action-primary-bg/40",
-					title: k("vibecontrols.agentManager.chatPane.manageProvidersTooltip", "Install or remove AI providers (Claude, Codex, Gemini, OpenCode)"),
-					"aria-label": k("vibecontrols.agentManager.chatPane.manageProviders", "Manage AI providers"),
-					"data-testid": "agent-manager-manage-providers",
-					children: [/* @__PURE__ */ _(m, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ _("span", {
-						className: "hidden sm:inline",
-						children: k("vibecontrols.agentManager.chatPane.manageProviders", "Manage AI providers")
-					})]
-				})]
+					}),
+					/* @__PURE__ */ x("button", {
+						type: "button",
+						onClick: () => N(!0),
+						className: "shrink-0 p-1 rounded transition-colors text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated",
+						title: B("vibecontrols.agentManager.chatPane.bookmarksTooltip", "View bookmarked messages"),
+						"aria-label": B("vibecontrols.agentManager.chatPane.bookmarksLabel", "Bookmarks"),
+						"data-testid": "agent-manager-bookmarks-trigger",
+						children: /* @__PURE__ */ x(g, { className: "w-3.5 h-3.5" })
+					}),
+					/* @__PURE__ */ S("button", {
+						type: "button",
+						onClick: () => j(!0),
+						className: "shrink-0 inline-flex items-center gap-1.5 rounded-md border border-border-default bg-bg-elevated px-2 py-1 text-xs font-medium text-text-primary transition-colors hover:bg-bg-sunken hover:border-action-primary-bg/40",
+						title: B("vibecontrols.agentManager.chatPane.manageProvidersTooltip", "Install or remove AI providers (Claude, Codex, Gemini, OpenCode)"),
+						"aria-label": B("vibecontrols.agentManager.chatPane.manageProviders", "Manage AI providers"),
+						"data-testid": "agent-manager-manage-providers",
+						children: [/* @__PURE__ */ x(_, { className: "w-3.5 h-3.5" }), /* @__PURE__ */ x("span", {
+							className: "hidden sm:inline",
+							children: B("vibecontrols.agentManager.chatPane.manageProviders", "Manage AI providers")
+						})]
+					})
+				]
 			}),
-			x ? /* @__PURE__ */ _("div", {
+			T ? /* @__PURE__ */ x("div", {
 				className: "flex-1 flex items-center justify-center",
-				children: /* @__PURE__ */ _("p", {
+				children: /* @__PURE__ */ x("p", {
 					className: "text-sm text-text-secondary",
-					children: k("vibecontrols.agentManager.chatPane.loadingConversation", "Loading conversation...")
+					children: B("vibecontrols.agentManager.chatPane.loadingConversation", "Loading conversation...")
 				})
-			}) : /* @__PURE__ */ _(o, {
-				messages: P,
-				isStreaming: z,
-				onCancelStream: R,
-				searchQuery: T
+			}) : /* @__PURE__ */ x(s, {
+				messages: G,
+				isStreaming: X,
+				onCancelStream: Y,
+				searchQuery: O,
+				bookmarkedIds: Z,
+				onToggleBookmark: ne,
+				flashMessageId: P
+			}),
+			/* @__PURE__ */ x(c, {
+				agentId: C,
+				sessionId: u,
+				onSend: (e) => void J(e),
+				onCancel: Y,
+				agentTunnelUrl: H?.tunnelUrl ?? void 0,
+				agentApiKey: H?.agentApiKey ?? void 0
 			}),
-			/* @__PURE__ */ _(s, {
-				agentId: y,
-				sessionId: l,
-				onSend: (e) => void L(e),
-				onCancel: R,
-				agentTunnelUrl: j?.tunnelUrl ?? void 0,
-				agentApiKey: j?.agentApiKey ?? void 0
+			/* @__PURE__ */ x(l, {
+				open: M,
+				onClose: () => N(!1),
+				sessionId: u,
+				messages: G,
+				onJump: $
 			}),
-			/* @__PURE__ */ _(c, {
-				open: D,
-				agentId: y,
-				onClose: () => O(!1)
+			/* @__PURE__ */ x(ee, {
+				open: A,
+				agentId: C,
+				onClose: () => j(!1)
 			}),
-			/* @__PURE__ */ _(b, {
-				agentId: y,
-				agentRef: I,
-				initialProviderId: M?.sdk ?? void 0
+			/* @__PURE__ */ x(w, {
+				agentId: C,
+				agentRef: q,
+				initialProviderId: U?.sdk ?? void 0
 			})
 		]
 	});
-}, b = ({ agentId: t, agentRef: n, initialProviderId: r }) => {
+}, w = ({ agentId: t, agentRef: n, initialProviderId: r }) => {
 	let a = i((e) => e.sdkAuthPrompt), o = i((e) => e.setSdkAuthPrompt), s = e();
-	return !a || a.agentId !== t ? null : /* @__PURE__ */ v("div", {
+	return !a || a.agentId !== t ? null : /* @__PURE__ */ S("div", {
 		className: "fixed inset-0 z-50 flex items-center justify-center p-4",
-		children: [/* @__PURE__ */ _("div", {
+		children: [/* @__PURE__ */ x("div", {
 			className: "absolute inset-0 bg-bg-overlay",
 			onClick: () => o(null),
 			"aria-hidden": !0
-		}), /* @__PURE__ */ v("div", {
+		}), /* @__PURE__ */ S("div", {
 			className: "relative w-full max-w-xl max-h-[85vh] flex flex-col rounded-lg border border-border-default bg-bg-surface shadow-xl overflow-hidden",
-			children: [/* @__PURE__ */ v("div", {
+			children: [/* @__PURE__ */ S("div", {
 				className: "flex items-center justify-between px-4 py-3 border-b border-border-default bg-bg-surface flex-shrink-0",
-				children: [/* @__PURE__ */ _("h3", {
+				children: [/* @__PURE__ */ x("h3", {
 					className: "text-base font-semibold text-text-primary truncate pr-2",
 					children: s("vibecontrols.ai.sdkAuth.title", "Configure AI provider credentials")
-				}), /* @__PURE__ */ _("button", {
+				}), /* @__PURE__ */ x("button", {
 					type: "button",
 					onClick: () => o(null),
 					className: "p-1 rounded hover:bg-bg-sunken transition-colors flex-shrink-0",
 					"aria-label": s("vibecontrols.common.close", "Close"),
-					children: /* @__PURE__ */ _(g, { className: "w-5 h-5 text-text-secondary" })
+					children: /* @__PURE__ */ x(y, { className: "w-5 h-5 text-text-secondary" })
 				})]
-			}), /* @__PURE__ */ v("div", {
+			}), /* @__PURE__ */ S("div", {
 				className: "flex-1 min-h-0 overflow-y-auto px-4 py-3 space-y-3",
-				children: [/* @__PURE__ */ _("p", {
+				children: [/* @__PURE__ */ x("p", {
 					className: "text-sm text-text-secondary",
 					children: s("vibecontrols.ai.sdkAuth.body", "The agent does not have a credential configured for this provider. Pick a provider and save one to continue the conversation.")
-				}), /* @__PURE__ */ _(l, {
+				}), /* @__PURE__ */ x(u, {
 					agent: n,
 					initialProviderId: r
 				})]
@@ -169,6 +224,6 @@ var y = ({ sessionId: l, agentId: y }) => {
 	});
 };
 //#endregion
-export { y as AgentManagerChatPane };
+export { C as AgentManagerChatPane };
 
 //# sourceMappingURL=AgentManagerChatPane.js.map

package/dist/components/agent-manager/AgentManagerChatPane.js.map

@@ -1 +1 @@
-{"version":3,"file":"AgentManagerChatPane.js","names":[],"sources":["../../../src/components/agent-manager/AgentManagerChatPane.tsx"],"sourcesContent":["/**\n * Main chat interface for a single Agent Manager session.\n *\n * Renders message list + input area, manages the send/receive flow,\n * fetches existing conversation logs on mount, and provides\n * auto-scroll, cancel, and in-session search support.\n */\n\nimport { useEffect, useState, useCallback, useMemo, type FC } from 'react';\nimport { PackagePlus, Search, X } from 'lucide-react';\nimport { useAgentManagerStore } from '@/store/agentManagerStore';\nimport { useAgentManagerStreaming } from '@/hooks/useAgentManagerStreaming';\nimport { useCachedInitialData } from '@/hooks/useCachedInitialData';\nimport { fetchSessionLogs } from '@/services/aiApi';\nimport { useActiveAgentProfile } from '@/hooks/useActiveAgentProfile';\nimport { AgentManagerMessageList } from './AgentManagerMessageList';\nimport { AgentManagerInputArea } from './AgentManagerInputArea';\nimport { PluginInstallModal } from './PluginInstallModal';\nimport { AIProviderCredentialsCard } from '@/components/ai/AIProviderCredentialsCard';\nimport type { AgentManagerMessage } from '@/types/agentManager';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface AgentManagerChatPaneProps {\n  sessionId: string;\n  agentId: string;\n}\n\nexport const AgentManagerChatPane: FC<AgentManagerChatPaneProps> = ({ sessionId, agentId }) => {\n  const [loadingLogs, setLoadingLogs] = useState(false);\n  const [searchOpen, setSearchOpen] = useState(false);\n  const [searchQuery, setSearchQuery] = useState('');\n  // Provider-install modal triggered from the header. Lets users add a\n  // claude/codex/gemini/opencode plugin without leaving the conversation.\n  const [installModalOpen, setInstallModalOpen] = useState(false);\n  const tr = useTr();\n\n  const { agents } = useCachedInitialData();\n  const activeAgent = useMemo(\n    () => agents.find((a) => a.id === agentId) ?? null,\n    [agents, agentId]\n  );\n\n  const sessionState = useAgentManagerStore((s) => s.sessionStates[sessionId]);\n  const addMessage = useAgentManagerStore((s) => s.addMessage);\n\n  const messages = sessionState?.messages ?? [];\n\n  const { active: activeProfile } = useActiveAgentProfile(activeAgent?.id ?? null);\n  const agentRef = useMemo(\n    () => ({ id: agentId, profile: activeProfile }),\n    [agentId, activeProfile]\n  );\n\n  const { sendMessage, cancelStream, isStreaming } = useAgentManagerStreaming({\n    agent: agentRef,\n    sessionId,\n  });\n\n  const toggleSearch = useCallback(() => {\n    setSearchOpen((prev) => {\n      if (prev) setSearchQuery('');\n      return !prev;\n    });\n  }, []);\n\n  // Fetch existing conversation logs on mount\n  useEffect(() => {\n    let cancelled = false;\n\n    const loadExistingLogs = async () => {\n      // Only load if session has no messages yet\n      if (messages.length > 0) return;\n\n      setLoadingLogs(true);\n      try {\n        const logs = await fetchSessionLogs(agentRef, sessionId, {\n          types: ['input', 'output'],\n        });\n\n        if (cancelled || logs.length === 0) return;\n\n        const seenLogKeys = new Set<string>();\n\n        // Convert session logs to AgentManagerMessage format. The core AI\n        // route owns logging, but older provider builds also wrote the same\n        // input/output records; collapse same-second duplicates on restore.\n        for (const log of logs) {\n          const content = log.message || log.content || '';\n          const timestamp = log.timestamp || log.createdAt;\n          const timestampSecond = timestamp ? Math.floor(new Date(timestamp).getTime() / 1000) : 0;\n          const logKey = [log.type, content, log.model ?? '', timestampSecond].join('\\u0000');\n          if (seenLogKeys.has(logKey)) continue;\n          seenLogKeys.add(logKey);\n\n          const msg: AgentManagerMessage = {\n            id: log.id,\n            role: log.type === 'input' ? 'user' : 'assistant',\n            content,\n            timestamp,\n            tokens: log.tokenCount ? { input: 0, output: log.tokenCount } : undefined,\n            model: log.model,\n          };\n          addMessage(sessionId, msg);\n        }\n      } catch {\n        // Silent fail -- session may not have logs yet\n      } finally {\n        if (!cancelled) setLoadingLogs(false);\n      }\n    };\n\n    void loadExistingLogs();\n\n    return () => {\n      cancelled = true;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- only run on mount\n  }, [agentId, sessionId]);\n\n  return (\n    <div className=\"flex flex-col h-full min-h-0\" data-testid=\"agent-manager-chat-pane\">\n      {/* In-session search bar.\n          Layout: [search controls (flex-1)] ... [Manage AI providers].\n          The search input expands inside the LEFT cluster only, so the\n          Manage button stays anchored on the right and never shifts. */}\n      <div className=\"flex items-center gap-1 px-3 py-1 border-b border-border-default bg-bg-surface flex-shrink-0\">\n        <div className=\"flex items-center gap-1.5 min-w-0 flex-1\">\n          <button\n            type=\"button\"\n            onClick={toggleSearch}\n            className={`p-1 rounded transition-colors shrink-0 ${\n              searchOpen\n                ? 'bg-action-primary-bg/10 text-action-primary-text'\n                : 'text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated'\n            }`}\n            title={tr(\n              'vibecontrols.agentManager.chatPane.searchInSession',\n              'Search in session (Ctrl+F)'\n            )}\n            aria-label={tr(\n              'vibecontrols.agentManager.chatPane.searchInSession',\n              'Search in session'\n            )}\n          >\n            <Search className=\"w-3.5 h-3.5\" />\n          </button>\n          {searchOpen && (\n            <div className=\"flex items-center gap-1.5 flex-1 min-w-0\">\n              <input\n                type=\"text\"\n                value={searchQuery}\n                onChange={(e) => setSearchQuery(e.target.value)}\n                placeholder={tr(\n                  'vibecontrols.agentManager.chatPane.searchPlaceholder',\n                  'Search in conversation...'\n                )}\n                autoFocus\n                className=\"flex-1 min-w-0 bg-transparent text-xs text-text-primary placeholder:text-text-tertiary focus:outline-none\"\n              />\n              {searchQuery && (\n                <button\n                  type=\"button\"\n                  onClick={() => setSearchQuery('')}\n                  className=\"p-0.5 rounded hover:bg-bg-elevated transition-colors\"\n                >\n                  <X className=\"w-3 h-3 text-text-tertiary\" />\n                </button>\n              )}\n            </div>\n          )}\n        </div>\n        <button\n          type=\"button\"\n          onClick={() => setInstallModalOpen(true)}\n          className=\"shrink-0 inline-flex items-center gap-1.5 rounded-md border border-border-default bg-bg-elevated px-2 py-1 text-xs font-medium text-text-primary transition-colors hover:bg-bg-sunken hover:border-action-primary-bg/40\"\n          title={tr(\n            'vibecontrols.agentManager.chatPane.manageProvidersTooltip',\n            'Install or remove AI providers (Claude, Codex, Gemini, OpenCode)'\n          )}\n          aria-label={tr(\n            'vibecontrols.agentManager.chatPane.manageProviders',\n            'Manage AI providers'\n          )}\n          data-testid=\"agent-manager-manage-providers\"\n        >\n          <PackagePlus className=\"w-3.5 h-3.5\" />\n          <span className=\"hidden sm:inline\">\n            {tr('vibecontrols.agentManager.chatPane.manageProviders', 'Manage AI providers')}\n          </span>\n        </button>\n      </div>\n\n      {/* Message list */}\n      {loadingLogs ? (\n        <div className=\"flex-1 flex items-center justify-center\">\n          <p className=\"text-sm text-text-secondary\">\n            {tr(\n              'vibecontrols.agentManager.chatPane.loadingConversation',\n              'Loading conversation...'\n            )}\n          </p>\n        </div>\n      ) : (\n        <AgentManagerMessageList\n          messages={messages}\n          isStreaming={isStreaming}\n          onCancelStream={cancelStream}\n          searchQuery={searchQuery}\n        />\n      )}\n\n      {/* Rich input area with controls */}\n      <AgentManagerInputArea\n        agentId={agentId}\n        sessionId={sessionId}\n        onSend={(text) => void sendMessage(text)}\n        onCancel={cancelStream}\n        agentTunnelUrl={activeAgent?.tunnelUrl ?? undefined}\n        agentApiKey={activeAgent?.agentApiKey ?? undefined}\n      />\n\n      {/* Header-triggered provider install/remove. Sits below the chat\n          tree so it can render full-screen without disturbing layout. */}\n      <PluginInstallModal\n        open={installModalOpen}\n        agentId={agentId}\n        onClose={() => setInstallModalOpen(false)}\n      />\n\n      {/* SDK auth prompt: opens when the streaming hook detects a missing\n          ANTHROPIC_API_KEY / ANTHROPIC_AUTH_TOKEN, so the user can save the\n          credential inline instead of being told to go look elsewhere.\n          The session's currently-selected SDK is forwarded so the picker\n          can preselect the right provider. */}\n      <SdkAuthPromptModal\n        agentId={agentId}\n        agentRef={agentRef}\n        initialProviderId={sessionState?.sdk ?? undefined}\n      />\n    </div>\n  );\n};\n\ninterface SdkAuthPromptModalProps {\n  agentId: string;\n  agentRef: { id: string; profile: string };\n  initialProviderId?: string;\n}\n\nconst SdkAuthPromptModal: FC<SdkAuthPromptModalProps> = ({\n  agentId,\n  agentRef,\n  initialProviderId,\n}) => {\n  const sdkAuthPrompt = useAgentManagerStore((s) => s.sdkAuthPrompt);\n  const setSdkAuthPrompt = useAgentManagerStore((s) => s.setSdkAuthPrompt);\n  const tr = useTr();\n\n  if (!sdkAuthPrompt || sdkAuthPrompt.agentId !== agentId) return null;\n\n  return (\n    <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n      <div\n        className=\"absolute inset-0 bg-bg-overlay\"\n        onClick={() => setSdkAuthPrompt(null)}\n        aria-hidden\n      />\n      {/* Constrain height to the viewport and let the inner body scroll so the\n          modal never escapes the screen no matter how many providers/fields\n          render inside AIProviderCredentialsCard. The header stays sticky so\n          the close button is always reachable. */}\n      <div className=\"relative w-full max-w-xl max-h-[85vh] flex flex-col rounded-lg border border-border-default bg-bg-surface shadow-xl overflow-hidden\">\n        <div className=\"flex items-center justify-between px-4 py-3 border-b border-border-default bg-bg-surface flex-shrink-0\">\n          <h3 className=\"text-base font-semibold text-text-primary truncate pr-2\">\n            {tr('vibecontrols.ai.sdkAuth.title', 'Configure AI provider credentials')}\n          </h3>\n          <button\n            type=\"button\"\n            onClick={() => setSdkAuthPrompt(null)}\n            className=\"p-1 rounded hover:bg-bg-sunken transition-colors flex-shrink-0\"\n            aria-label={tr('vibecontrols.common.close', 'Close')}\n          >\n            <X className=\"w-5 h-5 text-text-secondary\" />\n          </button>\n        </div>\n        <div className=\"flex-1 min-h-0 overflow-y-auto px-4 py-3 space-y-3\">\n          <p className=\"text-sm text-text-secondary\">\n            {tr(\n              'vibecontrols.ai.sdkAuth.body',\n              'The agent does not have a credential configured for this provider. Pick a provider and save one to continue the conversation.'\n            )}\n          </p>\n          <AIProviderCredentialsCard agent={agentRef} initialProviderId={initialProviderId} />\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;AA2BA,IAAa,KAAuD,EAAE,cAAW,iBAAc;CAC7F,IAAM,CAAC,GAAa,KAAkB,EAAS,GAAM,EAC/C,CAAC,GAAY,KAAiB,EAAS,GAAM,EAC7C,CAAC,GAAa,KAAkB,EAAS,GAAG,EAG5C,CAAC,GAAkB,KAAuB,EAAS,GAAM,EACzD,IAAK,GAAO,EAEZ,EAAE,cAAW,GAAsB,EACnC,IAAc,QACZ,EAAO,MAAM,MAAM,EAAE,OAAO,EAAQ,IAAI,MAC9C,CAAC,GAAQ,EAAQ,CAClB,EAEK,IAAe,GAAsB,MAAM,EAAE,cAAc,GAAW,EACtE,IAAa,GAAsB,MAAM,EAAE,WAAW,EAEtD,IAAW,GAAc,YAAY,EAAE,EAEvC,EAAE,QAAQ,MAAkB,EAAsB,GAAa,MAAM,KAAK,EAC1E,IAAW,SACR;EAAE,IAAI;EAAS,SAAS;EAAe,GAC9C,CAAC,GAAS,EAAc,CACzB,EAEK,EAAE,gBAAa,iBAAc,mBAAgB,EAAyB;EAC1E,OAAO;EACP;EACD,CAAC,EAEI,IAAe,QAAkB;AACrC,KAAe,OACT,KAAM,EAAe,GAAG,EACrB,CAAC,GACR;IACD,EAAE,CAAC;AAwDN,QArDA,QAAgB;EACd,IAAI,IAAY;AA8ChB,UA5CyB,YAAY;AAE/B,WAAS,SAAS,IAEtB;MAAe,GAAK;AACpB,QAAI;KACF,IAAM,IAAO,MAAM,EAAiB,GAAU,GAAW,EACvD,OAAO,CAAC,SAAS,SAAS,EAC3B,CAAC;AAEF,SAAI,KAAa,EAAK,WAAW,EAAG;KAEpC,IAAM,oBAAc,IAAI,KAAa;AAKrC,UAAK,IAAM,KAAO,GAAM;MACtB,IAAM,IAAU,EAAI,WAAW,EAAI,WAAW,IACxC,IAAY,EAAI,aAAa,EAAI,WACjC,IAAkB,IAAY,KAAK,MAAM,IAAI,KAAK,EAAU,CAAC,SAAS,GAAG,IAAK,GAAG,GACjF,IAAS;OAAC,EAAI;OAAM;OAAS,EAAI,SAAS;OAAI;OAAgB,CAAC,KAAK,KAAS;AAC/E,QAAY,IAAI,EAAO,KAC3B,EAAY,IAAI,EAAO,EAUvB,EAAW,GARsB;OAC/B,IAAI,EAAI;OACR,MAAM,EAAI,SAAS,UAAU,SAAS;OACtC;OACA;OACA,QAAQ,EAAI,aAAa;QAAE,OAAO;QAAG,QAAQ,EAAI;QAAY,GAAG,KAAA;OAChE,OAAO,EAAI;OACZ,CACyB;;YAEtB,WAEE;AACR,KAAK,KAAW,EAAe,GAAM;;;MAIlB,QAEV;AACX,OAAY;;IAGb,CAAC,GAAS,EAAU,CAAC,EAGtB,kBAAC,OAAD;EAAK,WAAU;EAA+B,eAAY;YAA1D;GAKE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,UAAD;MACE,MAAK;MACL,SAAS;MACT,WAAW,0CACT,IACI,qDACA;MAEN,OAAO,EACL,sDACA,6BACD;MACD,cAAY,EACV,sDACA,oBACD;gBAED,kBAAC,GAAD,EAAQ,WAAU,eAAgB,CAAA;MAC3B,CAAA,EACR,KACC,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,SAAD;OACE,MAAK;OACL,OAAO;OACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;OAC/C,aAAa,EACX,wDACA,4BACD;OACD,WAAA;OACA,WAAU;OACV,CAAA,EACD,KACC,kBAAC,UAAD;OACE,MAAK;OACL,eAAe,EAAe,GAAG;OACjC,WAAU;iBAEV,kBAAC,GAAD,EAAG,WAAU,8BAA+B,CAAA;OACrC,CAAA,CAEP;QAEJ;QACN,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAoB,GAAK;KACxC,WAAU;KACV,OAAO,EACL,6DACA,mEACD;KACD,cAAY,EACV,sDACA,sBACD;KACD,eAAY;eAZd,CAcE,kBAAC,GAAD,EAAa,WAAU,eAAgB,CAAA,EACvC,kBAAC,QAAD;MAAM,WAAU;gBACb,EAAG,sDAAsD,sBAAsB;MAC3E,CAAA,CACA;OACL;;GAGL,IACC,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,KAAD;KAAG,WAAU;eACV,EACC,0DACA,0BACD;KACC,CAAA;IACA,CAAA,GAEN,kBAAC,GAAD;IACY;IACG;IACb,gBAAgB;IACH;IACb,CAAA;GAIJ,kBAAC,GAAD;IACW;IACE;IACX,SAAS,MAAS,KAAK,EAAY,EAAK;IACxC,UAAU;IACV,gBAAgB,GAAa,aAAa,KAAA;IAC1C,aAAa,GAAa,eAAe,KAAA;IACzC,CAAA;GAIF,kBAAC,GAAD;IACE,MAAM;IACG;IACT,eAAe,EAAoB,GAAM;IACzC,CAAA;GAOF,kBAAC,GAAD;IACW;IACC;IACV,mBAAmB,GAAc,OAAO,KAAA;IACxC,CAAA;GACE;;GAUJ,KAAmD,EACvD,YACA,aACA,2BACI;CACJ,IAAM,IAAgB,GAAsB,MAAM,EAAE,cAAc,EAC5D,IAAmB,GAAsB,MAAM,EAAE,iBAAiB,EAClE,IAAK,GAAO;AAIlB,QAFI,CAAC,KAAiB,EAAc,YAAY,IAAgB,OAG9D,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GACE,WAAU;GACV,eAAe,EAAiB,KAAK;GACrC,eAAA;GACA,CAAA,EAKF,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eACX,EAAG,iCAAiC,oCAAoC;KACtE,CAAA,EACL,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAiB,KAAK;KACrC,WAAU;KACV,cAAY,EAAG,6BAA6B,QAAQ;eAEpD,kBAAC,GAAD,EAAG,WAAU,+BAAgC,CAAA;KACtC,CAAA,CACL;OACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,KAAD;KAAG,WAAU;eACV,EACC,gCACA,gIACD;KACC,CAAA,EACJ,kBAAC,GAAD;KAA2B,OAAO;KAA6B;KAAqB,CAAA,CAChF;MACF;KACF"}
+{"version":3,"file":"AgentManagerChatPane.js","names":[],"sources":["../../../src/components/agent-manager/AgentManagerChatPane.tsx"],"sourcesContent":["/**\n * Main chat interface for a single Agent Manager session.\n *\n * Renders message list + input area, manages the send/receive flow,\n * fetches existing conversation logs on mount, and provides\n * auto-scroll, cancel, and in-session search support.\n */\n\nimport { useEffect, useRef, useState, useCallback, useMemo, type FC } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { Bookmark, PackagePlus, Search, X } from 'lucide-react';\nimport { useAgentManagerStore } from '@/store/agentManagerStore';\nimport { useAgentManagerStreaming } from '@/hooks/useAgentManagerStreaming';\nimport { useCachedInitialData } from '@/hooks/useCachedInitialData';\nimport { fetchSessionLogs } from '@/services/aiApi';\nimport { useActiveAgentProfile } from '@/hooks/useActiveAgentProfile';\nimport { useToggleAgentBookmark } from '@/hooks/useToggleAgentBookmark';\nimport { AgentManagerMessageList } from './AgentManagerMessageList';\nimport { AgentManagerInputArea } from './AgentManagerInputArea';\nimport { AgentManagerBookmarksDrawer } from './AgentManagerBookmarksDrawer';\nimport { PluginInstallModal } from './PluginInstallModal';\nimport { AIProviderCredentialsCard } from '@/components/ai/AIProviderCredentialsCard';\nimport type { AgentManagerMessage } from '@/types/agentManager';\nimport { useTr } from '../../shared/hooks/useTr';\n\ninterface AgentManagerChatPaneProps {\n  sessionId: string;\n  agentId: string;\n}\n\nexport const AgentManagerChatPane: FC<AgentManagerChatPaneProps> = ({ sessionId, agentId }) => {\n  const [loadingLogs, setLoadingLogs] = useState(false);\n  const [searchOpen, setSearchOpen] = useState(false);\n  const [searchQuery, setSearchQuery] = useState('');\n  // Provider-install modal triggered from the header. Lets users add a\n  // claude/codex/gemini/opencode plugin without leaving the conversation.\n  const [installModalOpen, setInstallModalOpen] = useState(false);\n  const [bookmarksDrawerOpen, setBookmarksDrawerOpen] = useState(false);\n  const [flashMessageId, setFlashMessageId] = useState<string | null>(null);\n  const [searchParams, setSearchParams] = useSearchParams();\n  const pendingScrollMessageId = searchParams.get('messageId');\n  const consumedScrollTargetRef = useRef<string | null>(null);\n  const tr = useTr();\n\n  const { agents } = useCachedInitialData();\n  const activeAgent = useMemo(\n    () => agents.find((a) => a.id === agentId) ?? null,\n    [agents, agentId]\n  );\n\n  const sessionState = useAgentManagerStore((s) => s.sessionStates[sessionId]);\n  const addMessage = useAgentManagerStore((s) => s.addMessage);\n\n  const messages = useMemo(() => sessionState?.messages ?? [], [sessionState?.messages]);\n\n  const { active: activeProfile } = useActiveAgentProfile(activeAgent?.id ?? null);\n  const agentRef = useMemo(\n    () => ({ id: agentId, profile: activeProfile }),\n    [agentId, activeProfile]\n  );\n\n  const { sendMessage, cancelStream, isStreaming } = useAgentManagerStreaming({\n    agent: agentRef,\n    sessionId,\n  });\n\n  const { bookmarkedIds, toggle: toggleBookmark } = useToggleAgentBookmark(sessionId);\n\n  const jumpToMessage = useCallback((messageId: string) => {\n    const el = document.querySelector(`[data-message-id=\"${messageId}\"]`);\n    if (!el) return;\n    el.scrollIntoView({ behavior: 'smooth', block: 'center' });\n    setFlashMessageId(messageId);\n    window.setTimeout(() => {\n      setFlashMessageId((current) => (current === messageId ? null : current));\n    }, 1500);\n  }, []);\n\n  const handleToggleBookmark = useCallback(\n    (messageId: string) => {\n      void toggleBookmark({ agentId, sessionId, messageId });\n    },\n    [toggleBookmark, agentId, sessionId]\n  );\n\n  const toggleSearch = useCallback(() => {\n    setSearchOpen((prev) => {\n      if (prev) setSearchQuery('');\n      return !prev;\n    });\n  }, []);\n\n  // Fetch existing conversation logs on mount\n  useEffect(() => {\n    let cancelled = false;\n\n    const loadExistingLogs = async () => {\n      // Only load if session has no messages yet\n      if (messages.length > 0) return;\n\n      setLoadingLogs(true);\n      try {\n        const logs = await fetchSessionLogs(agentRef, sessionId, {\n          types: ['input', 'output'],\n        });\n\n        if (cancelled || logs.length === 0) return;\n\n        const seenLogKeys = new Set<string>();\n\n        // Convert session logs to AgentManagerMessage format. The core AI\n        // route owns logging, but older provider builds also wrote the same\n        // input/output records; collapse same-second duplicates on restore.\n        for (const log of logs) {\n          const content = log.message || log.content || '';\n          const timestamp = log.timestamp || log.createdAt;\n          const timestampSecond = timestamp ? Math.floor(new Date(timestamp).getTime() / 1000) : 0;\n          const logKey = [log.type, content, log.model ?? '', timestampSecond].join('\\u0000');\n          if (seenLogKeys.has(logKey)) continue;\n          seenLogKeys.add(logKey);\n\n          const msg: AgentManagerMessage = {\n            id: log.id,\n            role: log.type === 'input' ? 'user' : 'assistant',\n            content,\n            timestamp,\n            tokens: log.tokenCount ? { input: 0, output: log.tokenCount } : undefined,\n            model: log.model,\n          };\n          addMessage(sessionId, msg);\n        }\n      } catch {\n        // Silent fail -- session may not have logs yet\n      } finally {\n        if (!cancelled) setLoadingLogs(false);\n      }\n    };\n\n    void loadExistingLogs();\n\n    return () => {\n      cancelled = true;\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- only run on mount\n  }, [agentId, sessionId]);\n\n  // Auto-scroll to a message linked via ?messageId=... (from drawer / cross-session page).\n  // Waits for logs to finish loading and the target to be in the DOM before scrolling.\n  useEffect(() => {\n    if (!pendingScrollMessageId || loadingLogs) return;\n    if (consumedScrollTargetRef.current === pendingScrollMessageId) return;\n\n    const exists = messages.some((m) => m.id === pendingScrollMessageId);\n    if (!exists) return;\n\n    consumedScrollTargetRef.current = pendingScrollMessageId;\n    jumpToMessage(pendingScrollMessageId);\n\n    // Strip the query param so a manual refresh doesn't re-trigger the flash.\n    const next = new URLSearchParams(searchParams);\n    next.delete('messageId');\n    setSearchParams(next, { replace: true });\n  }, [pendingScrollMessageId, loadingLogs, messages, jumpToMessage, searchParams, setSearchParams]);\n\n  return (\n    <div className=\"flex flex-col h-full min-h-0\" data-testid=\"agent-manager-chat-pane\">\n      {/* In-session search bar.\n          Layout: [search controls (flex-1)] ... [Manage AI providers].\n          The search input expands inside the LEFT cluster only, so the\n          Manage button stays anchored on the right and never shifts. */}\n      <div className=\"flex items-center gap-1 px-3 py-1 border-b border-border-default bg-bg-surface flex-shrink-0\">\n        <div className=\"flex items-center gap-1.5 min-w-0 flex-1\">\n          <button\n            type=\"button\"\n            onClick={toggleSearch}\n            className={`p-1 rounded transition-colors shrink-0 ${\n              searchOpen\n                ? 'bg-action-primary-bg/10 text-action-primary-text'\n                : 'text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated'\n            }`}\n            title={tr(\n              'vibecontrols.agentManager.chatPane.searchInSession',\n              'Search in session (Ctrl+F)'\n            )}\n            aria-label={tr(\n              'vibecontrols.agentManager.chatPane.searchInSession',\n              'Search in session'\n            )}\n          >\n            <Search className=\"w-3.5 h-3.5\" />\n          </button>\n          {searchOpen && (\n            <div className=\"flex items-center gap-1.5 flex-1 min-w-0\">\n              <input\n                type=\"text\"\n                value={searchQuery}\n                onChange={(e) => setSearchQuery(e.target.value)}\n                placeholder={tr(\n                  'vibecontrols.agentManager.chatPane.searchPlaceholder',\n                  'Search in conversation...'\n                )}\n                autoFocus\n                className=\"flex-1 min-w-0 bg-transparent text-xs text-text-primary placeholder:text-text-tertiary focus:outline-none\"\n              />\n              {searchQuery && (\n                <button\n                  type=\"button\"\n                  onClick={() => setSearchQuery('')}\n                  className=\"p-0.5 rounded hover:bg-bg-elevated transition-colors\"\n                >\n                  <X className=\"w-3 h-3 text-text-tertiary\" />\n                </button>\n              )}\n            </div>\n          )}\n        </div>\n        <button\n          type=\"button\"\n          onClick={() => setBookmarksDrawerOpen(true)}\n          className=\"shrink-0 p-1 rounded transition-colors text-text-tertiary hover:text-text-secondary hover:bg-bg-elevated\"\n          title={tr(\n            'vibecontrols.agentManager.chatPane.bookmarksTooltip',\n            'View bookmarked messages'\n          )}\n          aria-label={tr('vibecontrols.agentManager.chatPane.bookmarksLabel', 'Bookmarks')}\n          data-testid=\"agent-manager-bookmarks-trigger\"\n        >\n          <Bookmark className=\"w-3.5 h-3.5\" />\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => setInstallModalOpen(true)}\n          className=\"shrink-0 inline-flex items-center gap-1.5 rounded-md border border-border-default bg-bg-elevated px-2 py-1 text-xs font-medium text-text-primary transition-colors hover:bg-bg-sunken hover:border-action-primary-bg/40\"\n          title={tr(\n            'vibecontrols.agentManager.chatPane.manageProvidersTooltip',\n            'Install or remove AI providers (Claude, Codex, Gemini, OpenCode)'\n          )}\n          aria-label={tr(\n            'vibecontrols.agentManager.chatPane.manageProviders',\n            'Manage AI providers'\n          )}\n          data-testid=\"agent-manager-manage-providers\"\n        >\n          <PackagePlus className=\"w-3.5 h-3.5\" />\n          <span className=\"hidden sm:inline\">\n            {tr('vibecontrols.agentManager.chatPane.manageProviders', 'Manage AI providers')}\n          </span>\n        </button>\n      </div>\n\n      {/* Message list */}\n      {loadingLogs ? (\n        <div className=\"flex-1 flex items-center justify-center\">\n          <p className=\"text-sm text-text-secondary\">\n            {tr(\n              'vibecontrols.agentManager.chatPane.loadingConversation',\n              'Loading conversation...'\n            )}\n          </p>\n        </div>\n      ) : (\n        <AgentManagerMessageList\n          messages={messages}\n          isStreaming={isStreaming}\n          onCancelStream={cancelStream}\n          searchQuery={searchQuery}\n          bookmarkedIds={bookmarkedIds}\n          onToggleBookmark={handleToggleBookmark}\n          flashMessageId={flashMessageId}\n        />\n      )}\n\n      {/* Rich input area with controls */}\n      <AgentManagerInputArea\n        agentId={agentId}\n        sessionId={sessionId}\n        onSend={(text) => void sendMessage(text)}\n        onCancel={cancelStream}\n        agentTunnelUrl={activeAgent?.tunnelUrl ?? undefined}\n        agentApiKey={activeAgent?.agentApiKey ?? undefined}\n      />\n\n      {/* Per-session bookmarks drawer */}\n      <AgentManagerBookmarksDrawer\n        open={bookmarksDrawerOpen}\n        onClose={() => setBookmarksDrawerOpen(false)}\n        sessionId={sessionId}\n        messages={messages}\n        onJump={jumpToMessage}\n      />\n\n      {/* Header-triggered provider install/remove. Sits below the chat\n          tree so it can render full-screen without disturbing layout. */}\n      <PluginInstallModal\n        open={installModalOpen}\n        agentId={agentId}\n        onClose={() => setInstallModalOpen(false)}\n      />\n\n      {/* SDK auth prompt: opens when the streaming hook detects a missing\n          ANTHROPIC_API_KEY / ANTHROPIC_AUTH_TOKEN, so the user can save the\n          credential inline instead of being told to go look elsewhere.\n          The session's currently-selected SDK is forwarded so the picker\n          can preselect the right provider. */}\n      <SdkAuthPromptModal\n        agentId={agentId}\n        agentRef={agentRef}\n        initialProviderId={sessionState?.sdk ?? undefined}\n      />\n    </div>\n  );\n};\n\ninterface SdkAuthPromptModalProps {\n  agentId: string;\n  agentRef: { id: string; profile: string };\n  initialProviderId?: string;\n}\n\nconst SdkAuthPromptModal: FC<SdkAuthPromptModalProps> = ({\n  agentId,\n  agentRef,\n  initialProviderId,\n}) => {\n  const sdkAuthPrompt = useAgentManagerStore((s) => s.sdkAuthPrompt);\n  const setSdkAuthPrompt = useAgentManagerStore((s) => s.setSdkAuthPrompt);\n  const tr = useTr();\n\n  if (!sdkAuthPrompt || sdkAuthPrompt.agentId !== agentId) return null;\n\n  return (\n    <div className=\"fixed inset-0 z-50 flex items-center justify-center p-4\">\n      <div\n        className=\"absolute inset-0 bg-bg-overlay\"\n        onClick={() => setSdkAuthPrompt(null)}\n        aria-hidden\n      />\n      {/* Constrain height to the viewport and let the inner body scroll so the\n          modal never escapes the screen no matter how many providers/fields\n          render inside AIProviderCredentialsCard. The header stays sticky so\n          the close button is always reachable. */}\n      <div className=\"relative w-full max-w-xl max-h-[85vh] flex flex-col rounded-lg border border-border-default bg-bg-surface shadow-xl overflow-hidden\">\n        <div className=\"flex items-center justify-between px-4 py-3 border-b border-border-default bg-bg-surface flex-shrink-0\">\n          <h3 className=\"text-base font-semibold text-text-primary truncate pr-2\">\n            {tr('vibecontrols.ai.sdkAuth.title', 'Configure AI provider credentials')}\n          </h3>\n          <button\n            type=\"button\"\n            onClick={() => setSdkAuthPrompt(null)}\n            className=\"p-1 rounded hover:bg-bg-sunken transition-colors flex-shrink-0\"\n            aria-label={tr('vibecontrols.common.close', 'Close')}\n          >\n            <X className=\"w-5 h-5 text-text-secondary\" />\n          </button>\n        </div>\n        <div className=\"flex-1 min-h-0 overflow-y-auto px-4 py-3 space-y-3\">\n          <p className=\"text-sm text-text-secondary\">\n            {tr(\n              'vibecontrols.ai.sdkAuth.body',\n              'The agent does not have a credential configured for this provider. Pick a provider and save one to continue the conversation.'\n            )}\n          </p>\n          <AIProviderCredentialsCard agent={agentRef} initialProviderId={initialProviderId} />\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AA8BA,IAAa,KAAuD,EAAE,cAAW,iBAAc;CAC7F,IAAM,CAAC,GAAa,KAAkB,EAAS,GAAM,EAC/C,CAAC,GAAY,MAAiB,EAAS,GAAM,EAC7C,CAAC,GAAa,KAAkB,EAAS,GAAG,EAG5C,CAAC,GAAkB,KAAuB,EAAS,GAAM,EACzD,CAAC,GAAqB,KAA0B,EAAS,GAAM,EAC/D,CAAC,GAAgB,KAAqB,EAAwB,KAAK,EACnE,CAAC,GAAc,KAAmB,GAAiB,EACnD,IAAyB,EAAa,IAAI,YAAY,EACtD,IAA0B,EAAsB,KAAK,EACrD,IAAK,GAAO,EAEZ,EAAE,cAAW,GAAsB,EACnC,IAAc,QACZ,EAAO,MAAM,MAAM,EAAE,OAAO,EAAQ,IAAI,MAC9C,CAAC,GAAQ,EAAQ,CAClB,EAEK,IAAe,GAAsB,MAAM,EAAE,cAAc,GAAW,EACtE,IAAa,GAAsB,MAAM,EAAE,WAAW,EAEtD,IAAW,QAAc,GAAc,YAAY,EAAE,EAAE,CAAC,GAAc,SAAS,CAAC,EAEhF,EAAE,QAAQ,MAAkB,EAAsB,GAAa,MAAM,KAAK,EAC1E,IAAW,SACR;EAAE,IAAI;EAAS,SAAS;EAAe,GAC9C,CAAC,GAAS,EAAc,CACzB,EAEK,EAAE,gBAAa,iBAAc,mBAAgB,EAAyB;EAC1E,OAAO;EACP;EACD,CAAC,EAEI,EAAE,kBAAe,QAAQ,MAAmB,EAAuB,EAAU,EAE7E,IAAgB,GAAa,MAAsB;EACvD,IAAM,IAAK,SAAS,cAAc,qBAAqB,EAAU,IAAI;AAChE,QACL,EAAG,eAAe;GAAE,UAAU;GAAU,OAAO;GAAU,CAAC,EAC1D,EAAkB,EAAU,EAC5B,OAAO,iBAAiB;AACtB,MAAmB,MAAa,MAAY,IAAY,OAAO,EAAS;KACvE,KAAK;IACP,EAAE,CAAC,EAEA,KAAuB,GAC1B,MAAsB;AAChB,IAAe;GAAE;GAAS;GAAW;GAAW,CAAC;IAExD;EAAC;EAAgB;EAAS;EAAU,CACrC,EAEK,KAAe,QAAkB;AACrC,MAAe,OACT,KAAM,EAAe,GAAG,EACrB,CAAC,GACR;IACD,EAAE,CAAC;AA0EN,QAvEA,QAAgB;EACd,IAAI,IAAY;AA8ChB,UA5CyB,YAAY;AAE/B,WAAS,SAAS,IAEtB;MAAe,GAAK;AACpB,QAAI;KACF,IAAM,IAAO,MAAM,EAAiB,GAAU,GAAW,EACvD,OAAO,CAAC,SAAS,SAAS,EAC3B,CAAC;AAEF,SAAI,KAAa,EAAK,WAAW,EAAG;KAEpC,IAAM,oBAAc,IAAI,KAAa;AAKrC,UAAK,IAAM,KAAO,GAAM;MACtB,IAAM,IAAU,EAAI,WAAW,EAAI,WAAW,IACxC,IAAY,EAAI,aAAa,EAAI,WACjC,IAAkB,IAAY,KAAK,MAAM,IAAI,KAAK,EAAU,CAAC,SAAS,GAAG,IAAK,GAAG,GACjF,IAAS;OAAC,EAAI;OAAM;OAAS,EAAI,SAAS;OAAI;OAAgB,CAAC,KAAK,KAAS;AAC/E,QAAY,IAAI,EAAO,KAC3B,EAAY,IAAI,EAAO,EAUvB,EAAW,GARsB;OAC/B,IAAI,EAAI;OACR,MAAM,EAAI,SAAS,UAAU,SAAS;OACtC;OACA;OACA,QAAQ,EAAI,aAAa;QAAE,OAAO;QAAG,QAAQ,EAAI;QAAY,GAAG,KAAA;OAChE,OAAO,EAAI;OACZ,CACyB;;YAEtB,WAEE;AACR,KAAK,KAAW,EAAe,GAAM;;;MAIlB,QAEV;AACX,OAAY;;IAGb,CAAC,GAAS,EAAU,CAAC,EAIxB,QAAgB;AAKd,MAJI,CAAC,KAA0B,KAC3B,EAAwB,YAAY,KAGpC,CADW,EAAS,MAAM,MAAM,EAAE,OAAO,EAAuB,CACvD;AAGb,EADA,EAAwB,UAAU,GAClC,EAAc,EAAuB;EAGrC,IAAM,IAAO,IAAI,gBAAgB,EAAa;AAE9C,EADA,EAAK,OAAO,YAAY,EACxB,EAAgB,GAAM,EAAE,SAAS,IAAM,CAAC;IACvC;EAAC;EAAwB;EAAa;EAAU;EAAe;EAAc;EAAgB,CAAC,EAG/F,kBAAC,OAAD;EAAK,WAAU;EAA+B,eAAY;YAA1D;GAKE,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,UAAD;OACE,MAAK;OACL,SAAS;OACT,WAAW,0CACT,IACI,qDACA;OAEN,OAAO,EACL,sDACA,6BACD;OACD,cAAY,EACV,sDACA,oBACD;iBAED,kBAAC,GAAD,EAAQ,WAAU,eAAgB,CAAA;OAC3B,CAAA,EACR,KACC,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,SAAD;QACE,MAAK;QACL,OAAO;QACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;QAC/C,aAAa,EACX,wDACA,4BACD;QACD,WAAA;QACA,WAAU;QACV,CAAA,EACD,KACC,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAe,GAAG;QACjC,WAAU;kBAEV,kBAAC,GAAD,EAAG,WAAU,8BAA+B,CAAA;QACrC,CAAA,CAEP;SAEJ;;KACN,kBAAC,UAAD;MACE,MAAK;MACL,eAAe,EAAuB,GAAK;MAC3C,WAAU;MACV,OAAO,EACL,uDACA,2BACD;MACD,cAAY,EAAG,qDAAqD,YAAY;MAChF,eAAY;gBAEZ,kBAAC,GAAD,EAAU,WAAU,eAAgB,CAAA;MAC7B,CAAA;KACT,kBAAC,UAAD;MACE,MAAK;MACL,eAAe,EAAoB,GAAK;MACxC,WAAU;MACV,OAAO,EACL,6DACA,mEACD;MACD,cAAY,EACV,sDACA,sBACD;MACD,eAAY;gBAZd,CAcE,kBAAC,GAAD,EAAa,WAAU,eAAgB,CAAA,EACvC,kBAAC,QAAD;OAAM,WAAU;iBACb,EAAG,sDAAsD,sBAAsB;OAC3E,CAAA,CACA;;KACL;;GAGL,IACC,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,KAAD;KAAG,WAAU;eACV,EACC,0DACA,0BACD;KACC,CAAA;IACA,CAAA,GAEN,kBAAC,GAAD;IACY;IACG;IACb,gBAAgB;IACH;IACE;IACf,kBAAkB;IACF;IAChB,CAAA;GAIJ,kBAAC,GAAD;IACW;IACE;IACX,SAAS,MAAS,KAAK,EAAY,EAAK;IACxC,UAAU;IACV,gBAAgB,GAAa,aAAa,KAAA;IAC1C,aAAa,GAAa,eAAe,KAAA;IACzC,CAAA;GAGF,kBAAC,GAAD;IACE,MAAM;IACN,eAAe,EAAuB,GAAM;IACjC;IACD;IACV,QAAQ;IACR,CAAA;GAIF,kBAAC,IAAD;IACE,MAAM;IACG;IACT,eAAe,EAAoB,GAAM;IACzC,CAAA;GAOF,kBAAC,GAAD;IACW;IACC;IACV,mBAAmB,GAAc,OAAO,KAAA;IACxC,CAAA;GACE;;GAUJ,KAAmD,EACvD,YACA,aACA,2BACI;CACJ,IAAM,IAAgB,GAAsB,MAAM,EAAE,cAAc,EAC5D,IAAmB,GAAsB,MAAM,EAAE,iBAAiB,EAClE,IAAK,GAAO;AAIlB,QAFI,CAAC,KAAiB,EAAc,YAAY,IAAgB,OAG9D,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GACE,WAAU;GACV,eAAe,EAAiB,KAAK;GACrC,eAAA;GACA,CAAA,EAKF,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eACX,EAAG,iCAAiC,oCAAoC;KACtE,CAAA,EACL,kBAAC,UAAD;KACE,MAAK;KACL,eAAe,EAAiB,KAAK;KACrC,WAAU;KACV,cAAY,EAAG,6BAA6B,QAAQ;eAEpD,kBAAC,GAAD,EAAG,WAAU,+BAAgC,CAAA;KACtC,CAAA,CACL;OACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,KAAD;KAAG,WAAU;eACV,EACC,gCACA,gIACD;KACC,CAAA,EACJ,kBAAC,GAAD;KAA2B,OAAO;KAA6B;KAAqB,CAAA,CAChF;MACF;KACF"}