tags (but keep content).
let cleaned = raw;
if (_OC_FINAL_TAG_RE.test(cleaned)) {
_OC_FINAL_TAG_RE.lastIndex = 0;
const fences = _findCodeFenceRegions(cleaned);
const matches = [];
for (const m of cleaned.matchAll(_OC_FINAL_TAG_RE)) {
const idx = m.index ?? 0;
matches.push({ idx, len: m[0].length, inCode: _isInsideRegion(idx, fences) });
}
for (let i = matches.length - 1; i >= 0; i -= 1) {
const mm = matches[i];
if (mm.inCode) continue;
cleaned = cleaned.slice(0, mm.idx) + cleaned.slice(mm.idx + mm.len);
}
} else {
_OC_FINAL_TAG_RE.lastIndex = 0;
}
const fences = _findCodeFenceRegions(cleaned);
_OC_THINKING_TAG_RE.lastIndex = 0;
let out = "";
let last = 0;
let inThinking = false;
for (const m of cleaned.matchAll(_OC_THINKING_TAG_RE)) {
const idx = m.index ?? 0;
const isClose = m[1] === "/";
if (_isInsideRegion(idx, fences)) continue;
if (!inThinking) {
out += cleaned.slice(last, idx);
if (!isClose) inThinking = true;
} else if (isClose) {
inThinking = false;
}
last = idx + m[0].length;
}
if (!inThinking || mode === "preserve") out += cleaned.slice(last);
return out;
}
function extractThinkingFromText(text) {
const raw = String(text || "");
if (!raw) return "";
const blocks = [];
for (const re of [RE_REDACTED_THINKING, RE_THINK_TAG, RE_THINKING_TAG, RE_THOUGHT_TAG]) {
const rr = new RegExp(re.source, "gi");
for (const m of raw.matchAll(rr)) {
const inner = String(m[1] || "").trim();
if (inner) blocks.push(inner);
}
}
return blocks.join("\n");
}
function extractWsAssistantText(message) {
if (!message || typeof message !== "object") return "";
const m = message;
if (typeof m.content === "string") return decodeEscapedNewlines(String(m.content || ""));
if (typeof m.text === "string") return decodeEscapedNewlines(String(m.text || ""));
const c = Array.isArray(m.content) ? m.content : [];
const parts = c
.map((x) => {
if (!x || typeof x !== "object") return "";
if (String(x.type || "") === "text") return decodeEscapedNewlines(String(x.text || ""));
return "";
})
.filter(Boolean);
return parts.join("\n");
}
function decodeEscapedNewlines(text) {
return String(text || "").replace(/\\n/g, "\n").replace(/\\N/g, "\n");
}
function normalizeStreamText(raw) {
return String(raw || "")
.replace(/^\s*\n+/, "")
.replace(/\n{3,}/g, "\n\n");
}
// Streaming surface should be smooth and avoid newline explosions.
function normalizeStreamDisplayText(raw) {
return String(raw || "")
.replace(/\r/g, "")
.replace(/^\s*\n+/, "")
.replace(/\n+/g, " ")
.replace(/[ \t]{2,}/g, " ")
.trimStart();
}
// Streaming-only: user prefers a more "natural" flow without many newlines.
function normalizeStreamBodyForUi(raw) {
return String(raw || "")
.replace(/^\s*\n+/, "")
.replace(/\r/g, "")
// Collapse pathological newline runs but keep paragraph breaks.
// 3+ newlines => 2 newlines; trim leading newlines.
.replace(/\n{3,}/g, "\n\n");
}
// Oclaw-style streaming stitcher: reduce boundary artifacts without destroying layout.
function createStreamStitcher() {
let prevTail = "";
return {
push(delta) {
let s = String(delta || "");
if (!s) return "";
s = s.replace(/\r/g, "");
// If previous ended with newline and delta starts with newline(s), drop the leading ones.
if (prevTail.endsWith("\n") && s.startsWith("\n")) {
s = s.replace(/^\n+/, "\n");
}
// If previous ended with a space and delta starts with space/newline, trim the head.
if (/[ \t]$/.test(prevTail) && /^[ \t\n]/.test(s)) {
s = s.replace(/^[ \t\n]+/, " ");
}
// Avoid 3+ newlines caused by chunk boundaries.
s = s.replace(/\n{3,}/g, "\n\n");
prevTail = (prevTail + s).slice(-12);
return s;
},
};
}
function formatToolPanelText(name, payload, options = {}) {
const streamMode = !!(options && options.streamMode);
const truncateToolPanel = (s) => {
const raw = String(s || "").trim();
if (streamMode) return raw;
const maxChars = 4000;
if (raw.length <= maxChars) return raw;
return `${raw.slice(0, maxChars)}\n\n…（为保证界面性能，已截断 ${raw.length - maxChars} 字符）`;
};
const n = String(name || "").trim() || "tool";
const p = payload && typeof payload === "object" ? payload : {};
if (String(p.phase || "") === "call" && (p.tool_name != null || p.arguments !== undefined)) {
const tn = String(p.tool_name || "").trim() || "tool";
let argsStr = "";
try {
argsStr =
p.arguments && typeof p.arguments === "object"
? JSON.stringify(p.arguments, null, 2)
: String(p.arguments ?? "");
} catch (_) {
argsStr = String(p.arguments ?? "");
}
const tid = String(p.tool_call_id || "").trim();
const head = currentLang === "zh" ? `[调用] ${tn}` : `[call] ${tn}`;
return normalizeStreamText([head, tid ? `tool_call_id: ${tid}` : "", "", argsStr].filter(Boolean).join("\n"));
}
const r = p.result && typeof p.result === "object" ? p.result : p;
// SQL audit payload: keep line breaks and key fields visible.
if (r && typeof r === "object" && (r.input_sql || r.executed_sql || r.sql_guard)) {
const guard = r.sql_guard && typeof r.sql_guard === "object" ? r.sql_guard : {};
const lines = [
`${n}`,
`[SQL] input`,
String(r.input_sql || ""),
"",
`[SQL] executed`,
String(r.executed_sql || ""),
"",
`[Guard]`,
`readonly_enforced=${String(!!guard.readonly_enforced)}`,
`multi_statement_forbidden=${String(!!guard.multi_statement_forbidden)}`,
`auto_limit_applied=${String(!!guard.auto_limit_applied)}`,
`result_row_cap=${String(guard.result_row_cap != null ? guard.result_row_cap : "")}`,
`engine=${String(r.engine || "")}`,
`rows_returned=${String(r.rows_returned != null ? r.rows_returned : "")}`,
];
return truncateToolPanel(lines.join("\n").trim());
}
let body = "";
// Prefer human-readable text from tool content blocks when available.
try {
const content = Array.isArray(r.content) ? r.content : [];
const textBlock = content.find((x) => x && typeof x === "object" && String(x.type || "") === "text");
const text = textBlock ? String(textBlock.text || "") : "";
if (text.trim()) body = text;
} catch (_) {}
if (!body) {
try {
body = JSON.stringify(r, null, 2);
} catch (_) {
body = String(r || "");
}
}
body = normalizeStreamText(body);
return `${n}\n${truncateToolPanel(body)}`.trim();
}
function extractSqlAuditPayload(payload) {
const p = payload && typeof payload === "object" ? payload : {};
const r = p.result && typeof p.result === "object" ? p.result : p;
if (!r || typeof r !== "object") return null;
const inputSql = String(r.input_sql || "");
const executedSql = String(r.executed_sql || "");
if (!inputSql && !executedSql && !(r.sql_guard && typeof r.sql_guard === "object")) return null;
const guard = r.sql_guard && typeof r.sql_guard === "object" ? r.sql_guard : {};
return {
inputSql,
executedSql,
guard,
engine: String(r.engine || ""),
rowsReturned: r.rows_returned != null ? Number(r.rows_returned) : null,
};
}
function extractToolImageItems(payload) {
const _toObj = (v) => {
if (v && typeof v === "object") return v;
if (typeof v !== "string") return null;
const s = String(v || "").trim();
if (!s) return null;
try {
const j = JSON.parse(s);
return j && typeof j === "object" ? j : null;
} catch (_) {
return null;
}
};
const p = _toObj(payload) || {};
const cands = [p, _toObj(p.payload), _toObj(p.result), _toObj(p.payload && p.payload.result), _toObj(p.result && p.result.result)].filter(Boolean);
const out = [];
for (const cand of cands) {
const content = Array.isArray(cand.content) ? cand.content : [];
for (const item of content) {
if (!item || typeof item !== "object") continue;
const typ = String(item.type || "").trim().toLowerCase();
if (typ === "image" || typ === "input_image") {
const srcObj = item.source && typeof item.source === "object" ? item.source : {};
const b64 = String(item.image_base64 || item.data || srcObj.data || "").trim();
if (!b64) continue;
const mime = String(item.mime_type || item.mime || srcObj.media_type || "image/png").trim() || "image/png";
out.push({ type: "image", src: `data:${mime};base64,${b64.replace(/\s/g, "")}` });
continue;
}
if (typ === "image_url") {
const urlObj = item.image_url && typeof item.image_url === "object" ? item.image_url : {};
const url = String(item.url || item.image_url || urlObj.url || "").trim();
if (!url) continue;
out.push({ type: "image_url", src: url });
}
}
}
// Fallback: direct attachment-like payload shape.
const direct = _toObj(p.attachments);
const atts = Array.isArray(direct) ? direct : [];
for (const a of atts) {
if (!a || typeof a !== "object") continue;
const t = String(a.type || "").toLowerCase();
if (t === "image" || t === "input_image") {
const b64 = String(a.image_base64 || a.data || "").trim();
if (!b64) continue;
const mime = String(a.mime || a.mime_type || "image/png").trim() || "image/png";
out.push({ type: "image", src: `data:${mime};base64,${b64.replace(/\s/g, "")}` });
} else if (t === "image_url") {
const src = String(a.url || a.image_url || "").trim();
if (src) out.push({ type: "image_url", src });
}
}
// De-dup by src.
const uniq = [];
const seen = new Set();
for (const it of out) {
const k = String((it && it.src) || "");
if (!k || seen.has(k)) continue;
seen.add(k);
uniq.push(it);
}
return uniq;
}
function _sqlLimitSuffix(inputSql, executedSql) {
const a = String(inputSql || "").trim();
const b = String(executedSql || "").trim();
if (!a || !b || b.length <= a.length) return "";
const lowerA = a.toLowerCase();
const lowerB = b.toLowerCase();
if (lowerB.startsWith(lowerA)) {
const suffix = b.slice(a.length);
if (/^\s*limit\s+\d+\s*$/i.test(suffix)) return suffix.trim();
}
return "";
}
function _tokenizeSqlForDiff(sqlText) {
const s = String(sqlText || "");
return s.match(/\s+|[^\s]+/g) || [];
}
function _renderExecutedSqlWithAddedHighlight(inputSql, executedSql) {
const a = _tokenizeSqlForDiff(inputSql);
const b = _tokenizeSqlForDiff(executedSql);
if (!a.length) return escapeHtml(String(executedSql || ""));
// LCS-based diff: mark tokens present only in executed SQL.
const m = a.length;
const n = b.length;
const dp = Array.from({ length: m + 1 }, () => new Array(n + 1).fill(0));
for (let i = m - 1; i >= 0; i -= 1) {
for (let j = n - 1; j >= 0; j -= 1) {
if (a[i] === b[j]) dp[i][j] = dp[i + 1][j + 1] + 1;
else dp[i][j] = Math.max(dp[i + 1][j], dp[i][j + 1]);
}
}
let i = 0;
let j = 0;
const out = [];
while (i < m && j < n) {
if (a[i] === b[j]) {
out.push(escapeHtml(b[j]));
i += 1;
j += 1;
} else if (dp[i + 1][j] >= dp[i][j + 1]) {
i += 1;
} else {
out.push(
`${escapeHtml(b[j])}`,
);
j += 1;
}
}
while (j < n) {
out.push(
`${escapeHtml(b[j])}`,
);
j += 1;
}
return out.join("");
}
function formatChatTimestamp(iso) {
const s = String(iso || "").trim();
if (!s) return "";
const d = new Date(s);
if (Number.isNaN(d.getTime())) return s;
const loc = currentLang === "zh" ? "zh-CN" : "en-US";
try {
return d.toLocaleString(loc, {
year: "numeric",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
hour12: false,
});
} catch (_) {
return s;
}
}
function prependMessageTime(node, tsIso) {
const txt = formatChatTimestamp(tsIso);
if (!txt || !node) return;
node.insertBefore(el("div", { class: "chat-msg__time", text: txt }), node.firstChild);
}
const CHAT_BOT_LOGO_SRC = "/admin/brand-assets/logo.svg";
const CHAT_BOT_LOGO_FALLBACK_SRC = "/admin/assets/oliver.svg";
/** 内置默认用户头像（与助手头像同尺寸与底栏样式，SVG） */
const DEFAULT_USER_AVATAR_SRC = "/admin/assets/default-user-avatar.svg";
let meProfile = null;
async function loadMeProfile() {
try {
const r = await apiGet("/admin/api/chat/profile");
meProfile = r && r.ok && r.profile ? r.profile : null;
} catch (_) {
meProfile = null;
}
}
function buildBotAvatarImg() {
const img = el("img", {
class: "chat-avatar chat-avatar--bot",
src: CHAT_BOT_LOGO_SRC,
alt: "",
loading: "lazy",
});
img.addEventListener(
"error",
() => {
if (img.dataset.logoFallbackApplied === "1") return;
img.dataset.logoFallbackApplied = "1";
img.src = CHAT_BOT_LOGO_FALLBACK_SRC;
},
{ once: true },
);
return img;
}
function buildUserAvatarSlot() {
const wrap = el("div", { class: "chat-avatar-slot" });
const cur = el("img", {
class: "chat-avatar chat-avatar--img chat-avatar--userBuiltin",
src: DEFAULT_USER_AVATAR_SRC,
alt: "",
loading: "lazy",
});
wrap.appendChild(cur);
const aid = meProfile && String(meProfile.avatar_attachment_id || "").trim();
if (aid) {
fetchAttachmentBlobUrl(aid).then((url) => {
if (!url || !cur.parentNode) return;
cur.classList.remove("chat-avatar--userBuiltin");
cur.classList.add("chat-avatar--userPhoto");
cur.src = url;
});
}
return wrap;
}
function wrapAssistantMessage(innerRoot, tsIso) {
const col = el("div", { class: "chat-msg-col chat-msg-col--assistant" });
prependMessageTime(col, tsIso);
col.appendChild(innerRoot);
const row = el("div", { class: "chat-row chat-row--assistant" });
row.appendChild(buildBotAvatarImg());
row.appendChild(col);
return row;
}
function wrapUserMessage(innerRoot, tsIso) {
const col = el("div", { class: "chat-msg-col chat-msg-col--user" });
prependMessageTime(col, tsIso);
col.appendChild(innerRoot);
const row = el("div", { class: "chat-row chat-row--user" });
row.appendChild(col);
row.appendChild(buildUserAvatarSlot());
return row;
}
async function buildMessageBubble(role, content, tsIso) {
const r = String(role || "").toLowerCase();
const rawText = decodeEscapedNewlines(String(content ?? ""));
const text =
r === "assistant" && !adminChatShowToolOutput ? stripReasoningTagsFromText(rawText, { mode: "strict" }) : rawText;
let inner;
if (r === "user") {
inner = el("div", { class: "chat-msg chat-msg--user" });
inner.appendChild(el("div", { class: "chat-msg__md", html: renderMarkdownHtml(text) }));
return wrapUserMessage(inner, tsIso);
}
if (r === "tool" || r === "function") {
inner = el("div", { class: "chat-msg chat-msg--tool" });
inner.appendChild(el("div", { class: "chat-msg__md", html: renderMarkdownHtml(text) }));
return wrapAssistantMessage(inner, tsIso);
}
if (r !== "assistant") {
inner = el("div", { class: "chat-msg chat-msg--assistant" });
inner.appendChild(el("div", { class: "chat-msg__md", html: renderMarkdownHtml(text) }));
return wrapAssistantMessage(inner, tsIso);
}
const segs = parseReasoningSegments(text);
const onlyText = segs.length === 1 && segs[0].type === "text";
if (onlyText) {
inner = el("div", { class: "chat-msg chat-msg--assistant" });
inner.appendChild(el("div", { class: "chat-msg__md", html: renderMarkdownHtml(segs[0].text) }));
} else {
inner = el("div", { class: "chat-msg chat-msg--assistant chat-msg--rich" });
const collapsedItems = [];
for (const seg of segs) {
if (seg.type === "text") {
let body = String(seg.text || "");
const prev = inner.lastElementChild;
if (prev && prev.classList && prev.classList.contains("chat-msg__reasoning")) {
body = body.replace(/^\s+/, "");
}
if (!body.trim()) continue;
inner.appendChild(el("div", { class: "chat-msg__md", html: renderMarkdownHtml(body) }));
} else {
if (adminChatShowToolOutput) collapsedItems.push({ title: t("reasoning.summary"), text: seg.text || "—" });
}
}
if (collapsedItems.length) {
const det = document.createElement("details");
det.className = "chat-msg__reasoning";
const sum = document.createElement("summary");
sum.textContent = t("reasoning.summary");
det.appendChild(sum);
for (const it of collapsedItems) {
const title = String((it && it.title) || "");
const text = String((it && it.text) || "");
if (!text.trim()) continue;
det.appendChild(_collapsedBlockNode(title || t("reasoning.summary"), text));
}
inner.insertBefore(det, inner.firstChild);
}
}
const hasVisible =
!!inner.querySelector(".chat-msg__md, .chat-msg__reasoning, .chat-msg__wiki") ||
String(inner.textContent || "").trim().length > 0;
if (!hasVisible) {
inner.appendChild(el("div", { class: "muted", text: t("chat.tools.hidden") }));
}
return wrapAssistantMessage(inner, tsIso);
}
const _blobUrlCache = new Map();
const _attachmentTextPreviewCache = new Map();
async function fetchAttachmentBlobUrl(attachmentId) {
const aid = String(attachmentId || "").trim();
if (!aid) return null;
if (_blobUrlCache.has(aid)) return _blobUrlCache.get(aid);
const token = localStorage.getItem(AUTH_TOKEN_KEY) || "";
const res = await fetch(`/admin/api/chat/attachments/${encodeURIComponent(aid)}`, {
headers: token ? { authorization: `Bearer ${token}` } : {},
});
if (!res.ok) return null;
const blob = await res.blob();
const url = URL.createObjectURL(blob);
_blobUrlCache.set(aid, url);
return url;
}
async function fetchAttachmentTextPreview(attachmentId, maxChars = 1800) {
const aid = String(attachmentId || "").trim();
if (!aid) return "";
if (_attachmentTextPreviewCache.has(aid)) return _attachmentTextPreviewCache.get(aid) || "";
const token = localStorage.getItem(AUTH_TOKEN_KEY) || "";
const res = await fetch(`/admin/api/chat/attachments/${encodeURIComponent(aid)}`, {
headers: token ? { authorization: `Bearer ${token}` } : {},
});
if (!res.ok) throw new Error(`preview_http_${res.status}`);
const blob = await res.blob();
const txt = String(await blob.text());
const out = txt.length > maxChars ? `${txt.slice(0, maxChars)}\n…` : txt;
_attachmentTextPreviewCache.set(aid, out);
return out;
}
function parseAttachments(raw) {
if (raw == null || raw === "") return [];
if (Array.isArray(raw)) return raw.filter((x) => x && typeof x === "object");
if (typeof raw === "object" && !Array.isArray(raw)) {
return [raw];
}
if (typeof raw === "string") {
const s = raw.trim();
if (!s || s === "null") return [];
try {
const j = JSON.parse(s);
if (Array.isArray(j)) return j.filter((x) => x && typeof x === "object");
if (j && typeof j === "object") return [j];
} catch (_) {
return [];
}
}
return [];
}
async function renderAttachmentsEl(raw) {
const list = parseAttachments(raw);
if (!list.length) return null;
const wrap = el("div", { class: "chat-att-wrap" });
const isTextLikeMime = (mime) => {
const m = String(mime || "").trim().toLowerCase();
if (!m) return false;
if (m.startsWith("text/")) return true;
return (
m.includes("json") ||
m.includes("xml") ||
m.includes("yaml") ||
m.includes("yml") ||
m.includes("csv") ||
m.includes("javascript") ||
m.includes("typescript")
);
};
const buildRefCard = async (att, typ) => {
const aid = String(att.attachment_id || att.attachmentId || "").trim();
const mime = String(att.mime || att.mime_type || "application/octet-stream").trim();
const name = String(att.name || `${typ || "attachment"}`).trim();
const bytes = Number(att.bytes || 0);
const sizeLabel = bytes > 0 ? `${Math.round((bytes / 1024) * 10) / 10} KB` : "";
const card = el("div", { class: "chat-att-ref" });
card.appendChild(el("div", { class: "chat-att-ref__name", text: name }));
card.appendChild(el("div", { class: "chat-att-ref__meta", text: `${typ} · ${mime}${sizeLabel ? ` · ${sizeLabel}` : ""}` }));
if (aid) card.appendChild(el("div", { class: "chat-att-ref__meta", text: `id: ${aid.slice(0, 16)}...` }));
if (aid) {
const url = await fetchAttachmentBlobUrl(aid);
if (url) {
card.appendChild(
el("a", {
class: "chat-att-ref__link",
href: url,
target: "_blank",
rel: "noopener noreferrer",
download: name || undefined,
text: t("chat.attachment.download"),
}),
);
if (String(typ || "") === "video_ref" && mime.toLowerCase().startsWith("video/")) {
card.appendChild(
el("video", {
class: "chat-att-video",
controls: true,
preload: "metadata",
style: "max-width:100%;max-height:420px;margin-top:8px;border-radius:8px;",
src: url,
}),
);
}
}
} else {
const remote = String(att.url || "").trim();
if (remote && String(typ || "") === "video_ref" && mime.toLowerCase().startsWith("video/")) {
card.appendChild(
el("video", {
class: "chat-att-video",
controls: true,
preload: "metadata",
style: "max-width:100%;max-height:420px;margin-top:8px;border-radius:8px;",
src: remote,
}),
);
card.appendChild(
el("a", {
class: "chat-att-ref__link",
href: remote,
target: "_blank",
rel: "noopener noreferrer",
text: t("chat.attachment.download"),
}),
);
}
}
const canPreviewText = !!aid && (String(typ || "") === "text_ref" || isTextLikeMime(mime));
if (canPreviewText) {
const preview = el("button", {
type: "button",
class: "chat-att-ref__btn",
text: t("chat.attachment.preview"),
});
const pre = el("pre", { class: "chat-att-ref__preview" });
preview.addEventListener("click", async () => {
if (!pre.hidden) {
pre.hidden = true;
preview.textContent = t("chat.attachment.preview");
return;
}
preview.disabled = true;
preview.textContent = t("chat.attachment.previewLoading");
try {
const txt = await fetchAttachmentTextPreview(aid);
pre.textContent = txt || t("chat.attachment.previewEmpty");
} catch (_) {
pre.textContent = t("chat.attachment.previewError");
} finally {
pre.hidden = false;
preview.disabled = false;
preview.textContent = t("chat.attachment.preview");
}
});
card.appendChild(preview);
card.appendChild(pre);
}
return card;
};
for (const att of list) {
if (!att || typeof att !== "object") continue;
const typ = String(att.type || "");
if (typ === "image_ref") {
const aid = String(att.attachment_id || att.attachmentId || "").trim();
const url = aid ? await fetchAttachmentBlobUrl(aid) : null;
if (url) {
const img = el("img", { class: "chat-att-img", src: url, alt: String(att.name || "") });
wrap.appendChild(img);
} else {
wrap.appendChild(el("span", { class: "chat-att-chip", text: String(att.name || "image") }));
}
} else if (typ === "relay_pointer") {
let aid = String(att.attachment_id || att.attachmentId || "").trim();
if (!aid) {
const p = String(att.pointer_uri || "").trim();
const m = p.match(/^relay:\/\/attachments\/[^/]+\/([a-f0-9]{8,64})$/i);
if (m && m[1]) aid = String(m[1]).toLowerCase();
}
const mime = String(att.mime || att.mime_type || "").toLowerCase();
const url = aid ? await fetchAttachmentBlobUrl(aid) : null;
if (url && (!mime || mime.startsWith("image/"))) {
const img = el("img", { class: "chat-att-img", src: url, alt: String(att.name || att.rel_path || "relay image") });
wrap.appendChild(img);
} else {
const title = String(att.name || att.rel_path || att.pointer_uri || "relay pointer");
wrap.appendChild(el("span", { class: "chat-att-chip", text: `📎 ${title}` }));
}
} else if (typ === "image_url") {
const src = String(att.url || att.image_url || "").trim();
if (!src) continue;
const img = el("img", {
class: "chat-att-img",
src,
alt: String(att.name || "generated image"),
decoding: "async",
referrerPolicy: "no-referrer",
});
img.addEventListener(
"error",
() => {
try {
const parent = img.parentNode;
if (!parent) return;
parent.replaceChild(
el("a", {
class: "chat-att-ref__link",
href: src,
target: "_blank",
rel: "noopener noreferrer",
text:
currentLang === "zh"
? "图片无法嵌入显示（可能被防盗链），点击打开原始链接"
: "Image blocked from inline display; open original URL",
}),
img,
);
} catch (_) {}
},
{ once: true },
);
wrap.appendChild(img);
} else if (typ === "video_ref" || typ === "text_ref" || typ === "binary_ref") {
wrap.appendChild(await buildRefCard(att, typ));
} else if (typ === "image" || typ === "input_image") {
const b64 = att.image_base64 || att.data;
const mime = String(att.mime || "image/jpeg");
if (b64) {
const src = `data:${mime};base64,${String(b64).replace(/\s/g, "")}`;
wrap.appendChild(el("img", { class: "chat-att-img", src, alt: String(att.name || "") }));
} else {
wrap.appendChild(el("span", { class: "chat-att-chip", text: String(att.name || "image") }));
}
} else {
const maybeAid = String(att.attachment_id || att.attachmentId || "").trim();
if (maybeAid) wrap.appendChild(await buildRefCard(att, typ || "attachment_ref"));
else wrap.appendChild(el("span", { class: "chat-att-chip", text: `📄 ${String(att.name || "file")}` }));
}
}
return wrap.children.length ? wrap : null;
}
async function appendMessageRow(messagesEl, m, options = {}) {
const role = String(m.role || "");
const content = String(m.content || "");
const ts = m.timestamp != null ? m.timestamp : "";
const bubble = Array.isArray(m._items)
? await _buildAggregatedAssistantBubble(ts, m._items)
: await buildMessageBubble(role, content, ts);
// For aggregated assistant bubbles, attachments should be rendered inline
// at tool_result positions, not appended at bubble tail.
const att = Array.isArray(m._items) ? null : await renderAttachmentsEl(m.attachments);
if (att) {
const innerBubble = bubble.querySelector(".chat-msg-col .chat-msg");
if (innerBubble) innerBubble.appendChild(att);
else bubble.appendChild(att);
}
const colNode = bubble.querySelector(".chat-msg-col");
const innerBubble = bubble.querySelector(".chat-msg-col .chat-msg");
if (innerBubble) {
const copyText = (() => {
const v = String(innerBubble.innerText || "").trim();
return v;
})();
const ids = Array.isArray(m._message_ids) ? m._message_ids.filter((x) => x != null) : (m.id != null ? [m.id] : []);
const canDelete = ids.length === 1 && typeof options.onDeleteMessage === "function";
if (copyText || canDelete) {
const bar = el("div", { class: "chat-msg__actions" });
if (copyText) {
bar.appendChild(
el("button", {
type: "button",
class: "chat-msg__action-btn",
text: "⧉",
title: t("chat.copy"),
"aria-label": t("chat.copy"),
onclick: async (e) => {
e.preventDefault();
e.stopPropagation();
try {
await navigator.clipboard.writeText(copyText);
if (typeof options.onActionStatus === "function") options.onActionStatus(t("chat.copyOk"));
} catch (_) {
if (typeof options.onActionStatus === "function") options.onActionStatus(t("chat.copyFail"));
}
},
}),
);
}
if (canDelete) {
bar.appendChild(
el("button", {
type: "button",
class: "chat-msg__action-btn chat-msg__action-btn--danger",
text: "🗑",
title: t("chat.deleteMessage"),
"aria-label": t("chat.deleteMessage"),
onclick: async (e) => {
e.preventDefault();
e.stopPropagation();
let ok = false;
if (typeof options.onConfirm === "function") {
ok = await options.onConfirm(t("chat.deleteMessageConfirm"));
} else {
ok = window.confirm(t("chat.deleteMessageConfirm"));
}
if (!ok) return;
await options.onDeleteMessage(ids[0]);
},
}),
);
}
if (colNode) colNode.appendChild(bar);
else innerBubble.appendChild(bar);
}
}
messagesEl.appendChild(bubble);
hydrateMermaidIn(bubble);
}
function mount(node) {
clearChatPageBlockers();
const c = document.getElementById("app");
c.innerHTML = "";
c.appendChild(node);
}
function buildChatBrandLogoNode() {
const img = el("img", {
class: "chat-nav__brandLogo",
src: CHAT_BOT_LOGO_SRC,
alt: "site logo",
});
img.addEventListener(
"error",
() => {
if (img.dataset.logoFallbackApplied === "1") return;
img.dataset.logoFallbackApplied = "1";
img.src = CHAT_BOT_LOGO_FALLBACK_SRC;
},
{ once: true },
);
return el("div", { class: "chat-nav__brandWrap" }, [img]);
}
function resolveAdminHashUrl(hashPath, sessionId) {
const path = (location.pathname || "").replace(/\/+$/, "") || "/";
const cleanHash = String(hashPath || "").replace(/^#?\/?/, "");
const q = sessionId ? `?session_id=${encodeURIComponent(sessionId)}` : "";
if (path.endsWith("/chat")) {
const base = path.slice(0, -5);
return base.endsWith("/admin") ? `${base}#/${cleanHash}${q}` : `${base}/admin#/${cleanHash}${q}`;
}
return `/admin#/${cleanHash}${q}`;
}
function openAdminFromChat(hashPath, sessionId) {
const target = resolveAdminHashUrl(hashPath, sessionId);
// Keep navigation in the same window so desktop shell feels native.
window.location.assign(target);
}
function syncAuthUserLabel() {
const user = document.getElementById("authUser");
if (!user) return;
user.innerHTML = "";
const name = String((authSession && (authSession.display_name || authSession.username || authSession.user_id)) || "");
const isAdminViewer = String((authSession && authSession.username) || "")
.trim()
.toLowerCase() === "administrator";
if (!name) return;
const nameBtn = el("button", {
type: "button",
class: "chat-sess-btn",
text: name,
title: name,
});
const moreBtn = el("button", {
type: "button",
class: "chat-sess-more",
text: "⋯",
title: t("chat.sessionMenu"),
onclick: (ev) => {
ev.stopPropagation();
clearChatPageBlockers();
const items = [
el("button", {
type: "button",
class: "chat-sess-menu-item",
"data-menu-action": "profile",
text: t("chat.myProfile"),
}),
el("button", {
type: "button",
class: "chat-sess-menu-item",
"data-menu-action": "jobs",
text: t("chat.jobs"),
}),
];
items.push(el("div", { class: "chat-sess-menu-sep" }));
items.push(
el("div", { class: "muted", style: "padding:6px 10px 2px;font-size:12px;", text: t("theme.label") }),
);
const themeSelMenu = el("select", {
class: "input",
style: "width:100%;margin:4px 8px 8px;max-width:calc(100% - 16px);",
});
try {
(window.OclawAdminTheme && window.OclawAdminTheme.THEMES ? window.OclawAdminTheme.THEMES : ["deepseek"]).forEach((tid) => {
themeSelMenu.appendChild(el("option", { value: tid, text: t(`theme.${tid}`) }));
});
themeSelMenu.value = window.OclawAdminTheme ? window.OclawAdminTheme.currentAdminTheme() : "deepseek";
} catch (_) {}
themeSelMenu.addEventListener("change", () => {
try {
if (window.OclawAdminTheme) window.OclawAdminTheme.persistAdminTheme(themeSelMenu.value);
} catch (_) {}
});
items.push(themeSelMenu);
const bridge = window.__chatUserMenuPrefs;
if (bridge && typeof bridge === "object") {
items.push(el("div", { class: "chat-sess-menu-sep" }));
items.push(el("div", { class: "muted", style: "padding:6px 10px 2px;font-size:12px;", text: t("chat.modeLabel") }));
const modeSel = el("select", { class: "input", style: "width:100%;margin:4px 8px 8px;max-width:calc(100% - 16px);" });
try {
const rows = Array.isArray(bridge.getModeOptions && bridge.getModeOptions()) ? bridge.getModeOptions() : [];
rows.forEach((r) => modeSel.appendChild(el("option", { value: String(r.value || ""), text: String(r.label || r.value || "") })));
modeSel.value = String((bridge.getModeValue && bridge.getModeValue()) || "");
} catch (_) {}
modeSel.addEventListener("change", async () => {
const v = modeSel.value;
try {
modeSel.disabled = true;
if (bridge.setModeValue) await bridge.setModeValue(v);
} catch (_) {
// errors are surfaced by saveUserGlobalModePreference()
} finally {
modeSel.disabled = false;
}
});
items.push(modeSel);
items.push(el("div", { class: "muted", style: "padding:6px 10px 2px;font-size:12px;", text: t("chat.planAgentVersionLabel") }));
const pavSel = el("select", { class: "input", style: "width:100%;margin:4px 8px 8px;max-width:calc(100% - 16px);" });
try {
const prow = Array.isArray(bridge.getPlanAgentVersionOptions && bridge.getPlanAgentVersionOptions())
? bridge.getPlanAgentVersionOptions()
: [];
prow.forEach((r) =>
pavSel.appendChild(el("option", { value: String(r.value || ""), text: String(r.label || r.value || "") })),
);
pavSel.value = String((bridge.getPlanAgentVersionValue && bridge.getPlanAgentVersionValue()) || "");
} catch (_) {}
pavSel.addEventListener("change", async () => {
const v = pavSel.value;
try {
pavSel.disabled = true;
if (bridge.setPlanAgentVersionValue) await bridge.setPlanAgentVersionValue(v);
} catch (_) {
// errors are surfaced by saveUserGlobalModePreference()
} finally {
pavSel.disabled = false;
}
});
items.push(pavSel);
items.push(el("div", { class: "muted", style: "padding:2px 10px 2px;font-size:12px;", text: t("chat.confirmStrategyLabel") }));
const csSel = el("select", { class: "input", style: "width:100%;margin:4px 8px 8px;max-width:calc(100% - 16px);" });
try {
const rows = Array.isArray(bridge.getConfirmStrategyOptions && bridge.getConfirmStrategyOptions())
? bridge.getConfirmStrategyOptions()
: [];
rows.forEach((r) => csSel.appendChild(el("option", { value: String(r.value || ""), text: String(r.label || r.value || "") })));
csSel.value = String((bridge.getConfirmStrategyValue && bridge.getConfirmStrategyValue()) || "");
} catch (_) {}
csSel.addEventListener("change", async () => {
const v = csSel.value;
try {
csSel.disabled = true;
if (bridge.setConfirmStrategyValue) await bridge.setConfirmStrategyValue(v);
} catch (_) {
// errors are surfaced by saveUserGlobalModePreference()
} finally {
csSel.disabled = false;
}
});
items.push(csSel);
const reasonWrap = el("label", { class: "switch-wrap", style: "margin:2px 8px 8px;" }, [
el("input", { type: "checkbox", class: "switch-input" }),
el("span", { class: "switch-slider" }),
el("span", { class: "muted", text: t("chat.tools") }),
]);
const reasonCb = reasonWrap.querySelector("input.switch-input");
try {
reasonCb.checked = !!(bridge.getReasoningVisible && bridge.getReasoningVisible());
} catch (_) {}
reasonCb.addEventListener("change", () => {
try {
Promise.resolve(bridge.setReasoningVisible && bridge.setReasoningVisible(!!reasonCb.checked)).catch(() => {});
} catch (_) {}
});
items.push(reasonWrap);
}
items.push(el("div", { class: "chat-sess-menu-sep" }));
items.push(
el("button", {
type: "button",
class: "chat-sess-menu-item",
"data-menu-action": "lang",
text: t("lang.switch"),
}),
);
items.push(el("div", { class: "chat-sess-menu-sep" }));
items.push(
el("button", {
type: "button",
class: "chat-sess-menu-item",
"data-menu-action": "logout",
text: t("auth.logout"),
}),
);
const menu = el("div", {
class: "chat-sess-menu-pop",
style: "position:fixed;min-width:220px;z-index:300;",
}, items);
const rect = moreBtn.getBoundingClientRect();
attachChatMenuDismiss(menu);
const mrect = menu.getBoundingClientRect();
const pad = 8;
let left = rect.left;
let top = rect.bottom + 4;
if (top + mrect.height > window.innerHeight - pad) {
top = rect.top - 4 - mrect.height;
}
left = Math.max(pad, Math.min(left, window.innerWidth - pad - mrect.width));
top = Math.max(pad, Math.min(top, window.innerHeight - pad - mrect.height));
menu.style.left = `${left}px`;
menu.style.top = `${top}px`;
},
});
const row = el("div", { class: "chat-user-row" }, [nameBtn, moreBtn]);
user.appendChild(row);
}
async function fileToPayloadEntry(file) {
return new Promise((resolve, reject) => {
const r = new FileReader();
r.onload = () => {
const dataUrl = String(r.result || "");
const idx = dataUrl.indexOf(",");
const data_base64 = idx >= 0 ? dataUrl.slice(idx + 1) : dataUrl;
resolve({ name: file.name || "file", data_base64 });
};
r.onerror = () => reject(r.error || new Error("file_read_failed"));
r.readAsDataURL(file);
});
}
async function renderLogin() {
applyI18nStatic();
const username = el("input", { class: "input", placeholder: t("auth.username") });
const password = el("input", { class: "input", type: "password", placeholder: t("auth.password") });
const status = el("div", { class: "muted", text: "" });
const doLogin = async () => {
const resp = await apiPost("/admin/api/auth/login", {
tenant_id: "",
username: username.value.trim().toLowerCase(),
password: password.value.trim(),
purpose: "chat",
});
if (!resp.ok || !resp.token) {
const err = String(resp.error || "");
status.textContent =
err === "user_disabled"
? t("auth.disabled")
: err === "admin_role_required"
? t("auth.chatLoginDenied")
: t("auth.invalid");
return;
}
localStorage.setItem(AUTH_TOKEN_KEY, String(resp.token));
localStorage.setItem(AUTH_SESSION_KEY, JSON.stringify(resp.session || {}));
authSession = resp.session || null;
await boot();
};
const onEnterLogin = (ev) => {
if (ev.key !== "Enter") return;
ev.preventDefault();
doLogin();
};
username.addEventListener("keydown", onEnterLogin);
password.addEventListener("keydown", onEnterLogin);
const btn = el("button", {
class: "btn btn--primary",
text: t("auth.login"),
onclick: doLogin,
});
const card = el("div", { class: "card", style: "max-width:440px;width:100%" }, [
el("div", { class: "card__title", text: t("auth.login") }),
el("div", { class: "chat-login-fields" }, [username, password]),
el("div", { class: "row chat-login-actions" }, [btn]),
status,
]);
setTimeout(() => {
try {
username.focus();
} catch (_) {}
}, 0);
return el("div", { class: "chat-app--login" }, [card]);
}
async function downloadExport(sessionId, format) {
const token = localStorage.getItem(AUTH_TOKEN_KEY) || "";
const q = format === "json" ? "format=json" : "format=md";
const url = `/admin/api/chat/sessions/${encodeURIComponent(sessionId)}/export?${q}`;
const res = await fetch(url, { headers: token ? { authorization: `Bearer ${token}` } : {} });
if (!res.ok) throw new Error(String(res.status));
const blob = await res.blob();
const a = document.createElement("a");
a.href = URL.createObjectURL(blob);
a.download = `chat-${sessionId.slice(0, 8)}.${format === "json" ? "json" : "md"}`;
a.click();
URL.revokeObjectURL(a.href);
}
const CHAT_ICON_CLIP =
'';
const CHAT_ICON_SEND =
'';
const CHAT_ICON_STOP =
'';
let _statusReasonPairs = [];
async function renderChatUi() {
let sessionId = getSessionIdFromUrl();
try {
const curScope = JSON.stringify({
t: String((authSession && authSession.tenant_id) || ""),
u: String((authSession && authSession.user_id) || ""),
});
const prev = localStorage.getItem(CHAT_URL_SCOPE_KEY) || "";
if (prev && prev !== curScope) {
replaceSessionUrl("");
sessionId = "";
}
localStorage.setItem(CHAT_URL_SCOPE_KEY, curScope);
} catch (_) {}
const statusBar = el("div", { class: "chat-status", text: t("chat.loading") });
const sessionsListEl = el("div", { class: "chat-sessions__list" });
const loadMoreWrap = el("div", { class: "chat-load-more" });
const messagesEl = el("div", { class: "chat-messages" });
bindChatImageViewer(messagesEl);
bindChatMermaidViewer(messagesEl);
const AUTO_SCROLL_BOTTOM_GAP_PX = 56;
let shouldFollowMessages = true;
let autoScrollRaf = 0;
let autoScrollTimer = 0;
const isNearBottom = () => {
const remaining = messagesEl.scrollHeight - (messagesEl.scrollTop + messagesEl.clientHeight);
return remaining <= AUTO_SCROLL_BOTTOM_GAP_PX;
};
const scheduleFollowScroll = (force = false) => {
if (!force && !shouldFollowMessages) return;
if (autoScrollRaf) cancelAnimationFrame(autoScrollRaf);
if (autoScrollTimer) clearTimeout(autoScrollTimer);
autoScrollRaf = requestAnimationFrame(() => {
messagesEl.scrollTop = messagesEl.scrollHeight;
autoScrollRaf = requestAnimationFrame(() => {
if (force || shouldFollowMessages) messagesEl.scrollTop = messagesEl.scrollHeight;
});
});
// Some async markdown/image/UI post-processing happens after RAF.
autoScrollTimer = setTimeout(() => {
if (force || shouldFollowMessages) messagesEl.scrollTop = messagesEl.scrollHeight;
autoScrollTimer = 0;
}, 60);
};
const scrollMessagesToBottom = (force = false) => {
scheduleFollowScroll(force);
};
messagesEl.addEventListener("scroll", () => {
shouldFollowMessages = isNearBottom();
});
messagesEl.addEventListener(
"load",
(ev) => {
const target = ev && ev.target;
if (!target || target.tagName !== "IMG") return;
scrollMessagesToBottom();
},
true,
);
const messagesMutationObserver = new MutationObserver(() => {
scheduleFollowScroll(false);
});
messagesMutationObserver.observe(messagesEl, {
childList: true,
subtree: true,
characterData: true,
});
const textarea = el("textarea", {
class: "chat-composer__field",
rows: "1",
placeholder: t("chat.placeholder"),
});
const fileInput = el("input", { type: "file", multiple: "multiple", style: "display:none", accept: "*/*" });
const attachBtn = el("button", {
type: "button",
class: "chat-composer-iconbtn",
html: CHAT_ICON_CLIP,
title: t("chat.attach"),
"aria-label": t("chat.attach"),
});
const pendingFilesEl = el("div", { class: "chat-pending-files" });
const btnSend = el("button", {
type: "button",
class: "chat-composer-send",
html: CHAT_ICON_SEND,
title: t("chat.send"),
"aria-label": t("chat.send"),
});
const btnStop = el("button", {
type: "button",
class: "chat-composer-stop",
html: CHAT_ICON_STOP,
title: t("chat.stop"),
"aria-label": t("chat.stop"),
disabled: "disabled",
});
const composerShell = el("div", { class: "chat-composer-shell" });
const MAIN_MODE_VALUE = "generalist";
const EXCLUDED_SPECIALISTS = new Set(["main", "memory", "manager_self", "pycache", "__pycache__", "comprehensive"]);
let specialistCatalog = [];
/** Hidden: mode is global-only (⋯ menu). Kept for specialist option list in `publishUserMenuPrefsBridge`. */
const modeSelect = el("select", {
class: "input",
style: "display:none;",
"aria-hidden": "true",
tabIndex: -1,
});
let globalMenuModeValue = String(localStorage.getItem(CHAT_USER_MENU_MODE_KEY) || MAIN_MODE_VALUE).toLowerCase();
if (globalMenuModeValue === "comprehensive" || globalMenuModeValue === "main") globalMenuModeValue = MAIN_MODE_VALUE;
const modelSelect = el("select", {
class: "input",
style: "min-width:150px;max-width:240px;padding:6px 8px;",
title: t("chat.activeModelLabel"),
});
let modelSelectNameToId = new Map();
const normalizeExecutionMode = (v) => {
const raw = String(v || "").trim().toLowerCase();
return raw === EXECUTION_MODE_PLAN ? EXECUTION_MODE_PLAN : EXECUTION_MODE_AGENT;
};
const normalizeConfirmStrategy = (v) => {
const raw = String(v || "").trim().toLowerCase();
if (raw === CONFIRM_STRATEGY_AUTO) return CONFIRM_STRATEGY_AUTO;
if (raw === CONFIRM_STRATEGY_OFF) return CONFIRM_STRATEGY_OFF;
return CONFIRM_STRATEGY_STRICT;
};
const executionModeLabel = (v) =>
normalizeExecutionMode(v) === EXECUTION_MODE_PLAN ? t("chat.execModePlan") : t("chat.execModeAgent");
let currentExecutionMode = normalizeExecutionMode(localStorage.getItem(CHAT_EXECUTION_MODE_KEY) || EXECUTION_MODE_AGENT);
let currentConfirmStrategy = normalizeConfirmStrategy(localStorage.getItem(CHAT_CONFIRM_STRATEGY_KEY) || CONFIRM_STRATEGY_STRICT);
const normalizePlanAgentVersion = (v) => {
const raw = String(v || "").trim().toLowerCase();
return raw === PLAN_AGENT_V2 ? PLAN_AGENT_V2 : PLAN_AGENT_V1;
};
let planAgentV2GloballyEnabled = false;
let currentPlanAgentVersion = normalizePlanAgentVersion(localStorage.getItem(CHAT_PLAN_AGENT_VERSION_KEY) || PLAN_AGENT_V1);
const execSelect = el("select", {
class: "input",
style: "min-width:96px;max-width:140px;padding:6px 8px;",
});
const refreshExecutionSelect = () => {
const prev = normalizeExecutionMode(execSelect.value || currentExecutionMode);
execSelect.innerHTML = "";
execSelect.appendChild(el("option", { value: EXECUTION_MODE_AGENT, text: t("chat.execModeAgent") }));
execSelect.appendChild(el("option", { value: EXECUTION_MODE_PLAN, text: t("chat.execModePlan") }));
execSelect.value = prev;
};
const setExecutionMode = (v, { persistLocal = true, saveSession = true } = {}) => {
currentExecutionMode = normalizeExecutionMode(v);
if (persistLocal) localStorage.setItem(CHAT_EXECUTION_MODE_KEY, currentExecutionMode);
refreshExecutionSelect();
execSelect.value = currentExecutionMode;
if (saveSession && activeId) saveSessionModePreference();
};
execSelect.addEventListener("change", () => {
setExecutionMode(execSelect.value, { persistLocal: true, saveSession: true });
});
refreshExecutionSelect();
execSelect.value = currentExecutionMode;
const execSelectWrap = el("span", { class: "chat-exec-mode-wrap", style: "display:inline-flex;align-items:center;" }, [
execSelect,
]);
const outboundPlanAgentVersion = () => PLAN_AGENT_V1;
const refreshExecUi = () => {
// Plan mode removed; keep agent execution only.
execSelectWrap.style.display = "none";
};
const modeOptionLabel = (v) => {
const key = String(v || "").trim().toLowerCase();
if (key === "generalist") return t("chat.specialistGeneralist");
const row = specialistCatalog.find((x) => String(x.id || "").toLowerCase() === key);
if (!row) return key || t("chat.specialistGeneralist");
const zh = String(row.display_name_zh || "").trim();
const en = String(row.display_name_en || "").trim();
return currentLang === "zh" ? (zh || en || key) : (en || zh || key);
};
const isSelectableSpecialist = (v) => {
const key = String(v || "").trim().toLowerCase();
if (!key || key === "comprehensive" || key === "main") return false;
if (key === "generalist") return true;
return specialistCatalog.some((x) => String(x.id || "").toLowerCase() === key);
};
const persistModeSelection = () => {
const v = String(globalMenuModeValue || MAIN_MODE_VALUE).toLowerCase();
localStorage.setItem(CHAT_INTERACTION_MODE_KEY, "expert");
localStorage.setItem(CHAT_USER_MENU_MODE_KEY, v);
localStorage.setItem(CHAT_SPECIALIST_PREF_KEY, v);
};
const syncHiddenModeSelectFromGlobal = () => {
const g = String(globalMenuModeValue || MAIN_MODE_VALUE).toLowerCase();
if (Array.from(modeSelect.options || []).some((o) => String(o.value || "") === g)) modeSelect.value = g;
else modeSelect.value = MAIN_MODE_VALUE;
};
const applyModeOptions = () => {
let prev = String(globalMenuModeValue || MAIN_MODE_VALUE).toLowerCase();
if (prev === "comprehensive" || prev === "main") prev = MAIN_MODE_VALUE;
modeSelect.innerHTML = "";
modeSelect.appendChild(el("option", { value: "generalist", text: modeOptionLabel("generalist") }));
specialistCatalog.forEach((x) => {
const sid = String(x.id || "").toLowerCase();
if (!sid || sid === "generalist") return;
modeSelect.appendChild(el("option", { value: sid, text: modeOptionLabel(sid) }));
});
if (Array.from(modeSelect.options).some((o) => String(o.value || "") === prev)) {
modeSelect.value = prev;
globalMenuModeValue = prev;
} else {
modeSelect.value = MAIN_MODE_VALUE;
globalMenuModeValue = MAIN_MODE_VALUE;
}
};
const _mm = String(localStorage.getItem(CHAT_MEMORY_MODE_KEY) || "default").toLowerCase();
localStorage.setItem(CHAT_MEMORY_MODE_KEY, _mm === "store_only" ? "store_only" : "default");
const loadSpecialistCatalog = async () => {
try {
const r = await apiGet("/admin/api/experts");
const items = Array.isArray(r && r.items) ? r.items : [];
specialistCatalog = items
.filter((x) => {
const id = String((x && x.id) || "").trim().toLowerCase();
if (!id || EXCLUDED_SPECIALISTS.has(id)) return false;
const role = String((x && x.role) || "").trim().toLowerCase();
return role === "expert" || id === "generalist";
})
.map((x) => ({
id: String(x.id || "").trim().toLowerCase(),
display_name_en: String(x.display_name_en || "").trim(),
display_name_zh: String(x.display_name_zh || "").trim(),
}));
} catch (_) {
specialistCatalog = [];
}
applyModeOptions();
};
await loadSpecialistCatalog();
const activeModelText = el("span", { class: "muted", text: `${t("chat.activeModelLabel")}: -` });
const applyModelSelectorVisibility = (modelsState) => {
const show = !(modelsState && modelsState.chat_model_selector_visible === false);
modelSelect.style.display = show ? "" : "none";
modelSelect.disabled = !show;
};
const refreshActiveModelText = async () => {
try {
const ms = await apiGet("/admin/api/models");
applyModelSelectorVisibility(ms);
const profiles = Array.isArray(ms.profiles) ? ms.profiles : [];
const aid = String(ms.active_llm_profile_id || "");
const p = profiles.find((x) => String(x.id || "") === aid) || null;
const modelName = String((p && p.model) || "").trim() || "-";
activeModelText.textContent = `${t("chat.activeModelLabel")}: ${modelName}`;
modelSelect.innerHTML = "";
modelSelectNameToId = new Map();
const usedKeys = new Set();
profiles.forEach((row) => {
const pid = String(row && row.id ? row.id : "");
if (!pid) return;
const rawName = String(row.name || "").trim();
const keyBase = rawName || pid;
let key = keyBase;
let n = 2;
while (usedKeys.has(key)) {
key = `${keyBase}#${n}`;
n += 1;
}
usedKeys.add(key);
modelSelectNameToId.set(key, pid);
const display = String(row.model || row.name || pid);
modelSelect.appendChild(el("option", { value: key, text: display }));
});
if (p) {
const rawName = String(p.name || "").trim();
const firstKey = Array.from(modelSelectNameToId.keys()).find((k) => modelSelectNameToId.get(k) === aid) || "";
const key = firstKey || rawName;
if (key && Array.from(modelSelect.options).some((o) => String(o.value || "") === key)) {
modelSelect.value = key;
}
} else if (modelSelect.options.length > 0) {
modelSelect.value = String(modelSelect.options[0].value || "");
}
} catch (_) {
applyModelSelectorVisibility(null);
activeModelText.textContent = `${t("chat.activeModelLabel")}: -`;
modelSelect.innerHTML = "";
modelSelect.appendChild(el("option", { value: "", text: "-" }));
modelSelect.value = "";
}
};
modelSelect.addEventListener("change", async () => {
const selectedKey = String(modelSelect.value || "").trim();
const pid = String(modelSelectNameToId.get(selectedKey) || "").trim();
if (!pid) return;
try {
await apiPost("/admin/api/models/active", { profile_id: pid });
await refreshActiveModelText();
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
});
const loadSessionModePreference = async () => {
if (!activeId) {
setExecutionMode(currentExecutionMode, { persistLocal: true, saveSession: false });
refreshExecUi();
return;
}
try {
const resp = await apiGet(`/admin/api/chat/sessions/${encodeURIComponent(activeId)}/mode`);
const m = String((resp && resp.interaction_mode) || "").toLowerCase();
const s = String((resp && resp.specialist) || "").toLowerCase();
const mm = String((resp && resp.memory_mode) || "").toLowerCase();
const em = String((resp && resp.execution_mode) || "").toLowerCase();
const cs = String((resp && resp.confirm_strategy) || "").toLowerCase();
planAgentV2GloballyEnabled = !!(resp && resp.plan_agent_v2_globally_enabled);
const pavRaw = String((resp && resp.plan_agent_version) || "").trim().toLowerCase();
currentPlanAgentVersion = normalizePlanAgentVersion(pavRaw || localStorage.getItem(CHAT_PLAN_AGENT_VERSION_KEY));
localStorage.setItem(CHAT_PLAN_AGENT_VERSION_KEY, currentPlanAgentVersion);
const gm = resp && resp.global_menu && typeof resp.global_menu === "object" ? resp.global_menu : null;
if (gm) {
const gIm = String(gm.interaction_mode || "").toLowerCase();
const gSp = String(gm.specialist || "").toLowerCase();
if (isSelectableSpecialist(gSp)) globalMenuModeValue = gSp;
else if (isSelectableSpecialist(gIm)) globalMenuModeValue = gIm;
else globalMenuModeValue = MAIN_MODE_VALUE;
} else {
try {
const ur = await apiGet("/admin/api/chat/user-mode");
if (ur && ur.ok) {
planAgentV2GloballyEnabled = !!(ur.plan_agent_v2_globally_enabled != null ? ur.plan_agent_v2_globally_enabled : planAgentV2GloballyEnabled);
const gum = String((ur.interaction_mode || "").toLowerCase());
const gus = String((ur.specialist || "").toLowerCase());
currentConfirmStrategy = normalizeConfirmStrategy(ur.confirm_strategy || currentConfirmStrategy);
localStorage.setItem(CHAT_CONFIRM_STRATEGY_KEY, currentConfirmStrategy);
currentPlanAgentVersion = normalizePlanAgentVersion(
ur.plan_agent_version || localStorage.getItem(CHAT_PLAN_AGENT_VERSION_KEY),
);
localStorage.setItem(CHAT_PLAN_AGENT_VERSION_KEY, currentPlanAgentVersion);
if (isSelectableSpecialist(gus)) globalMenuModeValue = gus;
else if (isSelectableSpecialist(gum)) globalMenuModeValue = gum;
else globalMenuModeValue = MAIN_MODE_VALUE;
}
} catch (_) {
if (m === "expert" && isSelectableSpecialist(s)) globalMenuModeValue = s;
else if (isSelectableSpecialist(s)) globalMenuModeValue = s;
else globalMenuModeValue = MAIN_MODE_VALUE;
}
}
localStorage.setItem(CHAT_USER_MENU_MODE_KEY, String(globalMenuModeValue || MAIN_MODE_VALUE).toLowerCase());
syncHiddenModeSelectFromGlobal();
if (["default", "store_only"].includes(mm)) localStorage.setItem(CHAT_MEMORY_MODE_KEY, mm);
setExecutionMode(em, { persistLocal: true, saveSession: false });
currentConfirmStrategy = normalizeConfirmStrategy(cs || currentConfirmStrategy);
localStorage.setItem(CHAT_CONFIRM_STRATEGY_KEY, currentConfirmStrategy);
persistModeSelection();
const mml = String(localStorage.getItem(CHAT_MEMORY_MODE_KEY) || "default").toLowerCase();
localStorage.setItem(CHAT_MEMORY_MODE_KEY, mml === "store_only" ? "store_only" : "default");
refreshExecUi();
publishUserMenuPrefsBridge();
} catch (_) {
setExecutionMode(currentExecutionMode, { persistLocal: true, saveSession: false });
refreshExecUi();
}
};
const saveUserGlobalModePreference = async () => {
try {
const modeVal = String(globalMenuModeValue || MAIN_MODE_VALUE).toLowerCase();
const specialist = isSelectableSpecialist(modeVal) ? modeVal : MAIN_MODE_VALUE;
const resp = await apiPost("/admin/api/chat/user-mode", {
interaction_mode: "expert",
specialist,
confirm_strategy: String(currentConfirmStrategy || CONFIRM_STRATEGY_STRICT),
plan_agent_version: String(currentPlanAgentVersion || PLAN_AGENT_V1),
});
if (resp && typeof resp.plan_agent_v2_globally_enabled === "boolean") {
planAgentV2GloballyEnabled = !!resp.plan_agent_v2_globally_enabled;
}
localStorage.setItem(CHAT_USER_MENU_MODE_KEY, specialist);
globalMenuModeValue = specialist;
if (!resp || resp.ok === false) {
const detail = String((resp && (resp.error || resp.detail)) || "unknown_error");
throw new Error(detail);
}
// Hard-verify persistence: session switches reload mode from server.
// If server didn't persist, the UI will "snap back" to defaults.
try {
const ur = await apiGet("/admin/api/chat/user-mode");
if (ur && ur.ok) {
const gum = String((ur.interaction_mode || "").toLowerCase());
const gus = String((ur.specialist || "").toLowerCase());
if (gum !== "expert" || gus !== specialist) {
const msg =
currentLang === "zh"
? `模式未固化：后端返回 interaction_mode=${gum || "-"} specialist=${gus || "-"}（期望 expert/${specialist}）`
: `Mode not persisted: server returned interaction_mode=${gum || "-"} specialist=${gus || "-"} (expected expert/${specialist})`;
showToast(msg, { kind: "error", ttlMs: 8000 });
}
}
} catch (_) {}
} catch (e) {
// If persistence fails, user will observe "mode resets after reload/restart".
// Surface this instead of silently swallowing.
try {
const msg =
currentLang === "zh"
? `保存“模式”失败：${String(e || "").slice(0, 180) || "unknown"}`
: `Failed to save mode: ${String(e || "").slice(0, 180) || "unknown"}`;
showToast(msg, { kind: "error", ttlMs: 6500 });
} catch (_) {}
}
};
const saveSessionModePreference = async () => {
if (!activeId) return;
try {
await apiPost(`/admin/api/chat/sessions/${encodeURIComponent(activeId)}/mode`, {
memory_mode: String(localStorage.getItem(CHAT_MEMORY_MODE_KEY) || "default"),
execution_mode: String(currentExecutionMode || EXECUTION_MODE_AGENT),
});
} catch (_) {}
};
await refreshActiveModelText();
refreshExecUi();
const composerMetaBar = el("div", { class: "row", style: "gap:8px;padding:2px 4px 6px;align-items:center;" }, [
execSelectWrap,
modelSelect,
el("button", {
type: "button",
class: "btn",
style: "padding:4px 8px;min-height:auto;font-size:12px;",
text: t("chat.compressHistory"),
onclick: async () => {
const sid = String(activeId || "");
if (!sid) return;
if (!(await confirmChatAction(t("chat.compressHistoryPrompt")))) return;
try {
const resp = await apiPost(`/admin/api/chat/sessions/${encodeURIComponent(sid)}/compress-history`, {});
const r = resp && resp.result ? resp.result : {};
if (!resp || !resp.ok) {
const err = String((resp && (resp.error || resp.detail)) || "failed");
showToast(t("chat.compressHistoryFail", { error: err.slice(0, 180) }), { kind: "error", ttlMs: 6500 });
return;
}
showToast(
t("chat.compressHistoryOk", {
scanned: String(Number(r.scanned_tool_messages || 0)),
rewritten: String(Number(r.rewritten_all_tool_messages || 0)),
compacted: String(Number(r.compacted_tool_messages || 0)),
skipped: String(Number(r.skipped_already_guarded || 0)),
}),
{ kind: "info", ttlMs: 6500 },
);
// Reload messages so UI reflects compacted history.
loadMessagesForActive().catch(() => {});
} catch (e) {
showToast(t("chat.compressHistoryFail", { error: String(e || "failed").slice(0, 180) }), { kind: "error", ttlMs: 6500 });
}
},
}),
]);
const fitComposerTextarea = () => {
textarea.style.height = "auto";
const h = Math.min(Math.max(textarea.scrollHeight, 44), 200);
textarea.style.height = `${h}px`;
};
const syncSendEnabled = () => {
const ok = String(textarea.value || "").trim().length > 0 || pendingFiles.length > 0;
btnSend.disabled = !ok;
};
textarea.addEventListener("input", () => {
fitComposerTextarea();
syncSendEnabled();
});
requestAnimationFrame(() => {
fitComposerTextarea();
syncSendEnabled();
});
let sessions = [];
let sessionTotal = 0;
let pendingFiles = [];
let activeId = sessionId;
let showToolOutput = adminChatShowToolOutput;
let wikiPollTimerId = null;
let wikiAfterFinishedAt = {};
const idsMatch = (a, b) => String(a || "") === String(b || "");
const confirmChatAction = (message) =>
new Promise((resolve) => {
const backdrop = el("div", { class: "chat-confirm-backdrop" });
const card = el("div", { class: "chat-confirm-card" });
const text = el("div", { class: "chat-confirm-text", text: String(message || "") });
const btnCancel = el("button", { type: "button", class: "btn", text: t("chat.dispatchLabelsCancel") });
const btnOk = el("button", { type: "button", class: "btn btn--primary", text: t("chat.delete") });
const close = (ok) => {
try {
backdrop.remove();
} catch (_) {}
resolve(!!ok);
};
btnCancel.addEventListener("click", () => close(false));
btnOk.addEventListener("click", () => close(true));
backdrop.addEventListener("click", (ev) => {
if (ev.target === backdrop) close(false);
});
card.appendChild(text);
card.appendChild(el("div", { class: "row", style: "gap:8px;justify-content:flex-end;margin-top:10px;" }, [btnCancel, btnOk]));
backdrop.appendChild(card);
document.body.appendChild(backdrop);
});
const promptChatText = (message, initialValue = "") =>
new Promise((resolve) => {
const backdrop = el("div", { class: "chat-confirm-backdrop" });
const card = el("div", { class: "chat-confirm-card" });
const text = el("div", { class: "chat-confirm-text", text: String(message || "") });
const input = el("input", {
class: "input",
type: "text",
value: String(initialValue || ""),
style: "width:100%;margin-top:10px;",
});
const btnCancel = el("button", { type: "button", class: "btn", text: t("chat.dispatchLabelsCancel") });
const btnOk = el("button", { type: "button", class: "btn btn--primary", text: t("chat.dispatchLabelsSave") });
const close = (ok) => {
if (backdrop.parentNode) backdrop.parentNode.removeChild(backdrop);
resolve(ok ? String(input.value || "") : null);
};
btnCancel.addEventListener("click", () => close(false));
btnOk.addEventListener("click", () => close(true));
input.addEventListener("keydown", (ev) => {
if (ev.key === "Enter") {
ev.preventDefault();
close(true);
} else if (ev.key === "Escape") {
ev.preventDefault();
close(false);
}
});
backdrop.addEventListener("click", (ev) => {
if (ev.target === backdrop) close(false);
});
card.appendChild(text);
card.appendChild(input);
card.appendChild(el("div", { class: "row", style: "gap:8px;justify-content:flex-end;margin-top:10px;" }, [btnCancel, btnOk]));
backdrop.appendChild(card);
document.body.appendChild(backdrop);
setTimeout(() => {
try {
input.focus();
input.select();
} catch (_) {}
}, 0);
});
const adoptCreatedSession = (resp) => {
const s = resp && resp.session ? resp.session : {};
const sid = String(s.id || "");
if (!sid) throw new Error("no_session_id");
sessions = [s, ...sessions.filter((x) => !idsMatch(x.id, sid))];
sessionTotal += 1;
activeId = sid;
replaceSessionUrl(sid);
wikiAfterFinishedAt[String(sid)] = "";
};
const _summarizeWikiEvent = (ev) => {
const status = String(ev && ev.status ? ev.status : "");
const ok = !!(ev && ev.ok);
const result = (ev && ev.result) || {};
if (status !== "done" || !ok) {
const err = String((result && (result.error || result.last_error)) || (ev && ev.error) || "failed");
return { kind: "error", text: t("chat.wikiToastFailed", { error: err.slice(0, 180) || "failed" }), actions: [] };
}
const dm = result.dedupMerge || {};
const merged = Number(dm.merged_count || 0) || 0;
const skipped = Number(dm.skipped_dup || 0) || 0;
const topicCounts = dm.topic_counts && typeof dm.topic_counts === "object" ? dm.topic_counts : {};
let topTopic = "";
let topN = -1;
for (const [k, v] of Object.entries(topicCounts)) {
const n = Number(v || 0) || 0;
if (n > topN) {
topN = n;
topTopic = String(k || "");
}
}
const actions = [];
return { kind: "info", text: t("chat.wikiToastMerged", { merged: String(merged), skipped: String(skipped) }), actions };
};
const pollWikiEvents = async () => {
if (!CHAT_ENABLE_WIKI_EVENT_POLLER) return;
const sid = String(activeId || "");
if (!sid) return;
const after = String((wikiAfterFinishedAt && wikiAfterFinishedAt[sid]) || "");
try {
const q = after ? `?after=${encodeURIComponent(after)}&limit=20` : "?limit=20";
const resp = await apiGet(`/admin/api/chat/sessions/${encodeURIComponent(sid)}/wiki-events${q}`);
if (!resp || !resp.ok) return;
const events = Array.isArray(resp.events) ? resp.events : [];
if (!events.length) return;
for (const ev of events) {
const fin = String((ev && ev.finished_at) || "");
if (fin && (!wikiAfterFinishedAt[sid] || fin > wikiAfterFinishedAt[sid])) {
wikiAfterFinishedAt[sid] = fin;
}
const msg = _summarizeWikiEvent(ev);
if (msg && msg.text) {
const node = showToast(msg.text, { kind: msg.kind, ttlMs: 6500 });
const acts = Array.isArray(msg.actions) ? msg.actions : [];
if (acts.length) {
const btnRow = el("div", { class: "row", style: "gap:8px;flex-wrap:wrap;margin-top:8px;" });
for (const a of acts) {
btnRow.appendChild(
el("button", {
type: "button",
class: "btn",
style: "padding:4px 8px;min-height:auto;font-size:12px;",
text: String(a.label || "View"),
onclick: (e) => {
e.stopPropagation();
try {
if (typeof a.onClick === "function") a.onClick();
} catch (_) {}
},
}),
);
}
node.appendChild(btnRow);
}
}
}
} catch (_) {}
};
const startWikiPoller = () => {
if (!CHAT_ENABLE_WIKI_EVENT_POLLER) return;
if (wikiPollTimerId != null) return;
wikiPollTimerId = setInterval(pollWikiEvents, 2200);
// kick once
pollWikiEvents().catch(() => {});
};
const stopWikiPoller = () => {
if (wikiPollTimerId != null) {
clearInterval(wikiPollTimerId);
wikiPollTimerId = null;
}
};
const syncPendingUi = () => {
pendingFilesEl.innerHTML = "";
pendingFiles.forEach((f, i) => {
const row = el("div", { class: "chat-pending-row" }, [
el("span", { class: "muted", text: f.name }),
el("button", {
type: "button",
class: "chat-pending-remove",
text: "×",
title: currentLang === "zh" ? "移除" : "Remove",
onclick: () => {
pendingFiles.splice(i, 1);
syncPendingUi();
},
}),
]);
pendingFilesEl.appendChild(row);
});
syncSendEnabled();
};
attachBtn.addEventListener("click", () => fileInput.click());
const setReasoningVisible = (next, { showStatus = true } = {}) => {
showToolOutput = !!next;
adminChatShowToolOutput = showToolOutput;
localStorage.setItem(CHAT_REASONING_TOGGLE_KEY, showToolOutput ? "1" : "0");
const isStreaming = composerShell.classList.contains("chat-composer-shell--busy");
if (showStatus && isStreaming) {
// Avoid clearing active stream bubble mid-turn (loadMessagesForActive() resets messagesEl).
statusBar.textContent = `${showToolOutput ? t("chat.tools.visible") : t("chat.tools.hidden")} · ${
currentLang === "zh" ? "本轮结束后应用到历史消息" : "applies to history after current turn"
}`;
return;
}
if (showStatus) statusBar.textContent = showToolOutput ? t("chat.tools.visible") : t("chat.tools.hidden");
loadMessagesForActive().catch(() => {});
};
const publishUserMenuPrefsBridge = () => {
try {
window.__chatUserMenuPrefs = {
getModeOptions: () =>
Array.from(modeSelect.options || []).map((o) => ({
value: String(o.value || ""),
label: String(o.text || o.label || o.value || ""),
})),
getModeValue: () => String(globalMenuModeValue || MAIN_MODE_VALUE).toLowerCase(),
setModeValue: async (v) => {
const next = String(v || "").toLowerCase();
if (!Array.from(modeSelect.options || []).some((o) => String(o.value || "") === next)) return;
globalMenuModeValue = next;
localStorage.setItem(CHAT_USER_MENU_MODE_KEY, globalMenuModeValue);
syncHiddenModeSelectFromGlobal();
await saveUserGlobalModePreference();
refreshExecUi();
publishUserMenuPrefsBridge();
},
getPlanAgentVersionOptions: () => [
{ value: PLAN_AGENT_V1, label: t("chat.planAgentVersionV1") },
{ value: PLAN_AGENT_V2, label: t("chat.planAgentVersionV2") },
],
getPlanAgentVersionValue: () => String(currentPlanAgentVersion || PLAN_AGENT_V1),
setPlanAgentVersionValue: async (v) => {
const next = normalizePlanAgentVersion(v);
currentPlanAgentVersion = next;
localStorage.setItem(CHAT_PLAN_AGENT_VERSION_KEY, currentPlanAgentVersion);
await saveUserGlobalModePreference();
refreshExecUi();
publishUserMenuPrefsBridge();
},
getConfirmStrategyOptions: () => [
{ value: CONFIRM_STRATEGY_STRICT, label: t("chat.confirmStrategyStrict") },
{ value: CONFIRM_STRATEGY_AUTO, label: t("chat.confirmStrategyAuto") },
{ value: CONFIRM_STRATEGY_OFF, label: t("chat.confirmStrategyOff") },
],
getConfirmStrategyValue: () => String(currentConfirmStrategy || CONFIRM_STRATEGY_STRICT),
setConfirmStrategyValue: async (v) => {
currentConfirmStrategy = normalizeConfirmStrategy(v);
localStorage.setItem(CHAT_CONFIRM_STRATEGY_KEY, currentConfirmStrategy);
await saveUserGlobalModePreference();
publishUserMenuPrefsBridge();
},
getReasoningVisible: () => !!showToolOutput,
setReasoningVisible: async (v) => {
setReasoningVisible(!!v, { showStatus: true });
},
};
} catch (_) {}
};
publishUserMenuPrefsBridge();
fileInput.addEventListener("change", () => {
const fs = fileInput.files;
if (!fs || !fs.length) return;
for (const f of fs) pendingFiles.push(f);
fileInput.value = "";
syncPendingUi();
});
const openSessionMenu = (sid, title) => {
const menu = document.createElement("div");
menu.className = "chat-sess-menu-pop";
const mk = (label, fn) =>
el("button", {
type: "button",
class: "chat-sess-menu-item",
text: label,
onclick: async (ev) => {
ev.stopPropagation();
menu.remove();
await fn();
},
});
menu.appendChild(
mk(t("chat.rename"), async () => {
const nv = await promptChatText(t("chat.rename"), title);
if (nv == null) return;
try {
await apiPatch(`/admin/api/chat/sessions/${encodeURIComponent(sid)}`, { title: nv.trim() });
await refreshSessions();
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
}),
);
menu.appendChild(
mk(t("chat.delete"), async () => {
if (!(await confirmChatAction(t("chat.deleteConfirm")))) return;
try {
const r = await apiDelete(`/admin/api/chat/sessions/${encodeURIComponent(sid)}`);
const next = String(r.next_session_id || "");
if (idsMatch(activeId, sid)) {
activeId = next;
replaceSessionUrl(activeId);
}
await refreshSessions();
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
}),
);
menu.appendChild(
mk(t("chat.exportMd"), async () => {
try {
await downloadExport(sid, "md");
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
}),
);
menu.appendChild(
mk(t("chat.exportJson"), async () => {
try {
await downloadExport(sid, "json");
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
}),
);
menu.appendChild(
mk(t("chat.fork"), async () => {
try {
const r = await apiPost(`/admin/api/chat/sessions/${encodeURIComponent(sid)}/fork`, {});
const ns = r.session || {};
const nid = String(ns.id || "");
if (!nid) return;
activeId = nid;
replaceSessionUrl(nid);
await refreshSessions();
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
}),
);
menu.appendChild(
mk(t("chat.audit"), () => {
openAdminFromChat("audit", sid);
}),
);
return menu;
};
const paintSessions = () => {
sessionsListEl.innerHTML = "";
loadMoreWrap.innerHTML = "";
if (!sessions.length) {
sessionsListEl.appendChild(
el("div", { class: "muted", style: "padding:10px 0 10px 8px", text: t("chat.noSessions") }),
);
return;
}
for (const s of sessions) {
const sid = String(s.id || "");
const title = String(s.title || sid || "");
const row = el("div", { class: "chat-sess-row" + (idsMatch(activeId, sid) ? " chat-sess-row--active" : "") });
const btn = el("button", {
class: "chat-sess-btn" + (idsMatch(activeId, sid) ? " chat-sess-btn--active" : ""),
text: title,
onclick: () => {
activeId = sid;
replaceSessionUrl(sid);
paintSessions();
Promise.all([loadMessagesForActive(), loadSessionModePreference()]).catch((e) => {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
});
startWikiPoller();
},
});
const more = el("button", {
type: "button",
class: "chat-sess-more" + (idsMatch(activeId, sid) ? " chat-sess-more--active" : ""),
text: "⋯",
title: t("chat.sessionMenu"),
onclick: (ev) => {
ev.stopPropagation();
clearChatPageBlockers();
const menu = openSessionMenu(sid, title);
menu.style.position = "fixed";
menu.style.zIndex = "300";
const rect = more.getBoundingClientRect();
attachChatMenuDismiss(menu);
const mrect = menu.getBoundingClientRect();
const pad = 8;
let left = rect.left;
let top = rect.bottom + 4;
if (top + mrect.height > window.innerHeight - pad) {
top = rect.top - 4 - mrect.height;
}
left = Math.max(pad, Math.min(left, window.innerWidth - pad - mrect.width));
top = Math.max(pad, Math.min(top, window.innerHeight - pad - mrect.height));
menu.style.left = `${left}px`;
menu.style.top = `${top}px`;
},
});
row.appendChild(btn);
row.appendChild(more);
sessionsListEl.appendChild(row);
}
if (sessions.length < sessionTotal) {
const lm = el("button", {
class: "btn",
style: "width:100%;margin-top:8px",
text: t("chat.loadMore"),
onclick: async () => {
try {
statusBar.textContent = t("chat.loading");
const off = sessions.length;
const resp = await apiGet(
`/admin/api/chat/sessions?limit=${PAGE_SIZE}&offset=${off}`,
);
const next = Array.isArray(resp.sessions) ? resp.sessions : [];
sessionTotal = intOr(resp.total, sessionTotal);
sessions = sessions.concat(next);
statusBar.textContent = "";
paintSessions();
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
},
});
loadMoreWrap.appendChild(lm);
}
};
function intOr(v, d) {
const n = parseInt(String(v), 10);
return Number.isFinite(n) ? n : d;
}
const handleDeleteMessage = async (messageId) => {
const sid = String(activeId || "").trim();
const mid = parseInt(String(messageId || 0), 10);
if (!sid || !Number.isFinite(mid) || mid <= 0) return;
await apiDelete(`/admin/api/chat/sessions/${encodeURIComponent(sid)}/messages/${mid}`);
await loadMessagesForActive();
};
const rowRenderOptions = {
onDeleteMessage: handleDeleteMessage,
onConfirm: confirmChatAction,
onActionStatus: (msg) => {
statusBar.textContent = String(msg || "");
},
};
const loadMessagesForActive = async (opts = {}) => {
loadMessagesForActive._rid = (loadMessagesForActive._rid || 0) + 1;
const rid = loadMessagesForActive._rid;
shouldFollowMessages = true;
if (!activeId) {
loadMessagesForActive._needsWsTextFallback = true;
messagesEl.innerHTML = "";
statusBar.textContent = sessions.length ? "" : t("chat.noSessions");
if (!sessions.length) messagesEl.appendChild(el("div", { class: "muted", text: t("chat.empty") }));
return 0;
}
statusBar.textContent = t("chat.loading");
loadMessagesForActive._needsWsTextFallback = true;
try {
const resp = await apiGet(
`/admin/api/chat/sessions/${encodeURIComponent(activeId)}/messages?limit=${CHAT_MESSAGES_FETCH_LIMIT}`,
);
if (rid !== loadMessagesForActive._rid) return 0;
const msgs = Array.isArray(resp.messages) ? resp.messages : [];
const renderRows = _buildRenderRows(msgs);
loadMessagesForActive._needsWsTextFallback = _needsWsTextFallbackFromRenderRows(renderRows);
const total = intOr(resp.message_count, msgs.length);
// End-of-turn hydrate: if the server returns nothing renderable yet (PG commit lag, transient API
// glitch) but the caller still has a live stream worth keeping, do not wipe messagesEl — that
// caused "stream flashes then entire dialog is empty" when reasoning/tool-output mode reloads.
if (!renderRows.length && opts.keepDomIfNoHistoryRows) {
statusBar.textContent = "";
return 0;
}
messagesEl.innerHTML = "";
if (total > msgs.length) {
messagesEl.appendChild(
el("div", {
class: "muted chat-msg-cap",
text: t("chat.historyTruncated", { shown: msgs.length, total }),
}),
);
}
if (!renderRows.length) {
messagesEl.appendChild(el("div", { class: "muted", text: t("chat.empty") }));
} else {
for (const m of renderRows) {
await appendMessageRow(messagesEl, m, rowRenderOptions);
}
}
statusBar.textContent = "";
scrollMessagesToBottom(true);
return renderRows.length;
} catch (e) {
// Keep existing message list on reload failure (e.g. toggle reload races),
// so users don't perceive "messages disappeared".
loadMessagesForActive._needsWsTextFallback = true;
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
return -1;
}
};
const reloadSessionsOnly = async () => {
const resp = await apiGet(`/admin/api/chat/sessions?limit=${PAGE_SIZE}&offset=0`);
sessions = Array.isArray(resp.sessions) ? resp.sessions : [];
sessionTotal = intOr(resp.total, sessions.length);
paintSessions();
};
const refreshSessions = async () => {
statusBar.textContent = t("chat.loading");
const resp = await apiGet(`/admin/api/chat/sessions?limit=${PAGE_SIZE}&offset=0`);
sessions = Array.isArray(resp.sessions) ? resp.sessions : [];
sessionTotal = intOr(resp.total, sessions.length);
// URL 里的 session_id 可能属于其他账号或已删除；若不在当前用户列表中则丢弃，避免 GET …/messages 404。
const activeInList =
Boolean(activeId) &&
sessions.length > 0 &&
sessions.some((s) => idsMatch(s.id, activeId));
if (activeId && !activeInList) {
activeId = "";
replaceSessionUrl("");
}
if (!activeId && sessions.length) {
activeId = String(sessions[0].id || "");
replaceSessionUrl(activeId);
}
if (!activeId && sessions.length === 0) {
try {
const resp = await apiPost("/admin/api/chat/sessions", {});
adoptCreatedSession(resp);
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
}
paintSessions();
await loadMessagesForActive();
await loadSessionModePreference();
if (!activeId) {
stopWikiPoller();
} else {
startWikiPoller();
}
if (!String(statusBar.textContent || "").includes(t("chat.error"))) statusBar.textContent = "";
};
const btnNew = el("button", {
type: "button",
class: "chat-nav__new",
title: `${t("chat.newSession")}`,
onclick: async () => {
try {
statusBar.textContent = t("chat.loading");
const resp = await apiPost("/admin/api/chat/sessions", {});
adoptCreatedSession(resp);
await loadSessionModePreference();
paintSessions();
messagesEl.innerHTML = "";
messagesEl.appendChild(el("div", { class: "muted", text: t("chat.empty") }));
statusBar.textContent = "";
} catch (e) {
statusBar.textContent = `${t("chat.error")}: ${String(e)}`;
}
},
});
btnNew.appendChild(el("span", { class: "chat-nav__newGlyph", "aria-hidden": "true" }));
btnNew.appendChild(
el("span", {
class: "chat-nav__newLabel",
"data-i18n": "chat.newSession",
text: t("chat.newSession"),
}),
);
const jobsBadge = el("span", { class: "chat-jobs-badge chat-jobs-badge--idle", text: "0" });
_jobsBadgeEl = jobsBadge;
const jobsLabel = el("span", { class: "chat-nav__jobsLabel", text: t("chat.jobs") });
_jobsBtnLabelEl = jobsLabel;
const btnJobs = el("button", {
type: "button",
class: "chat-nav__jobs",
title: t("chat.jobsRunning", { n: 0 }),
onclick: () => {
openBackgroundJobsPanel().catch((e) => showToast(`${t("chat.error")}: ${String(e)}`, { kind: "error" }));
},
});
btnJobs.appendChild(jobsLabel);
btnJobs.appendChild(jobsBadge);
startJobsBadgePoller();
// Immediate paint so count is visible before first interval tick.
updateJobsBadge(0);
refreshJobsBadge();
class OclawWsChatTransport {
constructor({ tokenProvider }) {
this.tokenProvider = tokenProvider;
this.ws = null;
this.reqSeq = 0;
this.msgQueue = [];
this.waiters = [];
this.lastSeq = 0;
this._sessionSubscriptions = new Set();
this._reconnectBaseMs = 500;
this._reconnectCapMs = 5000;
this._maxReconnectAttempts = 4;
}
_isOpen() {
return this.ws && this.ws.readyState === WebSocket.OPEN;
}
_wsUrl() {
const origin = String(window.location.origin || "").trim();
if (origin.startsWith("http://") || origin.startsWith("https://")) {
const wsOrigin = origin.replace(/^http/i, "ws");
return `${wsOrigin}/ws`;
}
const u = new URL(window.location.href);
u.protocol = u.protocol === "https:" ? "wss:" : "ws:";
u.pathname = "/ws";
u.search = "";
u.hash = "";
return u.toString();
}
_nextReqId() {
this.reqSeq += 1;
return `req_${Date.now()}_${this.reqSeq}`;
}
async _openAndHandshake() {
if (this._isOpen()) return;
let lastErr = null;
for (let i = 0; i <= this._maxReconnectAttempts; i += 1) {
try {
await this._openAndHandshakeOnce();
await this._restoreSubscriptions();
return;
} catch (err) {
lastErr = err;
this.close();
if (i >= this._maxReconnectAttempts) break;
const delay = Math.min(this._reconnectCapMs, this._reconnectBaseMs * Math.pow(2, i));
const jitter = Math.floor(Math.random() * 150);
await new Promise((resolve) => setTimeout(resolve, delay + jitter));
}
}
throw lastErr || new Error("ws_open_failed");
}
async _openAndHandshakeOnce() {
const token = String(this.tokenProvider() || "");
const wsUrl = this._wsUrl();
const ws = new WebSocket(wsUrl);
this.ws = ws;
this.msgQueue = [];
this.waiters = [];
ws.addEventListener("message", (ev) => {
let parsed = null;
try {
parsed = JSON.parse(String(ev.data || "{}"));
} catch (_) {
parsed = null;
}
if (!parsed) return;
if (parsed && parsed.type === "event" && Number.isFinite(Number(parsed.seq))) {
this.lastSeq = Math.max(this.lastSeq, Number(parsed.seq) || 0);
}
const waiter = this.waiters.shift();
if (waiter) {
waiter.resolve(parsed);
} else {
this.msgQueue.push(parsed);
}
});
await new Promise((resolve, reject) => {
const timer = setTimeout(() => reject(new Error(`ws_open_timeout:${wsUrl}`)), 7000);
ws.onopen = () => {
clearTimeout(timer);
resolve();
};
ws.onerror = () => {
clearTimeout(timer);
reject(new Error(`ws_open_failed:${wsUrl}`));
};
});
const challenge = await this._recv();
if (!(challenge && challenge.type === "event" && challenge.event === "connect.challenge")) {
throw new Error("ws_invalid_challenge");
}
const reqId = this._nextReqId();
ws.send(
JSON.stringify({
type: "req",
id: reqId,
method: "connect",
params: {
minProtocol: 3,
maxProtocol: 3,
lastSeq: Number(this.lastSeq || 0),
client: { id: "webchat-ui", version: "0.1", platform: navigator.platform || "web", mode: "webchat" },
role: "operator",
scopes: ["operator.read", "operator.write"],
auth: token ? { token } : {},
},
}),
);
const res = await this._recv();
if (!res || res.type !== "res" || res.id !== reqId || !res.ok) {
throw new Error(`ws_connect_failed:${JSON.stringify((res && res.error) || {})}`);
}
}
async _sendReqAndAwait(method, params) {
await this._openAndHandshake();
const reqId = this._nextReqId();
this.ws.send(JSON.stringify({ type: "req", id: reqId, method: String(method || ""), params: params || {} }));
for (;;) {
const msg = await this._recv();
if (msg && msg.type === "res" && msg.id === reqId) {
if (!msg.ok) throw new Error(`ws_req_failed:${JSON.stringify(msg.error || {})}`);
return msg.payload || {};
}
}
}
async _restoreSubscriptions() {
const items = Array.from(this._sessionSubscriptions);
for (let i = 0; i < items.length; i += 1) {
const key = String(items[i] || "");
if (!key) continue;
await this._sendReqAndAwait("sessions.messages.subscribe", { sessionKey: key });
}
}
_trackSessionSubscription(sessionId) {
const key = String(sessionId || "").trim();
if (!key) return;
this._sessionSubscriptions.add(key);
}
_recv() {
const ws = this.ws;
if (!ws) return Promise.reject(new Error("ws_not_connected"));
if (this.msgQueue.length) return Promise.resolve(this.msgQueue.shift());
return new Promise((resolve, reject) => {
const onErr = () => {
cleanup();
reject(new Error("ws_receive_failed"));
};
const onClose = () => {
cleanup();
reject(new Error("ws_closed"));
};
const cleanup = () => {
ws.removeEventListener("error", onErr);
ws.removeEventListener("close", onClose);
this.waiters = this.waiters.filter((w) => w.resolve !== resolve);
};
this.waiters.push({ resolve, reject });
ws.addEventListener("error", onErr);
ws.addEventListener("close", onClose);
});
}
close() {
if (this.ws) {
try {
this.ws.close(1000, "done");
} catch (_) {}
this.ws = null;
}
}
async sendSessionSend({
sessionId,
text,
attachments,
interactionMode,
specialist,
memoryMode,
executionMode,
idempotencyKey,
signal,
onEvent,
}) {
await this._openAndHandshake();
this._trackSessionSubscription(sessionId);
await this._sendReqAndAwait("sessions.messages.subscribe", { sessionKey: String(sessionId || "") });
const stableIdempotencyKey = String(idempotencyKey || `idem_${Date.now()}_${Math.random().toString(36).slice(2, 8)}`);
const reqId = this._nextReqId();
const req = {
type: "req",
id: reqId,
method: "chat.send",
params: {
sessionKey: String(sessionId || ""),
message: String(text || ""),
attachments: Array.isArray(attachments) ? attachments : [],
idempotencyKey: stableIdempotencyKey,
thinking: "default",
interaction_mode: String(interactionMode || "expert"),
specialist: String(specialist || "generalist"),
memory_mode: String(memoryMode || "default"),
execution_mode: String(executionMode || "agent"),
plan_agent_version: outboundPlanAgentVersion(),
lang: currentLang === "en" ? "en" : "zh",
},
};
this.ws.send(JSON.stringify(req));
let doneMeta = null;
let retriedAfterReconnect = false;
while (true) {
if (signal && signal.aborted) throw new DOMException("Aborted", "AbortError");
let msg = null;
try {
msg = await this._recv();
} catch (err) {
const em = String((err && err.message) || err || "").toLowerCase();
if (!retriedAfterReconnect && (em.includes("ws_closed") || em.includes("ws_receive_failed"))) {
retriedAfterReconnect = true;
await this._openAndHandshake();
this.ws.send(JSON.stringify(req));
continue;
}
throw err;
}
if (
msg &&
msg.type === "event" &&
(msg.event === "chat" ||
msg.event === "session.message" ||
msg.event === "agent.event" ||
msg.event === "session.tool" ||
msg.event === "session.marker" ||
msg.event === "session.turn_started") &&
typeof onEvent === "function"
) {
const payload = msg.payload || {};
onEvent({ event: String(msg.event || ""), payload });
const d = msg.event === "chat" ? { phase: String(payload.state || "") } : {};
const phase = String(d.phase || "");
if (phase === "final" || phase === "error" || phase === "aborted") {
return doneMeta;
}
continue;
}
if (msg && msg.type === "res" && msg.id === reqId) {
if (!msg.ok) throw new Error(`ws_req_failed:${JSON.stringify(msg.error || {})}`);
const p = msg.payload || {};
doneMeta = {
interaction_mode: String(p.interactionMode || interactionMode || ""),
execution_mode: String(p.executionMode || executionMode || EXECUTION_MODE_AGENT || ""),
selected_specialist: String(p.selectedSpecialist || specialist || ""),
dispatch_reason: String(p.dispatchReason || ""),
manager_selected_specialist: String(p.managerSelectedSpecialist || ""),
requested_specialist: String(p.requestedSpecialist || ""),
dynamic_agent_used: !!p.dynamicAgentUsed,
dynamic_agent_name: String(p.dynamicAgentName || ""),
relay_pointer_count: Number(p.relayPointerCount || 0) || 0,
relay_envelope_present: !!p.relayEnvelopePresent,
relay_envelope_pointer_count: Number(p.relayEnvelopePointerCount || 0) || 0,
relay_ttl_turn_count: Number(p.relayTtlTurnCount || 0) || 0,
relay_ttl_session_count: Number(p.relayTtlSessionCount || 0) || 0,
relay_ttl_keep_count: Number(p.relayTtlKeepCount || 0) || 0,
ttft: p.ttft && typeof p.ttft === "object" ? p.ttft : null,
reply: String(p.reply || ""),
};
if (String(p.status || "") === "started") {
continue;
}
// Oclaw-style: response ack does not terminate the stream.
// Wait strictly for chat final/aborted/error or session.message assistant.
continue;
}
if (msg && msg.type === "event" && msg.event === "chat") {
const p = msg.payload || {};
const d = { phase: String(p.state || "") };
const phase = String(d.phase || "");
if (phase === "final" || phase === "error" || phase === "aborted") {
return doneMeta;
}
}
}
}
async sendChatAbort({ sessionId, runId }) {
// Abort should use the same WS connection when possible.
await this._openAndHandshake();
const reqId = this._nextReqId();
this.ws.send(
JSON.stringify({
type: "req",
id: reqId,
method: "chat.abort",
params: { sessionKey: String(sessionId || ""), runId: runId ? String(runId) : undefined },
}),
);
for (;;) {
const msg = await this._recv();
if (msg && msg.type === "res" && msg.id === reqId) {
if (!msg.ok) throw new Error(`ws_req_failed:${JSON.stringify(msg.error || {})}`);
return msg.payload || {};
}
}
}
}
let currentStreamAbortController = null;
let currentWsTransport = null;
let currentAbortMeta = { sessionId: "", runId: "" };
// Disable WS send inactivity timeout by default (0 = disabled).
// Some gateways can legitimately stream slower than 3 minutes.
const WS_CHAT_SEND_TIMEOUT_MS = 0;
const isAbortError = (err) => {
const name = String(err && err.name ? err.name : "");
const msg = String(err && err.message ? err.message : err || "");
return name === "AbortError" || msg.toLowerCase().includes("aborted");
};
const _silentReplyPattern = /^\s*NO_REPLY\s*$/;
const _isSilentReplyStream = (text) => _silentReplyPattern.test(String(text || ""));
const _normalizeAssistantMessage = (message, { requireRole = false, requireContentArray = false } = {}) => {
if (!message || typeof message !== "object") return null;
const m = message;
const role = String(m.role || "").toLowerCase();
if (requireRole && role !== "assistant") return null;
if (requireContentArray && !Array.isArray(m.content)) return null;
const hasRootAttachments = m.attachments != null && m.attachments !== "";
if (!("content" in m) && !("text" in m) && !hasRootAttachments) return null;
return m;
};
const _expandAssistantMessageForRender = (message) => {
if (!message || typeof message !== "object") return [];
const mesAttParsed = parseAttachments(message.attachments);
const mesAtt = mesAttParsed.length ? mesAttParsed : null;
const srcEventType = _normalizeEventType(message.event_type || message.eventType);
const fallbackEventType = srcEventType === "tool_call" ? "tool_call" : "assistant_text";
const base = {
role: "assistant",
id: message.id,
timestamp: message.timestamp != null ? message.timestamp : new Date().toISOString(),
};
const out = [];
let ep = message.event_payload;
if (typeof ep === "string" && String(ep).trim()) {
try {
ep = JSON.parse(ep);
} catch (_) {
ep = null;
}
}
if (ep && typeof ep === "object" && !Array.isArray(ep)) {
const rc = decodeEscapedNewlines(String(ep.reasoning_content || "")).trim();
if (rc) out.push({ ...base, content: rc, event_type: "reasoning" });
}
const contentItems = Array.isArray(message.content) ? message.content : [];
for (const item of contentItems) {
if (!item || typeof item !== "object") continue;
const typ = String(item.type || "").toLowerCase();
if (typ === "reasoning" || typ === "reasoning_text" || typ === "thinking" || typ === "thought") {
const reasoningText = decodeEscapedNewlines(String(item.text || item.content || item.summary || "")).trim();
if (reasoningText) out.push({ ...base, content: reasoningText, event_type: "reasoning" });
continue;
}
const textBody = decodeEscapedNewlines(
String(item.text || item.output_text || item.content || item.value || ""),
).trim();
if (!textBody) continue;
if (typ === "text" || typ === "output_text" || typ === "assistant_text" || !typ) {
out.push({ ...base, content: textBody, event_type: "assistant_text" });
}
}
const textFallback = decodeEscapedNewlines(
typeof message.content === "string" ? message.content : typeof message.text === "string" ? message.text : "",
).trim();
const hasBodyText = out.some((row) => {
const et = _normalizeEventType(row.event_type);
return _isAssistantBodyEventType(et) || et === "tool_call";
});
if (textFallback && !hasBodyText) {
out.push({ ...base, content: textFallback, event_type: fallbackEventType });
}
if (!out.length && (textFallback || (mesAtt && mesAtt.length))) {
return [
{
...base,
content: textFallback,
event_type: fallbackEventType,
tool_calls: message.tool_calls != null ? message.tool_calls : message.toolCalls,
...(mesAtt && mesAtt.length ? { attachments: mesAtt } : {}),
},
];
}
if (out.length) {
const _isBodyRow = (row) => {
const et = _normalizeEventType(row && row.event_type);
return _isAssistantBodyEventType(et) || et === "tool_call";
};
let attachIdx = out.length - 1;
for (let i = out.length - 1; i >= 0; i -= 1) {
if (_isBodyRow(out[i])) {
attachIdx = i;
break;
}
}
out[attachIdx] = {
...out[attachIdx],
tool_calls: message.tool_calls != null ? message.tool_calls : message.toolCalls,
};
// Avoid duplicating blobs: attach WS/API root attachments to the latest body row only.
if (mesAtt && mesAtt.length) {
for (let i = out.length - 1; i >= 0; i -= 1) {
if (_isBodyRow(out[i])) {
out[i] = { ...out[i], attachments: mesAtt };
break;
}
}
}
return out;
}
return [];
};
const sendMessageStream = async (userText, attachmentPayload, turnId) => {
const token = localStorage.getItem(AUTH_TOKEN_KEY) || "";
const turnStartedAtMs = Date.now();
let streamBubble = null;
let streamRow = null;
let doneMeta = null;
let chatStream = "";
let chatRunId = null;
let chatStreamSegments = [];
let renderRafId = null;
let renderPending = false;
let transportUsed = "ws";
let typingRafId = null;
let typingTimerId = null;
let streamStatusTimerId = null;
let streamStatusBase = "oclaw";
let streamDisplayTarget = "";
let streamDisplayShown = "";
let streamTextBuffer = "";
const streamStitcher = createStreamStitcher();
let streamMermaidTimerId = null;
let perCharNewlineMode = false;
let perCharNewlineScore = 0;
let toolSeq = 0;
let hasRealStreamText = false;
let sawWsChatEvent = false;
let sawWsTerminalEvent = false;
let sawStreamToolRefAttachments = false;
let markerState = { p: 0, e: false, ep: 0, t: 0, s: 0, k: 0, reclaimed: 0 };
let turnAcceptedAtMs = null;
let phaseRunningAtMs = null;
let firstDeltaAtMs = null;
const _numOrNull = (v) => {
if (v === null || v === undefined) return null;
const n = Number(v);
return Number.isFinite(n) ? n : null;
};
const _sleep = (ms) =>
new Promise((resolve) => {
setTimeout(resolve, Math.max(0, Number(ms) || 0));
});
const _recoverLatestAssistantFromHistory = async () => {
const resp = await apiGet(
`/admin/api/chat/sessions/${encodeURIComponent(activeId)}/messages?limit=${CHAT_MESSAGES_FETCH_LIMIT}`,
);
const msgs = Array.isArray(resp && resp.messages) ? resp.messages : [];
if (!msgs.length) return false;
let last = null;
for (let i = msgs.length - 1; i >= 0; i--) {
const m = msgs[i];
if (String((m && m.role) || "").toLowerCase() !== "assistant") continue;
// Recovery should only accept visible assistant body, not intermediate
// reasoning/tool-call events; otherwise we may terminate on a partial line.
const et = String((m && m.event_type) || "").trim().toLowerCase();
if (et && !_isAssistantBodyEventType(et)) continue;
if (!String((m && m.content) || "").trim()) continue;
{
last = m;
break;
}
}
if (!last) return false;
const tsRaw = String((last && last.timestamp) || "");
const tsMs = tsRaw ? Date.parse(tsRaw) : NaN;
const fresh = Number.isFinite(tsMs) ? tsMs >= turnStartedAtMs - 1500 : true;
if (!fresh) return false;
await loadMessagesForActive();
return true;
};
const ensureStreamBubble = () => {
if (streamBubble) return streamBubble;
const inner = el("div", { class: "chat-msg chat-msg--assistant" });
inner.appendChild(el("div", { class: "chat-msg__stream-status", text: `${t("chat.status.oclaw")}...` }));
inner.appendChild(el("div", { class: "chat-msg__md", html: "" }));
streamRow = wrapAssistantMessage(inner, new Date().toISOString());
streamBubble = inner;
messagesEl.appendChild(streamRow);
return streamBubble;
};
const _labelPhase = (phase) => {
const p = String(phase || "").toLowerCase();
if (!p) return "oclaw";
if (p.includes("plan")) return "plan";
if (p.includes("tool")) return "tool";
if (p.includes("agent")) return "agent";
if (p.includes("core")) return "oclaw";
if (p.includes("manager")) return "oclaw";
if (p === "start") return "start";
if (p === "running") return "running";
if (p === "end") return "end";
if (p === "error") return "error";
if (p === "started") return "oclaw";
if (p === "delta") return "agent";
return p;
};
const _statusLabel = (key) => {
const k = String(key || "").trim();
if (!k) return t("chat.status.oclaw");
const dictKey = `chat.status.${k}`;
const localized = t(dictKey);
if (localized !== dictKey) return localized;
return k;
};
const _setStreamStatusBase = (phase) => {
streamStatusBase = _labelPhase(phase);
_setDynamicStreamStatus();
};
const _setDynamicStreamStatus = () => {
const bubble = ensureStreamBubble();
const statusEl = bubble.querySelector(".chat-msg__stream-status");
if (!statusEl) return;
const dots = ".".repeat((Math.floor(Date.now() / 400) % 3) + 1);
const baseLabel = _statusLabel(streamStatusBase);
const elapsedMs = turnAcceptedAtMs ? Math.max(0, Date.now() - Number(turnAcceptedAtMs || 0)) : 0;
const elapsedText = elapsedMs > 0 ? ` ${Math.round(elapsedMs / 100) / 10}s` : "";
statusEl.textContent = `${baseLabel}${elapsedText}${dots}`;
};
const _startDynamicStreamStatus = () => {
_setDynamicStreamStatus();
if (streamStatusTimerId != null) return;
streamStatusTimerId = setInterval(_setDynamicStreamStatus, 400);
};
const _stopDynamicStreamStatus = () => {
if (streamStatusTimerId != null) {
clearInterval(streamStatusTimerId);
streamStatusTimerId = null;
}
};
const _markStreamTerminal = (phase, noteText) => {
const bubble = ensureStreamBubble();
const statusEl = bubble.querySelector(".chat-msg__stream-status");
if (statusEl) statusEl.textContent = _statusLabel(_labelPhase(phase));
const md = bubble.querySelector(".chat-msg__md");
if (md && !String(md.textContent || "").trim() && String(noteText || "").trim()) {
md.innerHTML = `${escapeHtml(String(noteText || ""))}
`;
}
};
const _composeStreamPlainText = () => {
const chunks = [];
for (const seg of chatStreamSegments) {
if (!seg || seg.type !== "text") continue;
const txt = String(seg.text || "");
if (txt) chunks.push(txt);
}
// Keep 1:1 character mapping with original text segments.
// Never inject separators here; otherwise typewriter offsets drift.
return decodeEscapedNewlines(chunks.join(""));
};
const _normalizeStreamTargetForRender = (raw) => {
let s = String(raw || "").replace(/\r/g, "");
if (!s) return "";
// Streaming-only guard: some gateways emit per-char newlines in delta chunks,
// producing vertical "one character per line" layout.
const lines = s.split("\n");
if (lines.length >= 4) {
let short = 0;
let nonEmpty = 0;
let totalLen = 0;
for (const ln of lines) {
const t = String(ln || "");
if (!t) continue;
nonEmpty += 1;
totalLen += t.length;
if (t.length <= 2) short += 1;
}
const avgLen = nonEmpty ? totalLen / nonEmpty : 0;
const shortRatio = nonEmpty ? short / nonEmpty : 0;
if (shortRatio >= 0.75 && avgLen <= 2.0) {
// Join characters back for live display.
s = lines.join("");
} else {
// Fallback: if newline density is abnormally high, collapse line breaks for live view.
const nl = lines.length - 1;
if (nl >= 8 && nl >= Math.floor(s.length * 0.2)) {
s = s.replace(/\n+/g, "");
}
}
}
return s;
};
const _renderStreamCompositeNow = () => {
const bubble = ensureStreamBubble();
const md = bubble.querySelector(".chat-msg__md");
if (md) {
const blocks = [];
if (markerState.p > 0 || markerState.e || markerState.ep > 0) {
blocks.push(
`${escapeHtml(
t("chat.marker.summary", {
p: String(markerState.p || 0),
e: markerState.e ? "1" : "0",
ep: String(markerState.ep || 0),
}),
)}
`,
);
blocks.push(
`${escapeHtml(
t("chat.marker.ttl", {
t: String(markerState.t || 0),
s: String(markerState.s || 0),
k: String(markerState.k || 0),
}),
)}
`,
);
if ((Number(markerState.reclaimed || 0) || 0) > 0) {
blocks.push(
`${escapeHtml(
t("chat.marker.reclaimed", { n: String(markerState.reclaimed || 0) }),
)}
`,
);
}
}
let textIdx = 0;
let textBuf = "";
const flushTextBuf = () => {
if (!String(textBuf || "").trim()) {
textBuf = "";
return;
}
blocks.push(
`${escapeHtml(decodeEscapedNewlines(textBuf)).replace(/\\n/g, "
")}
`,
);
textBuf = "";
};
for (const seg of chatStreamSegments) {
if (!seg) continue;
if (seg.type === "text") {
const full = String(seg.text || "");
if (!full) continue;
const showLen = Math.max(0, Math.min(full.length, streamDisplayShown.length - textIdx));
const shown = full.slice(0, showLen);
textIdx += full.length;
if (!shown) continue;
textBuf += shown;
continue;
}
if (seg.type === "tool") {
const title = String(seg.title || "tool");
const body = String(seg.body || "");
const images = Array.isArray(seg.images) ? seg.images : [];
// Live stream: always render tool cards from session.tool so过程态完整；showToolOutput 仍用于历史聚合气泡。
flushTextBuf();
const audit = seg.sqlAudit && typeof seg.sqlAudit === "object" ? seg.sqlAudit : null;
if (audit) {
const guard = audit.guard && typeof audit.guard === "object" ? audit.guard : {};
const autoLimit = _sqlLimitSuffix(audit.inputSql, audit.executedSql);
const executedDiffHtml = _renderExecutedSqlWithAddedHighlight(audit.inputSql, audit.executedSql);
blocks.push(
`${escapeHtml(title)} · SQL audit
input SQL
${escapeHtml(String(audit.inputSql || ""))}executed SQL (added highlighted)
${executedDiffHtml}
${autoLimit ? `auto-added clause: ${escapeHtml(autoLimit)}
` : ""}
readonly_enforced=${escapeHtml(String(!!guard.readonly_enforced))} ·
multi_statement_forbidden=${escapeHtml(String(!!guard.multi_statement_forbidden))} ·
auto_limit_applied=${escapeHtml(String(!!guard.auto_limit_applied))} ·
result_row_cap=${escapeHtml(String(guard.result_row_cap != null ? guard.result_row_cap : ""))} ·
engine=${escapeHtml(String(audit.engine || ""))} ·
rows_returned=${escapeHtml(String(audit.rowsReturned != null ? audit.rowsReturned : ""))}
${escapeHtml(title)}
${escapeHtml(body)}