bazilion 0.14.2 → 0.15.0

package/dist/web/server/assets/{ChatPane-CgSe7tsy.js → ChatPane-DJ30FdFG.js}

@@ -1,6 +1,6 @@
 import { t as Button } from "./Button-Dsnw22OF.js";
-import { t as ConfirmDialog } from "./ConfirmDialog-C-MPYYSU.js";
-import { useCallback, useEffect, useLayoutEffect, useRef, useState, useSyncExternalStore } from "react";
+import { t as ResultCard } from "./ResultCard-B3zD9N0t.js";
+import { forwardRef, useCallback, useEffect, useImperativeHandle, useLayoutEffect, useRef, useState, useSyncExternalStore } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import DOMPurify from "dompurify";
 import { marked } from "marked";
@@ -35,6 +35,952 @@ function escapeHtml(s) {
 	return String(s).replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;");
 }
 //#endregion
+//#region src/components/ConversationLibrary.tsx
+function ConversationLibrary({ agentId, turnBusy, onCreated, renderHistory, initialConversationId }) {
+	const [library, setLibrary] = useState(null);
+	const [offset, setOffset] = useState(0);
+	const [refresh, setRefresh] = useState(0);
+	const [selected, setSelected] = useState(null);
+	const [history, setHistory] = useState(null);
+	const [title, setTitle] = useState("");
+	const [error, setError] = useState("");
+	const [historyError, setHistoryError] = useState("");
+	const [busy, setBusy] = useState(false);
+	const pendingKey = `bazilion:conversation-create:${agentId}`;
+	const pendingCreate = useRef(null);
+	useEffect(() => {
+		try {
+			pendingCreate.current = JSON.parse(sessionStorage.getItem(pendingKey) ?? "null");
+		} catch {
+			pendingCreate.current = null;
+		}
+	}, [pendingKey]);
+	function clearPending() {
+		pendingCreate.current = null;
+		sessionStorage.removeItem(pendingKey);
+	}
+	const base = `/api/agents/${encodeURIComponent(agentId)}/conversations`;
+	useEffect(() => {
+		if (!initialConversationId) return;
+		const controller = new AbortController();
+		fetch(`${base}/${encodeURIComponent(initialConversationId)}`, { signal: controller.signal }).then(async (response) => {
+			if (!response.ok) throw new Error("Retained conversation is unavailable");
+			const body = await response.json();
+			if (!controller.signal.aborted) {
+				setSelected(body.conversation);
+				setTitle(body.conversation.title);
+			}
+		}).catch((error) => {
+			if (!controller.signal.aborted) setError(error.message);
+		});
+		return () => controller.abort();
+	}, [base, initialConversationId]);
+	useEffect(() => {
+		const controller = new AbortController();
+		setLibrary(null);
+		fetch(`${base}?limit=20&offset=${offset}`, { signal: controller.signal }).then(async (response) => {
+			if (!response.ok) throw new Error("Could not load conversations.");
+			const body = await response.json();
+			if (!controller.signal.aborted) setLibrary(body);
+		}).catch((error) => {
+			if (!controller.signal.aborted) setError(error.message);
+		});
+		return () => controller.abort();
+	}, [
+		base,
+		offset,
+		refresh
+	]);
+	useEffect(() => {
+		if (!selected) return;
+		const controller = new AbortController();
+		setHistory(null);
+		setHistoryError("");
+		fetch(`${base}/${encodeURIComponent(selected.id)}`, { signal: controller.signal }).then(async (response) => {
+			if (!response.ok) throw new Error("This conversation history is unavailable. You can still start a new conversation.");
+			const body = await response.json();
+			if (!controller.signal.aborted) setHistory(body.messages);
+		}).catch((error) => {
+			if (!controller.signal.aborted) setHistoryError(error.message);
+		});
+		return () => controller.abort();
+	}, [base, selected?.id]);
+	async function create() {
+		if (!library || busy || turnBusy) return;
+		setBusy(true);
+		setError("");
+		const request = pendingCreate.current ?? {
+			requestId: crypto.randomUUID(),
+			expectedSelection: library.selection
+		};
+		pendingCreate.current = request;
+		try {
+			sessionStorage.setItem(pendingKey, JSON.stringify(request));
+			const response = await fetch(base, {
+				method: "POST",
+				headers: { "content-type": "application/json" },
+				body: JSON.stringify(request)
+			});
+			const body = await response.json();
+			if (!response.ok) {
+				if (response.status === 409 || response.status === 400) clearPending();
+				throw new Error(body.error ?? "Could not create conversation.");
+			}
+			clearPending();
+			setSelected(null);
+			setOffset(0);
+			setRefresh((value) => value + 1);
+			await onCreated();
+		} catch (error) {
+			setError(error instanceof Error ? error.message : "Could not create conversation.");
+		} finally {
+			setBusy(false);
+		}
+	}
+	async function rename() {
+		if (!selected || busy) return;
+		setBusy(true);
+		setError("");
+		try {
+			const response = await fetch(`${base}/${encodeURIComponent(selected.id)}`, {
+				method: "PATCH",
+				headers: { "content-type": "application/json" },
+				body: JSON.stringify({
+					title,
+					expectedTitleRevision: selected.titleRevision
+				})
+			});
+			const body = await response.json();
+			if (!response.ok) throw new Error(body.error ?? "Could not rename conversation.");
+			setSelected(body.conversation);
+			setRefresh((value) => value + 1);
+		} catch (error) {
+			setError(error instanceof Error ? error.message : "Could not rename conversation.");
+		} finally {
+			setBusy(false);
+		}
+	}
+	return /* @__PURE__ */ jsxs("section", {
+		"aria-live": "off",
+		className: "my-3 min-w-0 space-y-4 rounded-lg border border-fawn bg-ivory p-4",
+		"aria-label": "Conversation library",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col items-start gap-3 sm:flex-row sm:items-center sm:justify-between",
+				children: [/* @__PURE__ */ jsx("h2", {
+					className: "m-0 text-lg",
+					children: "Conversations"
+				}), /* @__PURE__ */ jsx(Button, {
+					variant: "primary",
+					disabled: !library || busy || turnBusy,
+					onClick: () => void create(),
+					children: "New conversation"
+				})]
+			}),
+			/* @__PURE__ */ jsx("p", {
+				className: "m-0 text-sm",
+				children: "Starting a new conversation keeps previous history and saved files. Viewing history does not change the active conversation."
+			}),
+			turnBusy && /* @__PURE__ */ jsx("p", {
+				role: "status",
+				children: "Wait for the current turn to finish before starting a new conversation."
+			}),
+			error && /* @__PURE__ */ jsxs("p", {
+				role: "alert",
+				children: [
+					error,
+					" ",
+					/* @__PURE__ */ jsx(Button, {
+						variant: "ghost",
+						disabled: busy,
+						onClick: () => {
+							setError("");
+							setRefresh((value) => value + 1);
+						},
+						children: "Refresh library"
+					})
+				]
+			}),
+			!library ? /* @__PURE__ */ jsx("p", {
+				role: "status",
+				children: "Loading conversations…"
+			}) : /* @__PURE__ */ jsxs(Fragment, { children: [
+				!library.total && /* @__PURE__ */ jsx("p", { children: "No conversations yet." }),
+				/* @__PURE__ */ jsx("ul", {
+					className: "mt-4 grid list-none gap-2 p-0",
+					children: library.conversations.map((item) => /* @__PURE__ */ jsxs("li", {
+						className: "flex min-w-0 flex-col items-start gap-3 rounded border border-fawn p-3 sm:flex-row sm:items-center sm:justify-between",
+						children: [/* @__PURE__ */ jsxs("span", {
+							className: "flex min-w-0 flex-1 flex-wrap items-center gap-2",
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "min-w-0 break-words [overflow-wrap:anywhere]",
+								children: item.title
+							}), item.id === library.selection.conversationId && /* @__PURE__ */ jsx("strong", {
+								className: "shrink-0 rounded-full bg-frost px-2 py-0.5 text-xs",
+								children: "Active"
+							})]
+						}), /* @__PURE__ */ jsxs(Button, {
+							variant: "ghost",
+							className: "max-w-full whitespace-normal break-words text-left sm:max-w-[50%]",
+							disabled: busy,
+							"aria-pressed": selected?.id === item.id,
+							onClick: () => {
+								setSelected(item);
+								setTitle(item.title);
+							},
+							children: ["View ", item.title]
+						})]
+					}, item.id))
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "mt-4 flex flex-wrap items-center gap-2",
+					children: [
+						/* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							disabled: busy || offset === 0,
+							onClick: () => setOffset(Math.max(0, offset - 20)),
+							children: "Previous"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							disabled: busy || offset + library.conversations.length >= library.total,
+							onClick: () => setOffset(offset + 20),
+							children: "Next"
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: "text-sm",
+							children: [library.total, " conversations"]
+						})
+					]
+				})
+			] }),
+			selected && /* @__PURE__ */ jsxs("section", {
+				className: "space-y-4 border-t border-fawn pt-4",
+				"aria-label": "Retained conversation",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "grid min-w-0 grid-cols-2 items-end gap-2 sm:grid-cols-[minmax(0,1fr)_auto_auto]",
+						children: [
+							/* @__PURE__ */ jsxs("label", {
+								className: "col-span-2 m-0 grid min-w-0 gap-2 sm:col-span-1",
+								children: ["Conversation title", /* @__PURE__ */ jsx("input", {
+									className: "h-11",
+									value: title,
+									maxLength: 200,
+									onChange: (event) => setTitle(event.target.value)
+								})]
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								className: "h-11",
+								disabled: busy || !title.trim(),
+								onClick: () => void rename(),
+								children: "Rename"
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								className: "h-11",
+								disabled: busy,
+								onClick: () => setSelected(null),
+								children: "Close history"
+							})
+						]
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "m-0 text-sm",
+						children: "Viewing retained history. New messages still go to the active conversation."
+					}),
+					historyError ? /* @__PURE__ */ jsx("p", {
+						role: "alert",
+						children: historyError
+					}) : history === null ? /* @__PURE__ */ jsx("p", {
+						role: "status",
+						children: "Loading history…"
+					}) : history.length ? renderHistory(history) : /* @__PURE__ */ jsx("p", { children: "This conversation is empty." })
+				]
+			})
+		]
+	});
+}
+//#endregion
+//#region src/lib/queue-journal.ts
+/** Store bytes before submission so a reload can retry the exact same attempt. */
+async function queueJournal(agentId, value, clearRequestId) {
+	return new Promise((resolve, reject) => {
+		const opening = indexedDB.open("bazilion-queue-attempts", 1);
+		opening.onupgradeneeded = () => {
+			opening.result.createObjectStore("requests", { keyPath: "input.requestId" }).createIndex("agentId", "agentId");
+		};
+		opening.onerror = () => reject(/* @__PURE__ */ new Error("Local queue recovery storage is unavailable"));
+		opening.onblocked = () => reject(/* @__PURE__ */ new Error("Close other Bazilion tabs to open queue recovery storage"));
+		opening.onsuccess = () => {
+			const db = opening.result;
+			const tx = db.transaction("requests", value === void 0 ? "readonly" : "readwrite");
+			const store = tx.objectStore("requests");
+			if (value === null && !clearRequestId) {
+				db.close();
+				reject(/* @__PURE__ */ new Error("Queue request identity is required to clear recovery state"));
+				return;
+			}
+			const request = value === void 0 ? store.index("agentId").get(agentId) : value === null ? store.delete(clearRequestId) : store.put(value);
+			tx.oncomplete = () => {
+				db.close();
+				resolve(value === void 0 ? request.result ?? null : value);
+			};
+			tx.onerror = tx.onabort = () => {
+				db.close();
+				reject(/* @__PURE__ */ new Error("Unable to retain queue request locally; it was not acknowledged"));
+			};
+		};
+	});
+}
+//#endregion
+//#region src/components/UserQueuePanel.tsx
+var UserQueuePanel = forwardRef(function UserQueuePanel({ agentId, selection, onQueueMode, onViewConversation }, ref) {
+	const base = `/api/agents/${encodeURIComponent(agentId)}/queue`;
+	const [state, setState] = useState(null);
+	const [error, setError] = useState("");
+	const [notice, setNotice] = useState("");
+	const [busy, setBusy] = useState(false);
+	const [ready, setReady] = useState(false);
+	const readyRef = useRef(false);
+	const [pending, setPending] = useState(null);
+	const pendingRef = useRef(null);
+	const locked = useRef(false);
+	const mounted = useRef(true);
+	const refreshGeneration = useRef(0);
+	useEffect(() => {
+		mounted.current = true;
+		return () => {
+			mounted.current = false;
+		};
+	}, []);
+	const [editing, setEditing] = useState(null);
+	const [text, setText] = useState("");
+	const [editFiles, setEditFiles] = useState([]);
+	const [history, setHistory] = useState(false);
+	const [offset, setOffset] = useState(0);
+	const modeRef = useRef(onQueueMode);
+	modeRef.current = onQueueMode;
+	async function refresh() {
+		const generation = ++refreshGeneration.current;
+		const response = await fetch(`${base}?all=${history ? 1 : 0}&offset=${offset}`);
+		if (!response.ok) throw new Error("Queue could not be loaded");
+		const body = await response.json();
+		const activeResponse = history ? await fetch(base) : null;
+		const active = activeResponse?.ok ? await activeResponse.json() : body;
+		if (mounted.current && generation === refreshGeneration.current) {
+			setState(body);
+			if (readyRef.current) modeRef.current(active.total > 0 || active.control.paused || !!pendingRef.current);
+		}
+		return body;
+	}
+	useEffect(() => {
+		let live = true;
+		queueJournal(agentId).then((value) => {
+			if (live) {
+				pendingRef.current = value;
+				setPending(value);
+				readyRef.current = true;
+				setReady(true);
+				refresh().catch((e) => setError(e.message));
+			}
+		}).catch((e) => {
+			if (live) setError(e.message);
+		});
+		return () => {
+			live = false;
+		};
+	}, [agentId]);
+	useEffect(() => {
+		refresh().catch((e) => setError(e.message));
+		const timer = setInterval(() => {
+			refresh().catch((e) => setError(e.message));
+		}, 2e3);
+		return () => clearInterval(timer);
+	}, [
+		agentId,
+		history,
+		offset
+	]);
+	async function clearPending(record) {
+		await queueJournal(agentId, null, record.input.requestId);
+		const remaining = await queueJournal(agentId);
+		pendingRef.current = remaining;
+		setPending(remaining);
+	}
+	async function submit(record, retry = false) {
+		if (locked.current || !ready) return false;
+		if (pendingRef.current && !retry) {
+			setError("Resolve the unacknowledged queue request before sending another.");
+			return false;
+		}
+		locked.current = true;
+		setBusy(true);
+		setError("");
+		setNotice("");
+		try {
+			await queueJournal(agentId, record);
+			pendingRef.current = record;
+			setPending(record);
+			const response = await fetch(record.replacementId ? `${base}/${encodeURIComponent(record.replacementId)}` : base, {
+				method: record.replacementId ? "PATCH" : "POST",
+				headers: { "content-type": "application/json" },
+				body: JSON.stringify(record.input)
+			});
+			if (!response.ok) {
+				const detail = await response.json().catch(() => ({}));
+				if (response.status >= 400 && response.status < 500) await clearPending(record);
+				throw new Error(detail.error ?? "Queue acknowledgement unavailable; retry this same request.");
+			}
+			const item = await response.json();
+			await clearPending(record);
+			setNotice(`Follow-up ${item.status}.`);
+			setEditing(null);
+			await refresh().catch(() => setError("Input acknowledged; queue display could not refresh."));
+			return true;
+		} catch (e) {
+			setError(e instanceof Error ? e.message : "Queue request failed");
+			return false;
+		} finally {
+			locked.current = false;
+			setBusy(false);
+		}
+	}
+	async function action(path, body, method = "POST") {
+		if (locked.current) return false;
+		locked.current = true;
+		setBusy(true);
+		setError("");
+		try {
+			const response = await fetch(`${base}${path}`, {
+				method,
+				headers: { "content-type": "application/json" },
+				body: JSON.stringify(body)
+			});
+			if (!response.ok) {
+				const detail = await response.json();
+				throw new Error(detail.error ?? "Queue changed; refresh and try again");
+			}
+			await refresh();
+			return true;
+		} catch (e) {
+			setError(e instanceof Error ? e.message : "Queue action failed");
+			await refresh().catch(() => {});
+			return false;
+		} finally {
+			locked.current = false;
+			setBusy(false);
+		}
+	}
+	useImperativeHandle(ref, () => ({
+		async enqueue(message, attachments, expectedSelection) {
+			if (!expectedSelection) {
+				setError("Refresh conversation history before queuing input.");
+				return false;
+			}
+			return submit({
+				agentId,
+				input: {
+					requestId: crypto.randomUUID(),
+					message,
+					attachments,
+					expectedSelection
+				}
+			});
+		},
+		async stop() {
+			if (!state) {
+				setError("Load queue controls before stopping.");
+				return false;
+			}
+			return action("/stop", { expectedRevision: state.control.revision });
+		}
+	}));
+	async function edit(item) {
+		try {
+			const response = await fetch(`${base}/${encodeURIComponent(item.id)}/input`);
+			if (!response.ok) throw new Error("Retained input is unavailable");
+			const input = await response.json();
+			setEditing(item);
+			setText(input.message);
+			setEditFiles(input.attachments);
+		} catch (e) {
+			setError(e instanceof Error ? e.message : "Could not edit");
+		}
+	}
+	return /* @__PURE__ */ jsxs("section", {
+		"aria-label": "Follow-up queue",
+		className: "max-h-[45%] min-w-0 shrink-0 space-y-3 overflow-y-auto border-t border-frost px-5 py-4 text-sm",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between",
+				children: [/* @__PURE__ */ jsxs("strong", {
+					className: "shrink-0",
+					children: ["Follow-ups ", state?.control.paused ? "· Paused" : ""]
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "flex flex-wrap items-center gap-2",
+					children: [
+						state && /* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							disabled: busy,
+							onClick: () => void action("/control", {
+								paused: !state.control.paused,
+								expectedRevision: state.control.revision
+							}),
+							children: state.control.paused ? "Resume queue" : "Pause queue"
+						}),
+						state && /* @__PURE__ */ jsx(Button, {
+							variant: "danger",
+							disabled: busy,
+							onClick: () => void action("/stop", { expectedRevision: state.control.revision }),
+							children: "Stop and pause"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							onClick: () => {
+								setHistory(!history);
+								setOffset(0);
+							},
+							children: history ? "Pending" : "History"
+						})
+					]
+				})]
+			}),
+			error && /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "m-0 break-words text-danger",
+				children: error
+			}),
+			notice && /* @__PURE__ */ jsx("p", {
+				role: "status",
+				className: "m-0 text-mocha",
+				children: notice
+			}),
+			pending && /* @__PURE__ */ jsxs("div", {
+				role: "status",
+				className: "flex min-w-0 flex-col gap-3 rounded-lg border border-frost bg-ivory p-3",
+				children: [
+					/* @__PURE__ */ jsx("p", { children: "A queue request has no confirmed acknowledgement. Retrying uses the same request and files." }),
+					/* @__PURE__ */ jsx("p", {
+						className: "truncate",
+						children: pending.input.message
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						variant: "primary",
+						disabled: busy,
+						onClick: () => void submit(pending, true),
+						children: "Retry saved request"
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "min-w-0 space-y-3",
+				children: [state?.items.map((item) => /* @__PURE__ */ jsxs("article", {
+					className: "flex min-w-0 flex-col gap-3 rounded-lg border border-frost bg-ivory p-3",
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex flex-wrap items-center justify-between gap-3",
+							children: [/* @__PURE__ */ jsxs("div", {
+								className: "flex flex-wrap items-center gap-2",
+								children: [/* @__PURE__ */ jsx("strong", {
+									className: "rounded-full bg-frost px-2 py-1 text-xs capitalize",
+									children: item.status
+								}), /* @__PURE__ */ jsx("span", {
+									className: "text-xs text-mocha",
+									children: item.source === "telegram" ? "Telegram" : "Web / API"
+								})]
+							}), /* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								onClick: () => onViewConversation(item.conversationId),
+								children: "View conversation"
+							})]
+						}),
+						/* @__PURE__ */ jsx("p", {
+							className: "m-0 whitespace-pre-wrap break-words [overflow-wrap:anywhere]",
+							children: item.text ?? "Input retention expired"
+						}),
+						item.attachments.map((file) => /* @__PURE__ */ jsxs("p", {
+							className: "m-0 break-all text-xs text-mocha",
+							children: [
+								file.name ?? "Attachment",
+								" · ",
+								file.byteLength,
+								" bytes"
+							]
+						}, file.id)),
+						item.diagnostic && /* @__PURE__ */ jsx("p", {
+							className: "m-0 break-words",
+							children: item.diagnostic
+						}),
+						item.approvalId && /* @__PURE__ */ jsx("a", {
+							href: `/approvals`,
+							children: "Review communication approval"
+						}),
+						item.status === "pending" && /* @__PURE__ */ jsxs("div", {
+							className: "flex flex-wrap items-center gap-2",
+							children: [/* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								disabled: busy || !!pending,
+								onClick: () => void edit(item),
+								children: "Edit"
+							}), /* @__PURE__ */ jsx(Button, {
+								variant: "danger",
+								disabled: busy,
+								onClick: () => void action(`/${item.id}`, { expectedRevision: item.revision }, "DELETE"),
+								children: "Remove"
+							})]
+						}),
+						item.status === "uncertain" && /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", { children: "This input may already have acted. Review its conversation before closing it. Closing never retries it." }), /* @__PURE__ */ jsx(Button, {
+							variant: "danger",
+							disabled: busy,
+							onClick: () => void action(`/${item.id}/reconcile`, {
+								expectedRevision: item.revision,
+								acknowledged: true
+							}),
+							children: "Acknowledge and close"
+						})] })
+					]
+				}, item.id)), editing && /* @__PURE__ */ jsxs("form", {
+					className: "flex min-w-0 flex-col gap-3 rounded-lg border border-frost bg-ivory p-3",
+					onSubmit: (e) => {
+						e.preventDefault();
+						const expectedSelection = selection();
+						if (expectedSelection) submit({
+							agentId,
+							replacementId: editing.id,
+							input: {
+								requestId: crypto.randomUUID(),
+								expectedRevision: editing.revision,
+								expectedSelection,
+								message: text,
+								attachments: editFiles
+							}
+						});
+					},
+					children: [
+						/* @__PURE__ */ jsxs("label", {
+							className: "m-0 grid gap-2",
+							children: ["Edit queued input", /* @__PURE__ */ jsx("textarea", {
+								"aria-label": "Edit queued input",
+								rows: 3,
+								className: "w-full resize-y",
+								value: text,
+								onChange: (e) => setText(e.target.value)
+							})]
+						}),
+						editFiles.map((file, index) => /* @__PURE__ */ jsxs("div", { children: [
+							file.name ?? "Attachment",
+							" ",
+							/* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								onClick: () => setEditFiles((files) => files.filter((_, i) => i !== index)),
+								children: "Remove attachment"
+							})
+						] }, index)),
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex flex-wrap items-center gap-2",
+							children: [/* @__PURE__ */ jsx(Button, {
+								variant: "primary",
+								type: "submit",
+								disabled: busy || !!pending,
+								children: "Save replacement"
+							}), /* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								onClick: () => setEditing(null),
+								children: "Cancel edit"
+							})]
+						})
+					]
+				})]
+			}),
+			state && (offset > 0 || offset + state.items.length < state.total) && /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-wrap items-center gap-2",
+				children: [/* @__PURE__ */ jsx(Button, {
+					variant: "ghost",
+					disabled: offset === 0,
+					onClick: () => setOffset(Math.max(0, offset - 20)),
+					children: "Previous"
+				}), /* @__PURE__ */ jsx(Button, {
+					variant: "ghost",
+					disabled: offset + state.items.length >= state.total,
+					onClick: () => setOffset(offset + 20),
+					children: "Next"
+				})]
+			})
+		]
+	});
+});
+//#endregion
+//#region src/components/AgentQuestions.tsx
+function AgentQuestions({ agentId }) {
+	const [items, setItems] = useState([]);
+	const [error, setError] = useState("");
+	useEffect(() => {
+		let live = true;
+		let running = false;
+		const refresh = async () => {
+			if (running) return;
+			running = true;
+			try {
+				const response = await fetch(`/api/agents/${encodeURIComponent(agentId)}/questions`, { cache: "no-store" });
+				if (!response.ok) throw new Error("Questions could not be refreshed");
+				const body = await response.json();
+				if (live) {
+					setItems(body.questions);
+					setError("");
+				}
+			} catch (e) {
+				if (live) {
+					setItems([]);
+					setError(e instanceof Error ? e.message : "Questions unavailable");
+				}
+			} finally {
+				running = false;
+			}
+		};
+		refresh();
+		const timer = setInterval(() => {
+			refresh();
+		}, 2e3);
+		return () => {
+			live = false;
+			clearInterval(timer);
+		};
+	}, [agentId]);
+	if (!items.length && !error) return null;
+	return /* @__PURE__ */ jsxs("section", {
+		"aria-label": "Agent questions",
+		className: "max-h-[40vh] min-w-0 shrink-0 space-y-3 overflow-y-auto border-t border-frost px-5 py-3",
+		children: [
+			error && /* @__PURE__ */ jsx("p", {
+				role: "status",
+				children: error
+			}),
+			items.filter((item) => item.status === "pending" || item.continuation === "unconfirmed").map((item) => /* @__PURE__ */ jsx(QuestionCard, { item }, item.id)),
+			items.some((item) => item.status !== "pending" && item.continuation !== "unconfirmed") && /* @__PURE__ */ jsxs("details", { children: [/* @__PURE__ */ jsx("summary", { children: "Recent question outcomes" }), items.filter((item) => item.status !== "pending" && item.continuation !== "unconfirmed").map((item) => /* @__PURE__ */ jsx(QuestionCard, { item }, item.id))] })
+		]
+	});
+}
+function QuestionCard({ item }) {
+	const storageKey = `bazilion-question-answer:${item.agentId}:${item.id}`;
+	const [choice, setChoice] = useState("");
+	const [text, setText] = useState("");
+	const [pending, setPending] = useState(null);
+	const pendingRef = useRef(null);
+	const [ready, setReady] = useState(false);
+	const [busy, setBusy] = useState(false);
+	const locked = useRef(false);
+	const [error, setError] = useState("");
+	const [notice, setNotice] = useState("");
+	useEffect(() => {
+		try {
+			const saved = sessionStorage.getItem(storageKey);
+			if (saved) {
+				const value = JSON.parse(saved);
+				pendingRef.current = value;
+				setPending(value);
+			}
+			setReady(true);
+		} catch {
+			setError("Answer recovery storage is unavailable. Enable session storage before answering.");
+		}
+	}, [storageKey]);
+	useEffect(() => {
+		if (item.status === "pending") return;
+		try {
+			sessionStorage.removeItem(storageKey);
+			pendingRef.current = null;
+			setPending(null);
+		} catch {}
+	}, [item.status, storageKey]);
+	async function submit(answer) {
+		if (locked.current || !ready || item.status !== "pending") return;
+		locked.current = true;
+		setBusy(true);
+		setError("");
+		try {
+			if (!pendingRef.current && !answer) throw new Error("Choose an answer first");
+			const input = pendingRef.current ?? {
+				requestId: crypto.randomUUID(),
+				conversationId: item.conversationId,
+				answer
+			};
+			sessionStorage.setItem(storageKey, JSON.stringify(input));
+			pendingRef.current = input;
+			setPending(input);
+			const response = await fetch(`/api/agents/${encodeURIComponent(item.agentId)}/questions/${encodeURIComponent(item.id)}/answer`, {
+				method: "POST",
+				headers: { "content-type": "application/json" },
+				body: JSON.stringify(input)
+			}).catch(() => {
+				throw new Error("Answer acknowledgement unavailable. Retry the same answer.");
+			});
+			if (!response.ok) {
+				if (response.status === 409 || response.status === 404) throw new Error("This question is no longer answerable. Its outcome will refresh shortly.");
+				throw new Error("Answer acknowledgement unavailable. Retry the same answer.");
+			}
+			if ((await response.json()).kind === "held") setNotice("Answer awaits communication approval. The Agent has not received it.");
+			else {
+				sessionStorage.removeItem(storageKey);
+				setNotice("Answer accepted. Waiting for saved conversation evidence that the Agent consumed it.");
+			}
+		} catch (e) {
+			setError(e instanceof Error ? e.message : "Answer failed");
+		} finally {
+			locked.current = false;
+			setBusy(false);
+		}
+	}
+	const disabled = !ready || busy || !!pending || item.status !== "pending" || !!item.answerApprovalId;
+	return /* @__PURE__ */ jsxs("article", {
+		className: "flex min-w-0 flex-col gap-3 rounded-lg border border-frost bg-ivory p-3",
+		children: [
+			/* @__PURE__ */ jsx("p", {
+				className: "m-0 break-words font-medium",
+				children: item.question.prompt
+			}),
+			/* @__PURE__ */ jsxs("details", {
+				className: "text-xs text-mocha",
+				children: [/* @__PURE__ */ jsxs("summary", {
+					className: "cursor-pointer",
+					children: ["Question details · ", item.status]
+				}), /* @__PURE__ */ jsxs("p", {
+					className: "mt-2 break-all",
+					children: [
+						"Conversation ",
+						item.conversationId,
+						" · ",
+						item.continuation
+					]
+				})]
+			}),
+			item.status === "pending" ? /* @__PURE__ */ jsxs("form", {
+				className: "flex min-w-0 flex-col gap-3",
+				onSubmit: (event) => {
+					event.preventDefault();
+					if (choice === "other") submit({
+						kind: "text",
+						text
+					});
+					else if (choice !== "") submit({
+						kind: "choice",
+						index: Number(choice)
+					});
+				},
+				children: [
+					/* @__PURE__ */ jsxs("fieldset", {
+						disabled,
+						className: "m-0 grid min-w-0 gap-2 border-0 p-0 sm:grid-cols-2",
+						children: [
+							/* @__PURE__ */ jsx("legend", {
+								className: "sr-only",
+								children: "Answer this question"
+							}),
+							item.question.choices.map((option, index) => /* @__PURE__ */ jsxs("label", {
+								className: "m-0 flex min-w-0 cursor-pointer items-center gap-2 rounded-md border border-frost px-3 py-2.5 has-[:checked]:border-sapphire has-[:checked]:bg-sapphire-glow",
+								children: [/* @__PURE__ */ jsx("input", {
+									className: "m-0 h-4 w-4 shrink-0 accent-sapphire",
+									type: "radio",
+									name: `question-${item.id}`,
+									value: index,
+									checked: choice === String(index),
+									onChange: () => setChoice(String(index))
+								}), /* @__PURE__ */ jsxs("span", {
+									className: "min-w-0 break-words [overflow-wrap:anywhere]",
+									children: [
+										option.label,
+										item.question.recommendedIndex === index ? " (Recommended)" : "",
+										option.description && /* @__PURE__ */ jsx("small", {
+											className: "block",
+											children: option.description
+										})
+									]
+								})]
+							}, index)),
+							/* @__PURE__ */ jsxs("label", {
+								className: "m-0 flex min-w-0 cursor-pointer items-center gap-2 rounded-md border border-frost px-3 py-2.5 has-[:checked]:border-sapphire has-[:checked]:bg-sapphire-glow",
+								children: [/* @__PURE__ */ jsx("input", {
+									className: "m-0 h-4 w-4 shrink-0 accent-sapphire",
+									type: "radio",
+									name: `question-${item.id}`,
+									checked: choice === "other",
+									onChange: () => setChoice("other")
+								}), /* @__PURE__ */ jsx("span", { children: "Other" })]
+							}),
+							choice === "other" && /* @__PURE__ */ jsxs("label", {
+								className: "m-0 grid gap-2 sm:col-span-2",
+								children: ["Your answer", /* @__PURE__ */ jsx("textarea", {
+									rows: 2,
+									className: "w-full resize-y",
+									value: text,
+									maxLength: 4096,
+									onChange: (event) => setText(event.target.value)
+								})]
+							})
+						]
+					}),
+					pending && /* @__PURE__ */ jsxs("p", {
+						className: "break-words",
+						children: ["Saved answer: ", pending.answer.kind === "choice" ? item.question.choices[pending.answer.index]?.label : pending.answer.kind === "text" ? pending.answer.text : "Skip"]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex flex-wrap gap-2",
+						children: [
+							/* @__PURE__ */ jsx(Button, {
+								variant: "primary",
+								type: "submit",
+								disabled: disabled || !choice || choice === "other" && (!text.trim() || new TextEncoder().encode(text).length > 4096),
+								children: "Send answer"
+							}),
+							/* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								disabled,
+								onClick: () => {
+									submit({ kind: "skip" });
+								},
+								children: "Skip"
+							}),
+							pending && !item.answerApprovalId && /* @__PURE__ */ jsx(Button, {
+								variant: "ghost",
+								disabled: busy,
+								onClick: () => {
+									submit();
+								},
+								children: "Retry same answer"
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs("p", {
+						className: "m-0 text-xs text-mocha",
+						children: [
+							"Clarification does not grant permission. This question expires at ",
+							new Date(item.expiresAt).toLocaleTimeString(),
+							"."
+						]
+					}),
+					item.answerApprovalId && /* @__PURE__ */ jsx("a", {
+						href: "/approvals",
+						children: "View communication approvals"
+					})
+				]
+			}) : /* @__PURE__ */ jsxs("p", { children: [
+				item.answer?.kind === "choice" ? item.question.choices[item.answer.index]?.label : item.answer?.kind === "text" ? item.answer.text : `No answer: ${item.noAnswerReason ?? item.status}`,
+				". ",
+				item.continuation === "consumed" ? "Saved in the originating conversation; task completion is separate." : item.continuation === "interrupted" ? "The waiting turn ended." : "Consumption has not been confirmed."
+			] }),
+			notice && /* @__PURE__ */ jsx("p", {
+				role: "status",
+				children: notice
+			}),
+			error && /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				children: error
+			})
+		]
+	});
+}
+//#endregion
 //#region src/components/ChatPane.tsx
 var INBOX_WAKE_PREFIX = "[[bazilion:inbox-wake]]\n";
 var COMPACTION_REPLAY_PREFIX = "[conversation summary]";
@@ -63,13 +1009,14 @@ function interactiveChatRequest(message, attachments) {
 	return {
 		message,
 		attachments,
-		bashApprovalMode: "interactive"
+		bashApprovalMode: "interactive",
+		questionMode: "web"
 	};
 }
 function shellApprovalsUrl(agentId) {
 	return `/api/shell-approvals?agentId=${encodeURIComponent(agentId)}`;
 }
-var SLASH_HELP = "slash commands:\n  /context           — context breakdown (system prompt, tools, skills, history)\n  /compact [N]       — summarize the head; keep the last N messages verbatim (default 10)\n  /reset             — reset chat history for this agent\n  /help              — show this list";
+var SLASH_HELP = "slash commands:\n  /context           — context breakdown (system prompt, tools, skills, history)\n  /compact [N]       — summarize the head; keep the last N messages verbatim (default 10)\n  /new               — open the retained conversation library\n  /help              — show this list";
 function prettyArgs(raw) {
 	if (!raw) return "";
 	try {
@@ -149,6 +1096,13 @@ function projectMessages(msgs) {
 			name: m.toolName ?? "",
 			body: m.content
 		});
+		if (m.result) {
+			entries.push({
+				type: "result",
+				resultId: m.result.resultId
+			});
+			openTool = null;
+		}
 		if (m.images && m.images.length > 0) {
 			entries.push({
 				type: "images",
@@ -174,7 +1128,12 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 	const [recoveredTurn, setRecoveredTurn] = useState(false);
 	const [approvalBusy, setApprovalBusy] = useState({});
 	const [approvalErrors, setApprovalErrors] = useState({});
-	const [resetConfirmOpen, setResetConfirmOpen] = useState(false);
+	const [libraryOpen, setLibraryOpen] = useState(false);
+	const [queueConversation, setQueueConversation] = useState();
+	const [queueMode, setQueueMode] = useState(false);
+	const [queueReady, setQueueReady] = useState(false);
+	const queueRef = useRef(null);
+	const [historyUnavailable, setHistoryUnavailable] = useState(initialSessionHead?.unavailable ?? false);
 	const messagesRef = useRef(null);
 	const fileInputRef = useRef(null);
 	const inputRef = useRef(null);
@@ -200,6 +1159,9 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 		setSystemBubbles([]);
 		setEditIdx(null);
 		setInput("");
+		setQueueReady(false);
+		setAttachments([]);
+		setHistoryUnavailable(initialSessionHead?.unavailable ?? false);
 		setThinking(false);
 		setStreaming(false);
 		setStaleBanner(false);
@@ -259,7 +1221,7 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 		function onVis() {
 			if (document.visibilityState === "visible" && sessionStorage.getItem(key)) {
 				sessionStorage.removeItem(key);
-				window.location.reload();
+				setStaleBanner(true);
 			}
 		}
 		document.addEventListener("visibilitychange", onVis);
@@ -277,7 +1239,7 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 					const body = await res.json();
 					if (typeof body.size === "number") {
 						const known = knownHeadRef.current;
-						if (body.file !== known.file || body.size !== known.size) setStaleBanner(true);
+						if (body.unavailable !== known.unavailable || body.file !== known.file || body.size !== known.size) setStaleBanner(true);
 					}
 				}
 			} catch {}
@@ -293,16 +1255,38 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 		initialSessionHead,
 		staleBanner
 	]);
+	async function refreshConversationHistory() {
+		if (streamingRef.current) return;
+		try {
+			const response = await fetch(`/api/agents/${encodeURIComponent(agentId)}/sessions/messages`);
+			if (!response.ok) throw new Error("Conversation history is unavailable. Your draft is preserved.");
+			const body = await response.json();
+			if (currentAgentIdRef.current !== agentId) return;
+			setHistoryUnavailable(body.head.unavailable ?? false);
+			setServerMessages(body.messages);
+			setLiveEntries([]);
+			setEditIdx(null);
+			knownHeadRef.current = body.head;
+			setStaleBanner(false);
+		} catch (error) {
+			pushSystem(error instanceof Error ? error.message : "Could not refresh conversation");
+		}
+	}
 	async function refreshKnownHead() {
 		if (currentAgentIdRef.current !== agentId) return;
 		try {
 			const res = await fetch(`/api/agents/${encodeURIComponent(agentId)}/sessions/head`);
 			if (!res.ok) return;
 			const body = await res.json();
-			if (currentAgentIdRef.current === agentId && typeof body.size === "number") knownHeadRef.current = {
-				file: body.file ?? null,
-				size: body.size
-			};
+			if (currentAgentIdRef.current === agentId && typeof body.size === "number") {
+				const prior = knownHeadRef.current.selection;
+				if (prior?.conversationId && prior.conversationId !== body.selection?.conversationId) {
+					setStaleBanner(true);
+					return;
+				}
+				setHistoryUnavailable(body.unavailable ?? false);
+				knownHeadRef.current = body;
+			}
 		} catch {}
 	}
 	function pushSystem(text) {
@@ -347,28 +1331,6 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 			pushSystem(`/context failed: ${err.message}`);
 		}
 	}
-	async function performReset() {
-		exitEditMode();
-		const res = await fetch(`/api/agents/${encodeURIComponent(agentId)}/chat/reset`, { method: "POST" });
-		if (!res.ok) {
-			let message = res.statusText;
-			try {
-				message = (await res.json()).error || message;
-			} catch {}
-			throw new Error(message);
-		}
-		setServerMessages([]);
-		setLiveEntries([]);
-		setSystemBubbles([]);
-		pushSystem("/reset: history wiped");
-	}
-	async function runResetCommand() {
-		if (serverMessages.length === 0) {
-			pushSystem("/reset: history already empty");
-			return;
-		}
-		setResetConfirmOpen(true);
-	}
 	async function runCompactCommand(rest) {
 		if (serverMessages.length < 2) {
 			pushSystem("/compact: need ≥2 messages to compact");
@@ -387,7 +1349,10 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 			const res = await fetch(`/api/agents/${encodeURIComponent(agentId)}/chat/compact`, {
 				method: "POST",
 				headers: { "content-type": "application/json" },
-				body: JSON.stringify(keepTail !== void 0 ? { keepTail } : {})
+				body: JSON.stringify({
+					keepTail,
+					expectedSelection: knownHeadRef.current.selection
+				})
 			});
 			if (!res.ok) {
 				let msg = res.statusText;
@@ -420,8 +1385,8 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 			case "/context":
 				await runContextCommand();
 				return true;
-			case "/reset":
-				await runResetCommand();
+			case "/new":
+				setLibraryOpen(true);
 				return true;
 			case "/compact":
 				await runCompactCommand(rest);
@@ -447,7 +1412,7 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 		setEditIdx(null);
 	}
 	async function addFiles(files) {
-		if (!files || turnBusy) return;
+		if (!files) return;
 		const arr = Array.from(files);
 		if (arr.length === 0) return;
 		const encoded = await Promise.all(arr.map(fileToAttachment));
@@ -463,10 +1428,6 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 	function onDragOver(e) {
 		if (!Array.from(e.dataTransfer.types).includes("Files")) return;
 		e.preventDefault();
-		if (turnBusy) {
-			setDragging(false);
-			return;
-		}
 		setDragging(true);
 	}
 	function onDragLeave(e) {
@@ -476,12 +1437,22 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 		if (e.dataTransfer.files.length === 0) return;
 		e.preventDefault();
 		setDragging(false);
-		if (turnBusy) return;
 		addFiles(e.dataTransfer.files);
 	}
 	const send = useCallback(async (text) => {
 		const atts = attachments;
-		if (!text.trim() && atts.length === 0 || turnBusy) return;
+		if (!text.trim() && atts.length === 0) return;
+		if (!queueReady) {
+			pushSystem("Queue status is loading. Your draft is preserved.");
+			return;
+		}
+		if (turnBusy || queueMode) {
+			if (await queueRef.current?.enqueue(text, atts, knownHeadRef.current.selection) && currentAgentIdRef.current === agentId) {
+				setInput((current) => current === text ? "" : current);
+				setAttachments((current) => current === atts ? [] : current);
+			}
+			return;
+		}
 		setInput("");
 		if (await maybeHandleSlashCommand(text)) return;
 		setAttachments([]);
@@ -492,7 +1463,10 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 				const res = await fetch(`/api/agents/${encodeURIComponent(agentId)}/chat/truncate`, {
 					method: "POST",
 					headers: { "content-type": "application/json" },
-					body: JSON.stringify({ keepCount: keep })
+					body: JSON.stringify({
+						keepCount: keep,
+						expectedSelection: knownHeadRef.current.selection
+					})
 				});
 				if (!res.ok) {
 					let err = res.statusText;
@@ -535,7 +1509,10 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 			const res = await fetch(`/api/agents/${encodeURIComponent(agentId)}/chat`, {
 				method: "POST",
 				headers: { "content-type": "application/json" },
-				body: JSON.stringify(interactiveChatRequest(text, atts)),
+				body: JSON.stringify({
+					...interactiveChatRequest(text, atts),
+					expectedSelection: knownHeadRef.current.selection
+				}),
 				signal: abort.signal
 			});
 			if (res.status === 202) {
@@ -547,6 +1524,15 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 				sessionStorage.removeItem(`bz_pending_${agentId}`);
 				return;
 			}
+			if (res.status === 409) {
+				setInput(text);
+				setAttachments(atts);
+				setLiveEntries([]);
+				setStaleBanner(true);
+				sessionStorage.removeItem(`bz_pending_${agentId}`);
+				pushSystem("Conversation changed. Refresh history, then review and send your preserved draft.");
+				return;
+			}
 			if (!res.ok || !res.body) {
 				let err = res.statusText;
 				try {
@@ -558,6 +1544,14 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 				}]);
 				return;
 			}
+			const admittedSelection = res.headers.get("x-bazilion-conversation-selection");
+			if (admittedSelection) try {
+				const selection = JSON.parse(admittedSelection);
+				if (typeof selection.conversationId === "string" && Number.isSafeInteger(selection.revision) && selection.revision >= 0) knownHeadRef.current = {
+					...knownHeadRef.current,
+					selection
+				};
+			} catch {}
 			const reader = res.body.getReader();
 			const decoder = new TextDecoder();
 			let buffer = "";
@@ -605,6 +1599,8 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 		editIdx,
 		serverMessages,
 		turnBusy,
+		queueMode,
+		queueReady,
 		attachments
 	]);
 	function handleFrame(frame) {
@@ -716,6 +1712,14 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 			return;
 		}
 		if (ev.type === "file") {
+			if (ev.result) {
+				const resultId = ev.result.resultId;
+				setLiveEntries((prev) => [...prev, {
+					type: "result",
+					resultId
+				}]);
+				return;
+			}
 			setLiveEntries((prev) => [...prev, {
 				type: "file",
 				name: ev.name,
@@ -790,31 +1794,7 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 		}
 	}
 	async function cancel() {
-		const hasLocalStream = currentAbortRef.current !== null;
-		try {
-			const res = await fetch(`/api/agents/${encodeURIComponent(agentId)}/cancel`, { method: "POST" });
-			if (currentAgentIdRef.current !== agentId) return;
-			if (res.ok || res.status === 204) {
-				if (!hasLocalStream) {
-					commandApprovalTurnRef.current = false;
-					setLiveEntries((entries) => entries.map((entry) => entry.type === "command_approval" && entry.approval.status === "pending" ? {
-						type: "command_approval",
-						approval: {
-							...entry.approval,
-							status: "cancelled"
-						}
-					} : entry));
-					setRecoveredTurn(false);
-				}
-				return;
-			}
-		} catch {}
-		if (currentAgentIdRef.current !== agentId) return;
-		if (hasLocalStream) currentAbortRef.current?.abort();
-		else setLiveEntries((entries) => [...entries, {
-			type: "error",
-			content: "[cancel failed] could not reach the active turn"
-		}]);
+		if (!await queueRef.current?.stop() && currentAgentIdRef.current === agentId) pushSystem("Stop was not confirmed. Check queue controls and try again; the active response may still be running.");
 	}
 	function onKeyDown(e) {
 		if (e.key === "Enter" && !e.shiftKey && !e.nativeEvent.isComposing) {
@@ -866,6 +1846,20 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 					children: "Manage agent →"
 				})]
 			}),
+			/* @__PURE__ */ jsx("div", {
+				className: "mx-5 mt-2",
+				children: /* @__PURE__ */ jsx(Button, {
+					variant: "ghost",
+					"aria-expanded": libraryOpen,
+					onClick: () => setLibraryOpen((value) => !value),
+					children: libraryOpen ? "Close conversations" : "Conversations"
+				})
+			}),
+			historyUnavailable && /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "mx-5 mt-2 text-sm",
+				children: "Selected conversation history is unavailable. Open Conversations to start a new one; retained history and files stay listed."
+			}),
 			staleBanner && /* @__PURE__ */ jsxs("div", {
 				role: "status",
 				"aria-live": "polite",
@@ -882,7 +1876,7 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 					}),
 					/* @__PURE__ */ jsx("button", {
 						type: "button",
-						onClick: () => window.location.reload(),
+						onClick: () => void refreshConversationHistory(),
 						className: "rounded-sm bg-sapphire px-3 py-1 text-[0.92em] text-snow hover:opacity-90",
 						children: "reload"
 					}),
@@ -903,9 +1897,16 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 				"aria-live": "polite",
 				"aria-relevant": "additions",
 				"aria-busy": turnBusy,
-				className: `min-h-[240px] flex-1 overflow-y-auto px-5 py-5 ${editIdx !== null ? "is-editing" : ""}`,
+				className: `min-h-0 flex-1 overflow-y-auto px-5 py-5 ${editIdx !== null ? "is-editing" : ""}`,
 				children: [
-					baseEntries.length === 0 && liveEntries.length === 0 && systemBubbles.length === 0 && /* @__PURE__ */ jsx("p", {
+					libraryOpen && /* @__PURE__ */ jsx(ConversationLibrary, {
+						initialConversationId: queueConversation,
+						agentId,
+						turnBusy,
+						onCreated: refreshConversationHistory,
+						renderHistory: (messages) => /* @__PURE__ */ jsx(ResultTranscript, { messages })
+					}, agentId),
+					!historyUnavailable && baseEntries.length === 0 && liveEntries.length === 0 && systemBubbles.length === 0 && /* @__PURE__ */ jsx("p", {
 						className: "py-12 text-center italic text-mocha-light",
 						children: "Start a conversation…"
 					}),
@@ -994,7 +1995,7 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 				})]
 			}),
 			attachments.length > 0 && /* @__PURE__ */ jsx("div", {
-				className: "flex flex-wrap gap-2 border-t border-frost bg-ivory px-5 pt-3",
+				className: "flex max-h-24 shrink-0 flex-wrap gap-2 overflow-y-auto border-t border-frost bg-ivory px-5 pt-3",
 				children: attachments.map((a, i) => {
 					const remove = () => setAttachments((prev) => prev.filter((_, j) => j !== i));
 					return isImageMime(a.mimeType) ? /* @__PURE__ */ jsxs("div", {
@@ -1029,8 +2030,22 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 					}, `${a.name ?? "file"}-${i}`);
 				})
 			}),
+			/* @__PURE__ */ jsx(UserQueuePanel, {
+				onViewConversation: (id) => {
+					setQueueConversation(id);
+					setLibraryOpen(true);
+				},
+				ref: queueRef,
+				agentId,
+				selection: () => knownHeadRef.current.selection,
+				onQueueMode: (mode) => {
+					setQueueMode(mode);
+					setQueueReady(true);
+				}
+			}, agentId),
+			/* @__PURE__ */ jsx(AgentQuestions, { agentId }, `questions-${agentId}`),
 			/* @__PURE__ */ jsxs("form", {
-				className: "grid grid-cols-[auto_minmax(0,1fr)_auto] items-end gap-2 border-t border-frost bg-ivory px-3 py-3 sm:px-5",
+				className: "grid shrink-0 grid-cols-[auto_minmax(0,1fr)] items-end gap-2 border-t border-frost bg-ivory px-3 py-3 sm:grid-cols-[auto_minmax(0,1fr)_auto] sm:px-5",
 				onSubmit: (e) => {
 					e.preventDefault();
 					send(input);
@@ -1049,10 +2064,9 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 					/* @__PURE__ */ jsx("button", {
 						type: "button",
 						onClick: () => fileInputRef.current?.click(),
-						disabled: turnBusy,
 						title: "attach images or files",
 						"aria-label": "attach files",
-						className: "rounded-md border-[1.5px] border-frost bg-snow px-3 py-2 text-[1em] text-mocha transition-colors hover:border-sapphire hover:text-sapphire disabled:cursor-not-allowed disabled:opacity-50",
+						className: "flex h-11 items-center justify-center rounded-md border-[1.5px] border-frost bg-snow px-3 py-2 text-[1em] text-mocha transition-colors hover:border-sapphire hover:text-sapphire disabled:cursor-not-allowed disabled:opacity-50",
 						children: "📎"
 					}),
 					/* @__PURE__ */ jsx("textarea", {
@@ -1062,40 +2076,29 @@ function ChatPane({ agentId, agentName, initialMessages, initialSessionHead }) {
 						onChange: (e) => setInput(e.target.value),
 						onKeyDown,
 						onPaste,
-						disabled: turnBusy,
-						placeholder: "say something… (Shift+Enter for newline; paste or 📎 to attach images/files)",
+						placeholder: "Write a message…",
+						title: "Shift+Enter for a new line. Paste or attach files with the paperclip.",
 						autoComplete: "off",
 						"aria-label": `Message ${agentName}`,
-						className: "max-h-[200px] min-h-[2.4rem] flex-1 resize-none overflow-y-auto rounded-md border-[1.5px] border-frost bg-snow px-3 py-2 text-[0.93em] leading-[1.45] text-chocolate outline-none transition-colors focus:border-sapphire focus:shadow-[0_0_0_3px_var(--color-sapphire-glow)]"
+						className: "max-h-[200px] min-h-11 min-w-0 flex-1 resize-none overflow-y-auto rounded-md border-[1.5px] border-frost bg-snow px-3 py-2 text-[0.93em] leading-[1.45] text-chocolate outline-none transition-colors focus:border-sapphire focus:shadow-[0_0_0_3px_var(--color-sapphire-glow)]"
 					}),
-					turnBusy ? /* @__PURE__ */ jsx("button", {
-						type: "button",
-						onClick: cancel,
-						"aria-label": "Cancel current response",
-						className: "rounded-md border-[1.5px] border-danger bg-transparent px-3 py-2 text-[0.92em] font-medium text-danger hover:bg-danger/10",
-						children: "Cancel"
-					}) : /* @__PURE__ */ jsx("button", {
-						type: "submit",
-						disabled: !input.trim() && attachments.length === 0,
-						className: "rounded-md bg-sapphire px-4 py-2 text-[0.92em] font-semibold text-snow transition-colors hover:bg-sapphire-deep disabled:cursor-not-allowed disabled:opacity-50",
-						children: "Send"
+					/* @__PURE__ */ jsxs("div", {
+						className: "col-span-2 flex flex-wrap justify-end gap-2 sm:col-span-1",
+						children: [/* @__PURE__ */ jsx(Button, {
+							variant: "primary",
+							type: "submit",
+							className: "min-h-11 whitespace-normal text-center",
+							disabled: !input.trim() && attachments.length === 0,
+							children: turnBusy || queueMode ? "Queue follow-up" : "Send"
+						}), turnBusy && /* @__PURE__ */ jsx(Button, {
+							variant: "danger",
+							className: "min-h-11",
+							onClick: () => void cancel(),
+							"aria-label": "Stop response and pause queue",
+							children: "Stop"
+						})]
 					})
 				]
-			}),
-			/* @__PURE__ */ jsx(ConfirmDialog, {
-				open: resetConfirmOpen,
-				onOpenChange: setResetConfirmOpen,
-				title: `Reset chat with ${agentName}?`,
-				description: /* @__PURE__ */ jsx("p", { children: "This permanently wipes the persisted session history for this Agent. Agent files, Team memory, and other Agent settings are not changed." }),
-				confirmLabel: "Reset chat history",
-				onConfirm: async () => {
-					try {
-						await performReset();
-					} catch (error) {
-						pushSystem(`/reset failed: ${error instanceof Error ? error.message : String(error)}`);
-						throw error;
-					}
-				}
 			})
 		]
 	});
@@ -1202,6 +2205,7 @@ function Bubble({ entry, markdownReady, isLastUser, isWillDrop, onEdit, onComman
 			className: "block max-w-full rounded-lg border border-fawn"
 		}, i))
 	});
+	if (entry.type === "result") return /* @__PURE__ */ jsx(ResultCard, { resultId: entry.resultId });
 	if (entry.type === "file") {
 		const isImage = entry.mimeType.startsWith("image/");
 		const href = `data:${entry.mimeType};base64,${entry.data}`;
@@ -1425,5 +2429,16 @@ function Dot({ delay = "0s" }) {
 		"aria-hidden": "true"
 	});
 }
+/** Read-only projection used when opening the exact available source of a saved result. */
+function ResultTranscript({ messages }) {
+	const markdownReady = useSyncExternalStore(subscribeToHydration, browserMarkdownReady, serverMarkdownReady);
+	return /* @__PURE__ */ jsx("div", {
+		"aria-label": "Source conversation",
+		children: projectMessages(messages).map((entry, index) => /* @__PURE__ */ jsx(Bubble, {
+			entry,
+			markdownReady
+		}, index))
+	});
+}
 //#endregion
-export { ChatPane as t };
+export { ResultTranscript as n, ChatPane as t };