Browsing…
Private Browser${uiModule.esc(_privateBrowserActionLabel(command))}
${imgHtml}
Private Browser
Browsing…
Thinking${thinkingOn ? 'On' : 'Off'}
`;
const thinkingToggle = document.createElement('button');
thinkingToggle.type = 'button';
thinkingToggle.className = `chat-context-toggle${thinkingOn ? ' active' : ''}`;
thinkingToggle.setAttribute('role', 'switch');
thinkingToggle.setAttribute('aria-label', 'Thinking for this chat');
thinkingToggle.setAttribute('aria-checked', thinkingOn ? 'true' : 'false');
thinkingToggle.addEventListener('click', async (event) => {
event.stopPropagation();
thinkingToggle.disabled = true;
const next = !thinkingToggle.classList.contains('active');
if (await _saveChatGenerationSettings({ thinking_mode: next ? 'on' : 'off' })) {
thinkingToggle.classList.toggle('active', next);
thinkingToggle.setAttribute('aria-checked', next ? 'true' : 'false');
thinkingRow.querySelector('.chat-context-toggle-state').textContent = next ? 'On' : 'Off';
uiModule.showToast(`Thinking ${next ? 'on' : 'off'} for this chat`);
}
thinkingToggle.disabled = false;
});
thinkingRow.appendChild(thinkingToggle);
popup.appendChild(thinkingRow);
}
const effort = document.getElementById('reasoning-effort-wrap');
if (effort) popup.appendChild(effort);
const addGenerationSlider = (label, value, min, max, step, formatter, key) => {
const row = document.createElement('div');
row.className = 'chat-context-threshold-row';
row.innerHTML = `${label}${formatter(value)}
`;
const input = document.createElement('input');
Object.assign(input, { type: 'range', min: String(min), max: String(max), step: String(step), value: String(value), className: 'chat-context-threshold-slider preset-range' });
input.addEventListener('input', () => { row.querySelector('.chat-context-threshold-top span:last-child').textContent = formatter(Number(input.value)); });
input.addEventListener('change', () => _saveChatGenerationSettings({ [key]: key === 'max_tokens_override' && Number(input.value) > 8192 ? null : Number(input.value) }));
row.appendChild(input); popup.appendChild(row);
};
addGenerationSlider('Temperature', d.temperature_override ?? 1, 0, 2, 0.1, v => Number(v).toFixed(1), 'temperature_override');
addGenerationSlider('Max tokens', d.max_tokens_override ?? 8448, 256, 8448, 256, v => Number(v) > 8192 ? 'No limit' : Number(v).toLocaleString(), 'max_tokens_override');
const threshold = _clampAutoCompactThreshold(d.auto_compact_threshold || 85);
const thresholdRow = document.createElement('div');
thresholdRow.className = 'chat-context-threshold-row';
const thresholdTop = document.createElement('div');
thresholdTop.className = 'chat-context-threshold-top';
const thresholdLabel = document.createElement('span');
thresholdLabel.textContent = 'Auto compact';
const thresholdValue = document.createElement('span');
thresholdValue.textContent = `${threshold}%`;
thresholdTop.appendChild(thresholdLabel);
thresholdTop.appendChild(thresholdValue);
const thresholdSlider = document.createElement('input');
thresholdSlider.type = 'range';
thresholdSlider.min = '50';
thresholdSlider.max = '95';
thresholdSlider.step = '5';
thresholdSlider.value = String(threshold);
thresholdSlider.className = 'chat-context-threshold-slider preset-range';
thresholdSlider.addEventListener('input', () => {
thresholdValue.textContent = `${_clampAutoCompactThreshold(thresholdSlider.value)}%`;
});
thresholdSlider.addEventListener('change', async () => {
const next = _clampAutoCompactThreshold(thresholdSlider.value);
thresholdSlider.disabled = true;
try {
let res;
try {
res = await fetch('/api/auth/settings', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'same-origin',
body: JSON.stringify({ auto_compact_threshold_percent: next }),
});
} finally {
invalidateSettings();
}
if (!res.ok) throw new Error(await res.text());
_contextHeaderData = { ..._contextHeaderData, auto_compact_threshold: next };
uiModule.showToast(`Auto compact at ${next}%`);
await refreshChatContextHeader('threshold');
} catch (err) {
uiModule.showError(`Could not save auto compact threshold: ${err.message || err}`);
thresholdSlider.value = String(threshold);
thresholdValue.textContent = `${threshold}%`;
} finally {
thresholdSlider.disabled = false;
}
});
thresholdRow.appendChild(thresholdTop);
thresholdRow.appendChild(thresholdSlider);
popup.appendChild(thresholdRow);
if (d.can_compact) {
const compactBtn = document.createElement('button');
compactBtn.type = 'button';
compactBtn.className = 'chat-context-compact-btn';
compactBtn.innerHTML = 'Compact';
compactBtn.addEventListener('click', async (e) => {
e.stopPropagation();
compactBtn.disabled = true;
compactBtn.replaceChildren();
try {
const wp = spinnerModule.createWhirlpool(13);
wp.element.style.margin = '0 5px 0 0';
wp.element.style.transform = 'translateY(-2px)';
compactBtn.appendChild(wp.element);
} catch (_) {}
compactBtn.appendChild(document.createTextNode('Compacting'));
const ok = await compactCurrentChatContext();
if (!ok) {
compactBtn.disabled = false;
compactBtn.textContent = 'Compact failed';
}
});
popup.appendChild(compactBtn);
}
pill.classList.add('open');
_contextHeaderAnchorEl?.classList?.add('open');
_positionContextHeaderPopup(popup, _contextHeaderAnchorEl);
setTimeout(() => {
if (!popup.isConnected) return;
const closeOnEscape = (ev) => {
if (ev.key !== 'Escape') return;
ev.preventDefault();
ev.stopPropagation();
_closeContextHeaderPopup();
};
document.addEventListener('keydown', closeOnEscape, true);
const close = (ev) => {
if (popup.contains(ev.target) || pill.contains(ev.target) || _contextHeaderAnchorEl?.contains?.(ev.target)) return;
_closeContextHeaderPopup();
};
document.addEventListener('pointerdown', close, true);
_contextHeaderPopupCleanup = () => {
document.removeEventListener('pointerdown', close, true);
document.removeEventListener('keydown', closeOnEscape, true);
};
}, 0);
}
function _bindContextHeaderPill() {
if (_contextHeaderBound) return;
_contextHeaderBound = true;
const pill = document.getElementById('chat-context-pill');
if (!pill) return;
pill.addEventListener('click', (e) => {
e.preventDefault();
e.stopPropagation();
_showContextHeaderPopup(pill);
});
}
async function _setChatMemoryExtraction(enabled, toggleBtn, stateText) {
const sid = await _resolveCurrentSessionId({ adopt: true });
if (!sid) {
uiModule.showToast('Open a chat first');
return false;
}
const next = !!enabled;
if (toggleBtn) toggleBtn.disabled = true;
try {
const res = await fetch(`/api/session/${encodeURIComponent(sid)}/memory-extraction`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'same-origin',
body: JSON.stringify({ enabled: next }),
});
if (!res.ok) throw new Error(await res.text());
_contextHeaderData = {
...(_contextHeaderData || {}),
memory_extraction_enabled: next,
};
if (toggleBtn) {
toggleBtn.classList.toggle('active', next);
toggleBtn.setAttribute('aria-checked', next ? 'true' : 'false');
}
if (stateText) stateText.textContent = next ? 'On' : 'Off';
uiModule.showToast(next ? 'Memory extraction on for this chat' : 'Memory extraction off for this chat');
// The popup already contains the updated state. Refreshing the whole
// context header here removes and recreates the popup while the user is
// interacting with it, which makes the dropdown appear to close.
return true;
} catch (err) {
uiModule.showError(`Could not save memory extraction: ${err.message || err}`);
return false;
} finally {
if (toggleBtn) toggleBtn.disabled = false;
}
}
async function _setChatSkillInjection(enabled, toggleBtn, stateText) {
const sid = await _resolveCurrentSessionId({ adopt: true });
if (!sid) {
uiModule.showToast('Open a chat first');
return false;
}
const next = !!enabled;
if (toggleBtn) toggleBtn.disabled = true;
try {
const res = await fetch(`/api/session/${encodeURIComponent(sid)}/skill-injection`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'same-origin',
body: JSON.stringify({ enabled: next }),
});
if (!res.ok) throw new Error(await res.text());
_contextHeaderData = {
...(_contextHeaderData || {}),
skill_injection_enabled: next,
};
if (toggleBtn) {
toggleBtn.classList.toggle('active', next);
toggleBtn.setAttribute('aria-checked', next ? 'true' : 'false');
}
if (stateText) stateText.textContent = next ? 'On' : 'Off';
uiModule.showToast(next ? 'Skill injection on for this chat' : 'Skill injection off for this chat');
return true;
} catch (err) {
uiModule.showError(`Could not save skill injection: ${err.message || err}`);
return false;
} finally {
if (toggleBtn) toggleBtn.disabled = false;
}
}
async function _setChatMemoryInjection(enabled, toggleBtn, stateText) {
const sid = await _resolveCurrentSessionId({ adopt: true });
if (!sid) {
uiModule.showToast('Open a chat first');
return false;
}
const next = !!enabled;
if (toggleBtn) toggleBtn.disabled = true;
try {
const res = await fetch(`/api/session/${encodeURIComponent(sid)}/memory-injection`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'same-origin',
body: JSON.stringify({ enabled: next }),
});
if (!res.ok) throw new Error(await res.text());
_contextHeaderData = {
...(_contextHeaderData || {}),
memory_injection_enabled: next,
};
if (toggleBtn) {
toggleBtn.classList.toggle('active', next);
toggleBtn.setAttribute('aria-checked', next ? 'true' : 'false');
}
if (stateText) stateText.textContent = next ? 'On' : 'Off';
uiModule.showToast(next ? 'Memory injection on for this chat' : 'Memory injection off for this chat');
return true;
} catch (err) {
uiModule.showError(`Could not save memory injection: ${err.message || err}`);
return false;
} finally {
if (toggleBtn) toggleBtn.disabled = false;
}
}
async function _saveChatGenerationSettings(change) {
const sid = await _resolveCurrentSessionId({ adopt: true });
if (!sid) return false;
const next = { thinking_mode: _contextHeaderData?.thinking_mode || '', temperature_override: _contextHeaderData?.temperature_override ?? null, max_tokens_override: _contextHeaderData?.max_tokens_override ?? null, ...change };
try {
const res = await fetch(`/api/session/${encodeURIComponent(sid)}/generation-settings`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify(next) });
if (!res.ok) throw new Error(await res.text());
_contextHeaderData = { ..._contextHeaderData, ...await res.json() };
const session = _liveSessionModule()?.getSessions?.().find(item => item.id === sid);
if (session) Object.assign(session, {
thinking_mode: _contextHeaderData.thinking_mode,
temperature_override: _contextHeaderData.temperature_override,
max_tokens_override: _contextHeaderData.max_tokens_override,
});
return true;
} catch (err) { uiModule.showError(`Could not save chat settings: ${err.message || err}`); return false; }
}
export async function compactCurrentChatContext() {
const sm = _liveSessionModule();
const sid = await _resolveCurrentSessionId({ adopt: true });
if (!sid) {
uiModule.showToast('Open a chat first');
return false;
}
try {
const res = await fetch(`/api/session/${encodeURIComponent(sid)}/compact`, { method: 'POST' });
if (!res.ok) throw new Error(await res.text());
uiModule.showToast('Context compacted');
_closeContextHeaderPopup();
if (sm && sm.selectSession) await sm.selectSession(sid, { keepSidebar: true, showLoading: false });
refreshChatContextHeader('compact');
return true;
} catch (err) {
uiModule.showError(`Compact failed: ${err.message || err}`);
return false;
}
}
try { window.compactCurrentChatContext = compactCurrentChatContext; } catch (_) {}
export async function refreshChatContextHeader(reason = '') {
_bindContextHeaderPill();
const pill = document.getElementById('chat-context-pill');
if (!pill) return;
const sm = _liveSessionModule();
const sid = await _resolveCurrentSessionId({ adopt: false });
const seq = ++_contextHeaderSeq;
if (!sid) {
_contextHeaderData = null;
pill.hidden = true;
_closeContextHeaderPopup();
return;
}
pill.hidden = false;
pill.classList.add('loading');
try {
const res = await fetch(`/api/session/${encodeURIComponent(sid)}/context`, { credentials: 'same-origin' });
if (!res.ok) throw new Error(await res.text());
const data = await res.json();
if (seq !== _contextHeaderSeq) return;
const latestSm = _liveSessionModule();
if (!latestSm.getCurrentSessionId || latestSm.getCurrentSessionId() !== sid) return;
_contextHeaderData = data;
const pct = Number(data.context_percent || 0);
_renderContextHeaderRing(pill, pct);
pill.title = 'Chat settings';
pill.classList.remove('warn', 'danger');
const colorClass = _contextColorClass(pct);
if (colorClass) pill.classList.add(colorClass);
pill.classList.remove('loading');
if (pill.classList.contains('open')) {
const anchor = _contextHeaderAnchorEl;
_closeContextHeaderPopup();
_showContextHeaderPopup(anchor);
}
} catch (err) {
if (seq !== _contextHeaderSeq) return;
_contextHeaderData = null;
pill.hidden = true;
pill.classList.remove('loading', 'warn', 'danger');
_closeContextHeaderPopup();
console.warn('context header refresh failed:', reason, err);
}
}
try { window.refreshChatContextHeader = refreshChatContextHeader; } catch (_) {}
function _setForegroundChatBusy(active) {
try {
window.__odysseusChatBusy = !!active;
window.__odysseusChatBusyUntil = active ? Date.now() + 120000 : Date.now() + 1200;
window.dispatchEvent(new CustomEvent('odysseus:chat-busy-change', { detail: { active: !!active } }));
} catch (_) {}
}
let _pendingContinue = null; // Stores the stopped AI element to merge with new response
function _createChatSendPerf() {
const started = (performance && performance.now) ? performance.now() : Date.now();
let last = started;
let reported = false;
const stages = [];
const now = () => (performance && performance.now) ? performance.now() : Date.now();
return {
mark(name) {
const t = now();
stages.push({ name, delta_ms: Math.round(t - last), at_ms: Math.round(t - started) });
last = t;
},
report(extra) {
if (reported) return;
const total = Math.round(now() - started);
const slowStage = stages.some(s => (s.delta_ms || 0) >= 1500);
if (total < 1500 && !slowStage) return;
reported = true;
const payload = JSON.stringify({
type: 'chat_send',
total_ms: total,
stages,
extra: extra || '',
session: sessionModule && sessionModule.getCurrentSessionId ? sessionModule.getCurrentSessionId() : '',
});
try {
if (navigator.sendBeacon) {
navigator.sendBeacon(`${API_BASE}/api/client-perf`, new Blob([payload], { type: 'application/json' }));
return;
}
} catch (_) {}
try {
fetch(`${API_BASE}/api/client-perf`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: payload,
keepalive: true,
credentials: 'same-origin',
}).catch(() => {});
} catch (_) {}
}
};
}
function _hashSessionCandidate() {
try {
const hashId = String(window.location.hash || '').replace(/^#/, '').trim();
if (!hashId) return '';
if (/^(document|note|image|email|event|task|skill|research)-/.test(hashId) || /^open=notes¬e=/.test(hashId)) return '';
return hashId;
} catch (_) {
return '';
}
}
async function _adoptOpenedSessionBeforeAutoCreate() {
if (!sessionModule || !sessionModule.getCurrentSessionId || sessionModule.getCurrentSessionId()) return true;
// Don't adopt a stale session when the user explicitly started a New Chat
// (pending state set) — the send path must materialize the pending session.
if (sessionModule.hasPendingChat && sessionModule.hasPendingChat()) return false;
const activeRowId = document.querySelector('.list-item.active-session[data-session-id], .session-item.active[data-session-id]')?.dataset?.sessionId || '';
const hashId = _hashSessionCandidate();
const lastSelectedId = String(window.__odysseusLastSelectedSessionId || '').trim();
const targetId = activeRowId || hashId || lastSelectedId;
if (!targetId) return false;
try {
window.__odysseusComposerUserEdited = true;
if (sessionModule.selectSession) {
await sessionModule.selectSession(targetId, { keepSidebar: true, showLoading: false });
} else if (sessionModule.setCurrentSessionId) {
sessionModule.setCurrentSessionId(targetId);
}
return !!(sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId());
} catch (_) {
return false;
}
}
// ── Auto-recovery: when a turn's stream silently dies (connection drop) or
// goes quiet while the connection is alive, re-engage the model with a
// completion handshake instead of leaving it hung. Capped so it can't loop.
let _autoNudges = 0; // handshakes fired for the CURRENT user turn
let _autoContinuePending = false; // marks the next submit as an auto-continue (don't reset the counter)
const _AUTO_NUDGE_CAP = 3;
// shortModel and modelColor are now in chatRenderer.js
var _shortModel = chatRenderer.shortModel;
var _modelRouteLabel = chatRenderer.modelRouteLabel;
var _sameModelName = chatRenderer.sameModelName;
var _applyModelColor = chatRenderer.applyModelColor;
function _setRoleModelLabel(roleEl, requestedModel, actualModel, opts) {
if (!roleEl) return;
opts = opts || {};
const tsSpan = roleEl.querySelector('.role-timestamp');
const req = requestedModel || actualModel || '';
const actual = actualModel || requestedModel || '';
let label = _modelRouteLabel(
req,
actual,
opts.requestedEndpointLabel,
opts.actualEndpointLabel,
opts.requestedEndpointId,
opts.actualEndpointId,
);
if (opts.suffix) label += ' (' + opts.suffix + ')';
if (opts.characterName) label = opts.characterName;
roleEl.textContent = label + ' ';
_applyModelColor(roleEl, actual || req);
const endpointChanged = Boolean(
opts.requestedEndpointId
&& opts.actualEndpointId
&& opts.requestedEndpointId !== opts.actualEndpointId
);
if (req && actual && (!_sameModelName(req, actual) || endpointChanged)) {
roleEl.title = req + ' -> ' + actual
+ (endpointChanged ? ' (' + opts.requestedEndpointLabel + ' -> ' + opts.actualEndpointLabel + ')' : '')
+ (opts.reason ? ': ' + opts.reason : '');
} else if (!opts.reason) {
roleEl.removeAttribute('title');
}
if (tsSpan) roleEl.appendChild(tsSpan);
}
function _bestKnownStreamModel(routeSnapshot) {
try {
const current = sessionModule.getCurrentModel ? sessionModule.getCurrentModel() : '';
if (current) return current;
} catch (_) {}
try {
const pending = sessionModule.getPendingChat && sessionModule.getPendingChat();
if (pending && pending.modelId) return pending.modelId;
} catch (_) {}
try {
const lastPicked = window.__odysseusLastPickedRoute || null;
if (lastPicked && lastPicked.model && Date.now() - (lastPicked.picked_at || 0) < 10 * 60 * 1000) {
return lastPicked.model;
}
} catch (_) {}
if (routeSnapshot && routeSnapshot.model) return routeSnapshot.model;
try {
const dc = window.__odysseusDefaultChat || JSON.parse(localStorage.getItem('odysseus-default-chat-cache') || 'null');
if (dc && dc.model) return dc.model;
} catch (_) {}
return '';
}
// Per-session research tracking (supports concurrent research across sessions)
const _researchingStreamIds = new Set();
let _researchTimerEl = null, _researchTimerInterval = null;
let _researchStartTime = 0, _researchAvgDuration = null;
let _researchSynapse = null;
function _clearResearchTimer() {
if (_researchTimerInterval) { clearInterval(_researchTimerInterval); _researchTimerInterval = null; }
if (_researchTimerEl) { _researchTimerEl.remove(); _researchTimerEl = null; }
if (_researchSynapse) {
// Mark complete first so the user briefly sees the "done" state,
// then tear it down on next tick.
try { _researchSynapse.complete(); } catch {}
const s = _researchSynapse;
_researchSynapse = null;
setTimeout(() => { try { s.destroy(); } catch {} }, 800);
}
_researchStartTime = 0;
_researchAvgDuration = null;
}
/** Append a "Generate Visual Report" button — delegates to chatRenderer. */
function _appendViewReportLink(msgEl, sessionId) {
const body = msgEl.querySelector('.body');
if (body) chatRenderer.appendReportButton(body, sessionId);
}
function _stripDocumentFenceForChat(text, { final = false } = {}) {
let s = String(text || '').replace(/?/g, '');
const markerMatch = /```(?:create_document|documen(?:t)?)\s*\n/i.exec(s);
if (!markerMatch) return s;
const before = s.slice(0, markerMatch.index).trimEnd();
const fenceStart = markerMatch.index;
const openingEnd = s.indexOf('\n', fenceStart);
const closeIdx = openingEnd >= 0 ? s.indexOf('\n```', openingEnd + 1) : -1;
const after = closeIdx >= 0 ? s.slice(closeIdx + 4).trimStart() : '';
const visible = [before, after].filter(Boolean).join('\n\n').trim();
return final && !visible ? 'Done.' : visible;
}
function _stripIncompleteRawToolJsonForChat(text) {
const s = String(text || '');
const starts = ['[{"function"', '[\n{"function"', '{"function"'];
let idx = -1;
for (const marker of starts) idx = Math.max(idx, s.lastIndexOf(marker));
if (idx < 0) return s;
const tail = s.slice(idx);
// Complete raw OpenAI-style function blobs are removed by stripToolBlocks.
// While the stream is still mid-JSON, hide the tail so it never flashes in
// the chat bubble as prose.
if (!/"type"\s*:\s*"function"/.test(tail) || !/\}\s*\]?\s*(?:<\/?\|(?:assistant|assistan|user|system|tool)\|>?)?\s*$/i.test(tail)) {
return s.slice(0, idx);
}
return s;
}
function _streamDisplayText(text, opts = {}) {
return stripToolBlocks(_stripIncompleteRawToolJsonForChat(_stripDocumentFenceForChat(text, opts)));
}
function _showDocumentWritingStatus(contentEl) {
const msg = contentEl && contentEl.closest ? contentEl.closest('.msg') : null;
const chatBox = document.getElementById('chat-history');
if (!msg || !chatBox) {
if (contentEl) contentEl.textContent = 'Writing...';
return;
}
let thread = msg._docWritingThread;
if (!thread || !thread.isConnected) {
thread = document.createElement('div');
thread.className = 'agent-thread streaming has-bottom';
thread.dataset.docWriting = '1';
const prev = msg.previousElementSibling;
if (prev && (prev.classList.contains('msg') || prev.classList.contains('agent-thread'))) {
thread.classList.add('has-top');
}
const node = document.createElement('div');
node.className = 'agent-thread-node running';
node.innerHTML = 'Writing▁▂▃
';
thread.appendChild(node);
chatBox.insertBefore(thread, msg);
msg._docWritingThread = thread;
const waveEl = node.querySelector('.agent-thread-wave');
if (waveEl) {
const waveFrames = ['▁▂▃', '▂▃▄', '▃▄▅', '▄▅▆', '▅▆▇', '▆▅▄', '▅▄▃', '▄▃▂'];
let waveIdx = 0;
node._waveInterval = setInterval(() => {
waveIdx = (waveIdx + 1) % waveFrames.length;
waveEl.textContent = waveFrames[waveIdx];
}, 100);
}
node._startTime = Date.now();
node._elapsedTicker = setInterval(() => {
const hdr = node.querySelector('.agent-thread-header');
if (!hdr) return;
let el = hdr.querySelector('.agent-thread-elapsed');
if (!el) {
el = document.createElement('span');
el.className = 'agent-thread-elapsed';
const icon = hdr.querySelector('.agent-thread-icon');
if (icon && icon.nextSibling) hdr.insertBefore(el, icon.nextSibling);
else hdr.appendChild(el);
}
const s = (Date.now() - node._startTime) / 1000;
el.textContent = s < 60 ? `${s.toFixed(2)}s` : `${Math.floor(s / 60)}m ${(s % 60).toFixed(2).padStart(5, '0')}s`;
}, 50);
}
msg.style.display = 'none';
}
function _finishDocumentWritingStatus(msg, ok = true) {
const thread = msg && msg._docWritingThread;
if (!thread || !thread.isConnected) return;
thread.classList.remove('streaming');
const node = thread.querySelector('.agent-thread-node');
if (!node) return;
if (node._waveInterval) { clearInterval(node._waveInterval); node._waveInterval = null; }
if (node._elapsedTicker) { clearInterval(node._elapsedTicker); node._elapsedTicker = null; }
node.classList.remove('running');
if (!ok) node.classList.add('error');
const icon = node.querySelector('.agent-thread-icon');
if (icon) icon.textContent = ok ? '✓' : '✗';
const wave = node.querySelector('.agent-thread-wave');
if (wave) wave.remove();
if (!node.querySelector('.agent-thread-status')) {
const status = document.createElement('span');
status.className = 'agent-thread-status';
status.textContent = ok ? 'done' : 'failed';
const header = node.querySelector('.agent-thread-header');
if (header) header.appendChild(status);
}
}
let currentAccumulated = ''; // Track accumulated text across function scope
let currentHolder = null; // Track current message holder
let currentSpinner = null; // Track current spinner for stop cleanup
// Background streaming support
const _backgroundStreams = new Map(); // sessionId -> { status, accumulated, sourcesHtml, abortCtrl, query, metrics }
const _activeStreams = new Map(); // sessionId -> { abortCtrl, holder, query, startedAt, cancelViewWork, finalizeView }
const _resumingStreams = new Set(); // sessionId -> a resumeStream() reader is live (re-attach lock)
const _terminalSavedStreams = new Set(); // sessionId -> canonical terminal event seen by active reader
const _streamRunIds = new Map(); // sessionId -> opaque identity of the current send's detached run
const _streamGenerations = new Map(); // sessionId -> generation of the current (latest) send
const _sendStates = new Map(); // sessionId -> { generation, abortCtrl } of the current send, installed synchronously at send commit so Stop never has to borrow an older send's controller
const _pendingRunStops = new Map(); // 'sessionId:generation' -> abortCtrl|null; Stop queued for that send while it awaits headers. Keyed per send so concurrent sends' cancellation intents never displace each other.
let _streamSessionId = null; // Session ID for the currently active reader loop
let _lastReaderActivity = 0; // Timestamp of last reader.read() success — used to detect frozen streams
let _webLockRelease = null; // Function to release the Web Lock held during streaming
let _staleStreamProbeInFlight = false;
const STALE_LOCAL_STREAM_MS = 15000;
/** Check if an SSE reader is still actively connected for a session. */
function hasActiveStream(sessionId) {
return _activeStreams.has(sessionId) || _streamSessionId === sessionId ||
_resumingStreams.has(sessionId);
}
function _getForegroundStreamState() {
try {
const sid = sessionModule && sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId();
return sid ? (_activeStreams.get(sid) || null) : null;
} catch (_) {
return null;
}
}
function _syncForegroundStreamGlobals() {
const active = _getForegroundStreamState();
isStreaming = !!active;
currentAbort = active ? active.abortCtrl : null;
currentHolder = active ? active.holder : null;
try {
const working = !!active || _activeStreams.size > 0 || _backgroundStreams.size > 0 || !!_sendInFlight;
document.body.classList.toggle('chat-agent-working', working);
const scrollBtn = document.getElementById('scroll-bottom-btn');
if (scrollBtn) scrollBtn.classList.toggle('agent-working', working);
window.dispatchEvent(new CustomEvent('odysseus-agent-working-change', { detail: { working } }));
} catch (_) {}
_setForegroundChatBusy(!!active || !!_sendInFlight);
return active;
}
function _touchStreamActivity(sessionId) {
const now = Date.now();
_lastReaderActivity = now;
const active = sessionId ? _activeStreams.get(sessionId) : null;
if (active) active.lastActivity = now;
return now;
}
/** Stable cost identity for one logical metrics segment within a run. */
function _metricsCostRecordId(runId, event) {
if (!runId) return '';
return `${runId}:${event && event.teacher ? 'teacher' : 'primary'}`;
}
/** POST the exact Stop for one observed run identity. */
function _postExactStop(sessionId, runId) {
fetch(`/api/chat/stop/${encodeURIComponent(sessionId)}`, {
method: 'POST',
credentials: 'same-origin',
headers: { 'X-Odysseus-Run-Id': runId },
}).catch(() => {});
}
/** Stop only the exact detached run whose identity this browser observed. */
function _stopExactRun(sessionId, abortCtrl = null) {
if (!sessionId) return false;
const runId = _streamRunIds.get(sessionId);
if (!runId) {
// Queue against the CURRENT send's generation: its POST is the only
// identity channel that can name the run, so the Stop fires from that
// send's own header arrival even if a replacement starts meanwhile.
const generation = _streamGenerations.get(sessionId) || 0;
const pendingKey = sessionId + ':' + generation;
if (abortCtrl || !_pendingRunStops.has(pendingKey)) {
_pendingRunStops.set(pendingKey, abortCtrl);
}
return false;
}
_postExactStop(sessionId, runId);
return true;
}
function _rememberStreamRunId(sessionId, runId, generation) {
if (!sessionId || !runId) return;
// A superseded send must not record its run id as the session's current
// identity, but it must still flush its own queued Stop: this is the only
// channel that can cancel that run when the replacement dies before its
// own POST reaches the server.
if (_streamGenerations.get(sessionId) === generation) {
_streamRunIds.set(sessionId, runId);
}
const pendingKey = sessionId + ':' + generation;
if (!_pendingRunStops.has(pendingKey)) return;
const pendingAbort = _pendingRunStops.get(pendingKey);
_pendingRunStops.delete(pendingKey);
_postExactStop(sessionId, runId);
if (pendingAbort && !pendingAbort.signal.aborted) {
pendingAbort._reason = 'user-stop';
pendingAbort.abort();
}
}
// Sources box builder and toggleSources are now in chatRenderer.js
var _buildSourcesBox = chatRenderer.buildSourcesBox;
// Browser notifications now in chatStream.js
var _notifyResearchComplete = chatStream.notifyResearchComplete;
// Model/image pricing, _buildImageBubble now in chatRenderer.js
var _buildImageBubble = chatRenderer.buildImageBubble;
var getModelCost = chatRenderer.getModelCost;
var getImageCost = chatRenderer.getImageCost;
function _appendGeneratedImageBubble(data, sessionId = null) {
const imageUrl = data?.image_url || data?.url || '';
if (!imageUrl) return false;
const targetSessionId = sessionId || data?.session_id || data?.sessionId || '';
if (
targetSessionId
&& sessionModule?.getCurrentSessionId
&& sessionModule.getCurrentSessionId() !== targetSessionId
) {
return false;
}
const chatBox = document.getElementById('chat-history');
if (!chatBox) return false;
const imageKey = String(data.image_id || imageUrl);
const exists = Array.from(chatBox.querySelectorAll('.generated-image-wrap')).some(el => (
el.dataset.imageKey === imageKey ||
el.dataset.imageUrl === imageUrl ||
el.querySelector('img.generated-image')?.getAttribute('src') === imageUrl
));
if (exists) return false;
const bubble = _buildImageBubble(
imageUrl,
data.image_prompt,
data.image_model,
data.image_size,
data.image_quality,
data.image_id
);
bubble.dataset.imageKey = imageKey;
bubble.dataset.imageUrl = imageUrl;
chatBox.appendChild(bubble);
uiModule.scrollHistory();
window.dispatchEvent(new CustomEvent('gallery-refresh'));
return true;
}
// stripToolBlocks and roleTimestamp now in chatRenderer.js
var stripToolBlocks = chatRenderer.stripToolBlocks;
function _normalizeEndpointForCompare(url) {
if (!url) return '';
try {
const u = new URL(String(url), window.location.origin);
let path = u.pathname.replace(/\/+$/, '');
const suffixes = [
'/v1/chat/completions', '/chat/completions',
'/v1/completions', '/completions',
'/v1/messages', '/messages',
'/v1/models', '/models',
];
for (const suffix of suffixes) {
if (path.toLowerCase().endsWith(suffix)) {
path = path.slice(0, -suffix.length).replace(/\/+$/, '');
break;
}
}
return (u.origin + path).toLowerCase();
} catch (_) {
return String(url).trim().replace(/\/+$/, '').toLowerCase();
}
}
async function _probeCurrentEndpointStatus(endpointUrl, signal) {
const target = _normalizeEndpointForCompare(endpointUrl);
if (!target) return null;
const modelsRes = await fetch(`${API_BASE}/api/models`, { credentials: 'same-origin', signal });
if (!modelsRes.ok) return null;
const modelsData = await modelsRes.json().catch(() => ({}));
const item = (modelsData.items || []).find(ep =>
_normalizeEndpointForCompare(ep.url || ep.endpoint_url || ep.base_url) === target
);
if (!item || !item.endpoint_id) return null;
const probesRes = await fetch(`${API_BASE}/api/model-endpoints/probe-local`, {
credentials: 'same-origin',
signal,
});
if (!probesRes.ok) return null;
const probes = await probesRes.json().catch(() => ({}));
return probes[item.endpoint_id] || null;
}
/**
* Initialize with dependencies
*/
export function init(apiBase) {
API_BASE = apiBase;
initSlashCommands({ apiBase, isStreaming: () => !!_getForegroundStreamState() });
// Initialize email inbox
emailInbox.init(documentModule);
// Wire the slash-command autocomplete popup on the chat composer. The
// dispatcher already handles the typed command — this just surfaces the
// registry as a discoverable menu when the user starts a message with /.
import('./slashAutocomplete.js').then(mod => {
const ta = document.getElementById('message');
if (ta && mod.initSlashAutocomplete) mod.initSlashAutocomplete(ta);
}).catch(() => {});
// ArrowUp on the composer recalls previous user prompts from this chat.
const _wireArrowUpRecall = (composer) =>
wireArrowUpRecall(composer, () => getUserMessagesFromChatHistory(), {
autoResize: uiModule?.autoResize,
});
const composer = document.getElementById('message');
if (!_wireArrowUpRecall(composer)) {
// Init can run before #message exists (templated UI); short retries only.
try { requestAnimationFrame(() => _wireArrowUpRecall(document.getElementById('message'))); } catch (_) {}
setTimeout(() => _wireArrowUpRecall(document.getElementById('message')), 250);
}
}
// addMessage, createMsgFooter, displayMetrics, hideWelcomeScreen, showWelcomeScreen
// are now in chatRenderer.js — referenced via the public API delegation above.
var addMessage = chatRenderer.addMessage;
var createMsgFooter = chatRenderer.createMsgFooter;
var displayMetrics = chatRenderer.displayMetrics;
var hideWelcomeScreen = chatRenderer.hideWelcomeScreen;
var showWelcomeScreen = chatRenderer.showWelcomeScreen;
/**
* Update submit button state
*/
function updateSubmitButton(state, submitBtn) {
if (!submitBtn) return;
if (state === 'streaming') {
// Clear any pending transitions from + → arrow swap
submitBtn.classList.remove('anim-spin', 'anim-spin-swap', 'anim-land', 'mic-mode', 'newchat-mode', 'newchat-expanded', 'recording');
// Ensure arrow icon is showing before launch
var icons = window._odysseusBtnIcons;
if (icons) submitBtn.innerHTML = icons.send;
void submitBtn.offsetWidth;
// Arrow launches up, then stop icon lands in
submitBtn.classList.add('anim-launch');
const _stopSvg = '';
// Wait for the launch keyframe to finish (0.3s) before swapping the
// arrow out for the stop icon — otherwise the swap happens mid-flight
// and the user sees nothing fly out.
setTimeout(() => {
if (submitBtn.dataset.mode !== 'streaming') return;
const msgInput = uiModule.el('message');
const hasQueuedText = !!(msgInput && msgInput.value && msgInput.value.trim());
submitBtn.innerHTML = hasQueuedText && icons ? icons.send : _stopSvg;
submitBtn.dataset.phase = hasQueuedText ? 'queue' : 'processing';
submitBtn.title = hasQueuedText ? 'Queue message' : 'Stop generation';
submitBtn.classList.remove('anim-launch');
void submitBtn.offsetWidth;
submitBtn.classList.add('anim-land');
submitBtn.addEventListener('animationend', () => submitBtn.classList.remove('anim-land'), { once: true });
}, 300);
submitBtn.title = 'Stop generation';
submitBtn.dataset.mode = 'streaming';
submitBtn.dataset.phase = 'processing';
isStreaming = true;
_setForegroundChatBusy(true);
_startStallWatchdog();
} else if (state === 'idle') {
submitBtn.dataset.mode = '';
delete submitBtn.dataset.phase;
submitBtn.classList.remove('recording');
isStreaming = false;
_setForegroundChatBusy(false);
_stopStallWatchdog();
// Defer to global updater which handles mic/newchat/send modes
if (window._updateSendBtnIcon) {
setTimeout(window._updateSendBtnIcon, 50);
} else {
var icons = window._odysseusBtnIcons;
submitBtn.innerHTML = icons ? icons.send : '';
submitBtn.title = 'Send message';
submitBtn.classList.remove('mic-mode', 'newchat-mode');
}
}
}
// -----------------------------------------------------------------------
// Slash commands — now in slashCommands.js
// -----------------------------------------------------------------------
// API key pattern for the guard in handleChatSubmit
const API_KEY_RE = /^(sk-[a-zA-Z0-9_\-]{20,}|gsk_[a-zA-Z0-9]{20,}|AIza[a-zA-Z0-9_\-]{30,}|xai-[a-zA-Z0-9]{20,})$/;
const PLAN_STORAGE_KEY = 'odysseus-active-plan';
const _queuedAgentRequests = [];
const QUEUED_AGENT_REQUESTS_KEY = 'odysseus-queued-agent-requests-v1';
let _queuedDrainTimer = null;
let _queuedPromoteTimer = null;
let _queuedRequestSeq = 0;
let _queuedBubbleHost = null;
let _pendingApprovedPlan = '';
function _queuedSessionId() {
try { return sessionModule?.getCurrentSessionId?.() || ''; } catch (_) { return ''; }
}
function _readPersistedQueuedRequests() {
try {
const value = JSON.parse(localStorage.getItem(QUEUED_AGENT_REQUESTS_KEY) || '{}');
return value && typeof value === 'object' ? value : {};
} catch (_) { return {}; }
}
function _persistQueuedRequests() {
const all = _readPersistedQueuedRequests();
const touched = new Set(_queuedAgentRequests.map(item => String(item.sessionId || '')).filter(Boolean));
const currentSid = _queuedSessionId();
if (currentSid) touched.add(currentSid);
for (const sid of touched) {
const rows = _queuedAgentRequests
.filter(item => item.sessionId === sid)
.map(({ id, message, createdAt }) => ({ id, message, createdAt }));
if (rows.length) all[sid] = rows;
else delete all[sid];
}
try { localStorage.setItem(QUEUED_AGENT_REQUESTS_KEY, JSON.stringify(all)); } catch (_) {}
}
function _restoreQueuedRequestsForCurrentSession() {
const sid = _queuedSessionId();
if (!sid || _queuedAgentRequests.some(item => item.sessionId === sid)) return;
const saved = _readPersistedQueuedRequests()[sid];
if (!Array.isArray(saved) || !saved.length) return;
for (const raw of saved) {
const message = String(raw?.message || '').trim();
if (!message) continue;
const item = {
id: String(raw?.id || `q${++_queuedRequestSeq}`),
message,
createdAt: Number(raw?.createdAt || Date.now()),
sessionId: sid,
el: null,
};
item.el = _createQueuedBubble(item);
_queuedAgentRequests.push(item);
}
_persistQueuedRequests();
}
function _extractPlanText(text) {
const raw = String(text || '').trim();
if (!raw) return '';
const stripped = raw
.replace(/Plan review
You Queued
${_escapeQueueText(item.message)}
`;
wrap.addEventListener('click', (ev) => {
if (ev.target && ev.target.closest && ev.target.closest('button, a, textarea, input')) return;
_promoteQueuedRequest(item.id);
});
host.appendChild(wrap);
uiModule.scrollHistory();
return wrap;
}
function _removeQueuedRequest(id) {
const idx = _queuedAgentRequests.findIndex(item => item.id === id);
if (idx < 0) return null;
const [item] = _queuedAgentRequests.splice(idx, 1);
if (item && item.el && item.el.parentNode) item.el.remove();
_persistQueuedRequests();
return item;
}
function _consumeQueuedRequestStack() {
const sid = _queuedSessionId();
const items = _queuedAgentRequests.filter(item => item.sessionId === sid);
if (!items.length) return null;
for (let i = _queuedAgentRequests.length - 1; i >= 0; i -= 1) {
if (_queuedAgentRequests[i].sessionId === sid) _queuedAgentRequests.splice(i, 1);
}
items.forEach(item => {
if (item && item.el && item.el.parentNode) item.el.remove();
});
if (_queuedBubbleHost && !_queuedBubbleHost.children.length) {
_queuedBubbleHost.remove();
_queuedBubbleHost = null;
}
_persistQueuedRequests();
return {
id: items.map(item => item.id).join(','),
message: items.map(item => String(item.message || '').trim()).filter(Boolean).join('\n\n'),
createdAt: items[0]?.createdAt || Date.now(),
};
}
function _setComposerAndSend(message) {
const input = uiModule.el('message');
if (!input) return false;
input.value = message;
input.dispatchEvent(new Event('input', { bubbles: true }));
if (uiModule.autoResize) uiModule.autoResize(input);
setTimeout(() => {
handleChatSubmit({ preventDefault() {} }).catch(err => {
console.error('queued send failed', err);
try { uiModule.showError && uiModule.showError('Queued send failed: ' + (err?.message || err)); } catch (_) {}
});
}, 0);
return true;
}
function _sendQueuedWhenIdle(item) {
if (!item) return;
const trySend = () => {
if (isStreaming || _sendInFlight) {
_queuedPromoteTimer = setTimeout(trySend, 220);
return;
}
_queuedPromoteTimer = null;
_setComposerAndSend(item.message);
};
if (_queuedPromoteTimer) clearTimeout(_queuedPromoteTimer);
_queuedPromoteTimer = setTimeout(trySend, 320);
}
function _promoteQueuedRequest(id) {
if (!_queuedAgentRequests.some(item => item.id === id)) return;
const item = _consumeQueuedRequestStack();
if (!item || !item.message) return;
if (!isStreaming && !_sendInFlight) {
_setComposerAndSend(item.message);
return;
}
try { uiModule.showToast && uiModule.showToast('Sending queued request now'); } catch (_) {}
const input = uiModule.el('message');
const submitBtn = document.querySelector('.send-btn');
if (input) {
input.value = '';
input.dispatchEvent(new Event('input', { bubbles: true }));
}
if (submitBtn) submitBtn.click();
_sendQueuedWhenIdle(item);
}
function _queueAgentRequest(message) {
const msg = String(message || '').trim();
if (!msg) return false;
const item = { id: `q${++_queuedRequestSeq}`, message: msg, createdAt: Date.now(), sessionId: _queuedSessionId(), el: null };
item.el = _createQueuedBubble(item);
_queuedAgentRequests.push(item);
_persistQueuedRequests();
try { uiModule.showToast && uiModule.showToast(_queuedAgentRequests.length === 1 ? 'Queued for after this response' : `${_queuedAgentRequests.length} requests queued`); } catch (_) {}
return true;
}
export function queueStreamingComposerRequest() {
if (!isStreaming) return false;
const queuedInput = uiModule.el('message');
const queuedText = (queuedInput && queuedInput.value || '').trim();
if (!queuedText) return false;
if (fileHandlerModule.getPendingCount && fileHandlerModule.getPendingCount()) {
try { uiModule.showError && uiModule.showError('Finish the current response before queueing messages with attachments.'); } catch (_) {}
return true;
}
if (_queueAgentRequest(queuedText)) {
queuedInput.value = '';
queuedInput.dispatchEvent(new Event('input', { bubbles: true }));
if (uiModule.autoResize) uiModule.autoResize(queuedInput);
try { window._updateSendBtnIcon && window._updateSendBtnIcon(); } catch (_) {}
}
return true;
}
function _drainQueuedAgentRequests() {
_restoreQueuedRequestsForCurrentSession();
const sid = _queuedSessionId();
if (isStreaming || _sendInFlight || !_queuedAgentRequests.some(item => item.sessionId === sid)) return;
if (_queuedDrainTimer) return;
_queuedDrainTimer = setTimeout(() => {
_queuedDrainTimer = null;
if (isStreaming || _sendInFlight || !_queuedAgentRequests.some(item => item.sessionId === _queuedSessionId())) return;
const next = _consumeQueuedRequestStack();
if (!next || !next.message) return;
_setComposerAndSend(next.message);
}, 180);
}
/**
* Handle chat form submission
*/
export async function handleChatSubmit(e) {
e.preventDefault();
// Cancel research clarification timeout if active
if (window._researchTimeoutTimer) {
clearTimeout(window._researchTimeoutTimer);
window._researchTimeoutTimer = null;
}
// Get current session
const sessionId = sessionModule.getCurrentSessionId();
const session = sessionModule.getSessions().find(s => s.id === sessionId);
const submitBtn = document.querySelector('.send-btn');
// If compare is active, stop all compare streams
if (window.compareModule && window.compareModule.isActive()) {
window.compareModule.handleCompareSubmit();
return;
}
// If currently streaming, keyboard Enter can queue a non-empty composer.
// Clicking the stop icon should still stop normally, even if text exists.
if (isStreaming) {
const queueRequestedAt = Number(window.__odysseusQueueStreamingSubmit || 0);
const shouldQueueStreamingSubmit = queueRequestedAt && Date.now() - queueRequestedAt < 1200;
window.__odysseusQueueStreamingSubmit = 0;
if (shouldQueueStreamingSubmit && queueStreamingComposerRequest()) {
return;
}
if (fileHandlerModule.isUploading && fileHandlerModule.isUploading()) {
fileHandlerModule.cancelUpload && fileHandlerModule.cancelUpload();
}
// Cancel server-side research if in progress
const _cancelSid = sessionModule.getCurrentSessionId();
if (_cancelSid && _researchingStreamIds.has(_cancelSid)) {
fetch(`${API_BASE}/api/research/cancel/${_cancelSid}`, { method: 'POST' }).catch(e => console.warn('Research cancel failed:', e));
_researchingStreamIds.delete(_cancelSid);
_clearResearchTimer();
}
abortCurrentRequest(true); // explicit user Stop → also cancel the detached server run
// Clean up any running agent thread nodes (stop wave animation, remove "running" state)
document.querySelectorAll('.agent-thread-node.running').forEach(node => {
if (node._waveInterval) { clearInterval(node._waveInterval); node._waveInterval = null; }
if (node._elapsedTicker) { clearInterval(node._elapsedTicker); node._elapsedTicker = null; }
node.classList.remove('running');
const wave = node.querySelector('.agent-thread-wave');
if (wave) wave.textContent = '';
const icon = node.querySelector('.agent-thread-icon');
if (icon) icon.textContent = '\u25A0'; // stop square
const statusEl = node.querySelector('.agent-thread-status');
if (!statusEl) {
const header = node.querySelector('.agent-thread-header');
if (header) {
const s = document.createElement('span');
s.className = 'agent-thread-status';
s.textContent = 'stopped';
header.appendChild(s);
}
}
});
document.querySelectorAll('.agent-thread.streaming').forEach(t => t.classList.remove('streaming'));
// Clean up any thinking spinners
document.querySelectorAll('.agent-thinking-dots').forEach(el => {
if (el._spinner) el._spinner.destroy();
el.remove();
});
// No text accumulated — remove the empty holder with spinner
if (currentHolder && !currentAccumulated) {
if (currentSpinner) { currentSpinner.destroy(); currentSpinner = null; }
// Empty cancel — keep the assistant bubble around with a "Cancelled
// by user" indicator and persist a placeholder server-side so the
// turn survives a refresh instead of vanishing without a trace.
_renderCancelledBubble(currentHolder);
currentHolder = null;
updateSubmitButton('idle', submitBtn);
const messageInput = uiModule.el('message');
if (messageInput) messageInput.disabled = false;
currentAccumulated = '';
_drainQueuedAgentRequests();
return;
}
// Render whatever was accumulated so far
if (currentHolder && currentAccumulated) {
const _activeStopStream = _getForegroundStreamState();
const _terminalView = _activeStopStream?.finalizeView?.() || null;
const _stoppedViewHolder = _terminalView?.holder || currentHolder;
const _viewPreparedByStream = !!_terminalView;
// The stream finalizer may close a synthetic reasoning tag. Capture the
// durable raw value only after that canonical terminal preparation.
const stoppedContent = _terminalView?.raw || currentAccumulated;
_stoppedViewHolder.dataset.raw = stoppedContent;
if (!_viewPreparedByStream) {
_stoppedViewHolder.querySelector('.body').innerHTML = markdownModule.processWithThinking(
markdownModule.squashOutsideCode(stoppedContent)
);
}
// Highlight code blocks
if (window.hljs) {
_stoppedViewHolder.querySelectorAll('pre code').forEach((block) => {
window.hljs.highlightElement(block);
});
}
// Add the stopped indicator with continue button
const stoppedIndicator = document.createElement('div');
stoppedIndicator.className = 'stopped-indicator';
const stoppedLabel = document.createElement('span');
stoppedLabel.textContent = '[Message interrupted]';
stoppedIndicator.appendChild(stoppedLabel);
const continueBtn = document.createElement('button');
continueBtn.className = 'continue-btn resume-btn';
continueBtn.title = 'Resume response';
continueBtn.innerHTML = 'Resume';
const _stoppedHolder = _stoppedViewHolder; // capture before globals are cleared
continueBtn.addEventListener('click', () => {
stoppedIndicator.remove();
_hideUserBubble = true;
_pendingContinue = _stoppedHolder;
const msgInput = uiModule.el('message');
if (msgInput) {
msgInput.value = 'Continue from where you left off.';
const sb = document.querySelector('.send-btn');
if (sb) sb.click();
}
});
stoppedIndicator.appendChild(continueBtn);
_stoppedViewHolder.querySelector('.body').appendChild(stoppedIndicator);
// Tell server to mark this message as stopped
const _sid = sessionModule.getCurrentSessionId();
if (_sid) fetch(`${API_BASE}/api/session/${_sid}/mark-stopped`, { method: 'POST' }).catch(e => console.warn('mark-stopped failed:', e));
// Add footer with copy/regen if not already present
if (!_stoppedViewHolder.querySelector('.msg-footer')) {
_stoppedViewHolder.dataset.raw = stoppedContent;
_stoppedViewHolder.appendChild(createMsgFooter(_stoppedViewHolder));
}
uiModule.scrollHistory();
}
// Reset button state
updateSubmitButton('idle', submitBtn);
// Re-enable message input
const messageInput = uiModule.el('message');
if (messageInput) messageInput.disabled = false;
// Clear tracking variables
currentAccumulated = '';
currentHolder = null;
return;
}
// --- Send-path entry: block re-clicks between submit and stream start ---
if (_sendInFlight) return;
const _sendPerf = _createChatSendPerf();
const _ttftStartedAt = performance.now();
_sendInFlight = true;
const approvalForSend = _pendingToolApproval;
_setForegroundChatBusy(true);
// Instant visual feedback so the user sees their click was accepted
// even before the streaming button state kicks in below.
const _earlyMessageInput = uiModule.el('message');
if (_earlyMessageInput) _earlyMessageInput.disabled = true;
if (submitBtn) submitBtn.classList.add('send-pending');
const _releaseSendFlag = () => {
_sendInFlight = false;
_syncForegroundStreamGlobals();
if (_earlyMessageInput) _earlyMessageInput.disabled = false;
if (submitBtn) submitBtn.classList.remove('send-pending');
};
// --- Setup mode: intercept next message (but let slash commands through) ---
if (!approvalForSend) {
const el = uiModule.el;
const rawMsg = (el('message').value || '').trim();
const currentSetupMode = slashCommands.getSetupMode();
if (currentSetupMode && rawMsg && !isCommand(rawMsg)) {
const mode = currentSetupMode;
slashCommands.clearSetupMode(mode === 'endpoint-provider' || mode === 'endpoint-key-for-provider');
el('message').value = '';
if (window._syncModelPickerAutohide) window._syncModelPickerAutohide();
if (uiModule.autoResize) uiModule.autoResize(el('message'));
if (mode === true || mode === 'endpoint') {
handleSetupInput(rawMsg);
} else {
handleSetupWizard(mode, rawMsg);
}
_releaseSendFlag();
return;
}
if (currentSetupMode && rawMsg && isCommand(rawMsg)) {
slashCommands.clearSetupMode(); // Clear setup mode, fall through to slash handler
}
}
const el = uiModule.el;
const msg = approvalForSend ? '' : el('message').value;
// Allow empty text when a regen carries over the original message's
// attachment ids — a photo-only message still has something to send.
if (!msg.trim() && !approvalForSend && !fileHandlerModule.getPendingCount() && !(_pendingRegenAttachments && _pendingRegenAttachments.length)) { _releaseSendFlag(); return; }
// --- Slash commands: execute directly without AI (no session needed) ---
if (!approvalForSend && isCommand(msg.trim())) {
const handled = await handleSlashCommand(msg.trim());
if (handled) {
el('message').value = '';
if (window._syncModelPickerAutohide) window._syncModelPickerAutohide();
if (uiModule.autoResize) uiModule.autoResize(el('message'));
_releaseSendFlag();
return;
}
}
const incognitoChkForSend = el('incognito-toggle');
const isIncognitoForSend = !!(incognitoChkForSend && incognitoChkForSend.checked);
if (!isIncognitoForSend) {
await _adoptOpenedSessionBeforeAutoCreate();
}
const selectedRouteForSend = (() => {
try {
const lastPicked = window.__odysseusLastPickedRoute || null;
if (lastPicked && lastPicked.model
&& (lastPicked.session_id || null) === (sessionModule.getCurrentSessionId?.() || null)
&& Date.now() - (lastPicked.picked_at || 0) < 10 * 60 * 1000) {
return {
model: lastPicked.model || '',
endpoint_url: lastPicked.endpoint_url || '',
endpoint_id: lastPicked.endpoint_id || '',
source: 'last-picked',
};
}
const pending = sessionModule.getPendingChat && sessionModule.getPendingChat();
if (pending && pending.modelId) {
return {
model: pending.modelId || '',
endpoint_url: pending.url || '',
endpoint_id: pending.endpointId || '',
source: pending.source || '',
};
}
return {
model: sessionModule.getCurrentModel ? (sessionModule.getCurrentModel() || '') : '',
endpoint_url: sessionModule.getCurrentEndpointUrl ? (sessionModule.getCurrentEndpointUrl() || '') : '',
endpoint_id: '',
source: '',
};
} catch (_) {
return { model: '', endpoint_url: '', endpoint_id: '', source: '' };
}
})();
// Materialize pending session (deferred from model click) on first message
if (sessionModule.hasPendingChat && sessionModule.hasPendingChat()) {
_sendPerf.mark('pending_session_begin');
const ok = await sessionModule.materializePendingSession();
_sendPerf.mark('pending_session_done');
if (!ok || !sessionModule.getCurrentSessionId()) { _releaseSendFlag(); return; }
}
if (!sessionModule.getCurrentSessionId()) {
// Auto-create a session using default chat config. Always fetch fresh
// so that a recent Settings change takes effect without a page reload.
try {
const pending = sessionModule.getPendingChat && sessionModule.getPendingChat();
if (pending && pending.url && pending.modelId) {
const ok = await sessionModule.materializePendingSession();
if (!ok || !sessionModule.getCurrentSessionId()) { _releaseSendFlag(); return; }
}
} catch (_) {}
}
if (!sessionModule.getCurrentSessionId()) {
// Auto-create a session using default chat config. Always fetch fresh
// so that a recent Settings change takes effect without a page reload.
try {
let dc = (typeof window !== 'undefined' && window.__odysseusDefaultChat) || null;
if (!dc || !dc.endpoint_url || !dc.model) {
try {
dc = JSON.parse(localStorage.getItem('odysseus-default-chat-cache') || 'null');
} catch (_) {}
}
try {
if (!dc || !dc.endpoint_url || !dc.model) {
_sendPerf.mark('default_chat_fetch_begin');
const dcRes = await fetch('/api/default-chat');
dc = await dcRes.json();
_sendPerf.mark('default_chat_fetch_done');
if (dc && dc.endpoint_url && dc.model) {
try {
window.__odysseusDefaultChat = dc;
localStorage.setItem('odysseus-default-chat-cache', JSON.stringify(dc));
} catch (_) {}
}
}
} catch (_) {
dc = (typeof window !== 'undefined' && window.__odysseusDefaultChat) || null;
}
if (dc.endpoint_url && dc.model) {
_sendPerf.mark('direct_chat_create_begin');
await sessionModule.createDirectChat(dc.endpoint_url, dc.model, dc.endpoint_id, { source: 'default' });
_sendPerf.mark('direct_chat_create_done');
const ok = await sessionModule.materializePendingSession();
_sendPerf.mark('direct_chat_materialize_done');
if (!ok || !sessionModule.getCurrentSessionId()) { _releaseSendFlag(); return; }
} else {
el('message').value = '';
if (uiModule.autoResize) uiModule.autoResize(el('message'));
addMessage('assistant',
'No chat session active. You can:\n\n' +
'- Open the model picker in the chat box and pick a model\n' +
'- Use the `+` button in the model picker to add a model endpoint\n' +
'- Use `/help` to see all available commands');
_releaseSendFlag();
return;
}
} catch (e) {
el('message').value = '';
if (uiModule.autoResize) uiModule.autoResize(el('message'));
addMessage('assistant',
'No chat session active. You can:\n\n' +
'- Open the model picker in the chat box and pick a model\n' +
'- Use the `+` button in the model picker to add a model endpoint\n' +
'- Use `/help` to see all available commands');
_releaseSendFlag();
return;
}
}
// --- API key guard: warn if message looks like an API key ---
if (!approvalForSend && API_KEY_RE.test(msg.trim())) {
if (!await window.styledConfirm('This looks like an API key. Sending it to the AI could expose it.\n\nDid you mean to use /setup instead?', { confirmText: 'Send anyway', danger: true })) {
_releaseSendFlag();
return;
}
}
const messageInput = el('message');
const originalBtnText = submitBtn ? submitBtn.innerHTML : '';
// Re-enable the textarea now that we've handed off to the stream: the
// user wants to compose the next message while the AI is still talking.
// The `isStreaming` flag is the re-click guard for the send button.
if (messageInput) messageInput.disabled = false;
updateSubmitButton('streaming', submitBtn);
if (submitBtn) submitBtn.classList.remove('send-pending');
// Per-send generation, reserved SYNCHRONOUSLY before the send gate clears
// and before the first await: from this instant the superseded send may
// not clean session state, register, or POST (each checked at its own
// await boundaries). Session-keyed state (run id, queued Stop, cleanup
// rights) belongs to the latest generation only. A queued Stop from the
// superseded send is deliberately left in place, tagged with ITS
// generation: that send's still-alive POST is the only identity channel
// able to name its run, so the Stop fires from its own header arrival
// (see _rememberStreamRunId) even if this replacement dies before fetch.
const streamSessionId = sessionModule.getCurrentSessionId();
const streamGeneration = (_streamGenerations.get(streamSessionId) || 0) + 1;
_streamGenerations.set(streamSessionId, streamGeneration);
const _sendState = { generation: streamGeneration, abortCtrl: null };
_sendStates.set(streamSessionId, _sendState);
// The previous send's run identity dies with its ownership: a Stop after
// this instant must queue for THIS send, not fire against the old run.
// (The old send's own queued Stop still works — its flush carries the run
// id from its header, and its stale generation cannot repopulate this map.)
_streamRunIds.delete(streamSessionId);
_streamSessionId = streamSessionId;
_sendInFlight = false;
try {
const pendingSwitch = window.__odysseusModelSwitchPromise;
if (pendingSwitch && typeof pendingSwitch.then === 'function') {
await pendingSwitch;
}
} catch (_) {}
// Superseded while awaiting the model switch: the replacement owns the
// session now, and everything below (state resets, registration, POST)
// is its business alone.
if (_streamGenerations.get(streamSessionId) !== streamGeneration) return;
_terminalSavedStreams.delete(streamSessionId);
const streamQuery = msg;
_touchStreamActivity(streamSessionId);
// Acquire Web Lock to hint browser not to discard this tab while streaming
if (navigator.locks) {
navigator.locks.request('odysseus-stream-' + streamSessionId, { mode: 'exclusive', ifAvailable: true }, lock => {
if (!lock) return; // Another stream already holds a lock — fine
return new Promise(resolve => { _webLockRelease = resolve; });
}).catch(e => console.warn('web lock acquire failed:', e)); // Ignore lock errors — best-effort
}
// Declare accumulated outside try block so it's accessible in catch
let accumulated = '';
// Are we currently inside an unclosed Query: "${msg.substring(0, 50)}${msg.length > 50 ? '...' : ''}"
Fetching top results...`; } else if (el('research-toggle').checked) { loadingText = 'Deep research mode active...'; } else { loadingText = 'Processing request...'; } var roleLabel = _modelRouteLabel(modelName, modelName); var _charNameInit = presetsModule.getCharacterName ? presetsModule.getCharacterName() : ''; if (_charNameInit) roleLabel = _charNameInit; const roleTs = new Date().toLocaleTimeString([], {hour: '2-digit', minute:'2-digit'}); holder.innerHTML = `
${uiModule.esc(roleLabel)}
`;
holder._requestedModel = modelName;
holder._actualModel = modelName;
_applyModelColor(holder.querySelector('.role'), modelName);
holder.style.position = 'relative';
// Create spinner
spinner = spinnerModule.create('Initializing', 'right', 'wave');
currentSpinner = spinner;
const bodyDiv = holder.querySelector('.body');
bodyDiv.appendChild(spinner.createElement());
spinner.start();
// Update spinner message based on mode
if (el('web-toggle').checked && !_isAgent) {
spinner.updateMessage('Searching web with ' + (searchModule ? searchModule.getProviderLabel() : 'SearXNG'));
setTimeout(() => spinner.updateMessage('Processing results'), 1500);
} else if (el('research-toggle').checked) {
spinner.updateMessage('Researching');
setTimeout(() => spinner.updateMessage('Analyzing sources'), 1500);
} else {
_startTtftDisplay();
}
const researchBtn = el('research-toggle-btn');
if (el('research-toggle').checked && researchBtn) {
researchBtn.disabled = true;
researchBtn.classList.remove('active');
}
box.appendChild(holder);
uiModule.scrollHistory();
const enableResearchBtn = () => {
if (!researchBtn) return;
researchBtn.disabled = false;
researchBtn.classList.toggle('active', el('research-toggle').checked);
};
if (el('research-toggle').checked && researchBtn) {
researchBtn.style.display = 'none';
// Uncheck research toggle so follow-up messages don't trigger another research
el('research-toggle').checked = false;
}
// User's current UTC offset in minutes (east of UTC). Threaded into
// the agent so natural-language times like "today at 9pm" are
// interpreted in YOUR timezone, not the server's.
const _tzOffsetMin = -new Date().getTimezoneOffset();
const _tzName = (() => {
try { return Intl.DateTimeFormat().resolvedOptions().timeZone || ''; }
catch { return ''; }
})();
_sendPerf.mark('chat_stream_post_begin');
const res = await fetch(`${API_BASE}/api/chat_stream`, {
method: 'POST',
body: fd,
headers: { 'X-Tz-Offset': String(_tzOffsetMin), 'X-Tz-Name': _tzName },
signal: abortCtrl.signal
});
_sendPerf.mark('chat_stream_headers');
_sendPerf.report('headers_received');
if (!res.ok) {
clearResponseTimeout();
if (res.status === 404) {
// Session was deleted (e.g. by AI) — reload and go to welcome
holder.remove();
if (sessionModule) await sessionModule.loadSessions();
return;
}
let errText = `Error ${res.status}`;
try {
const errBody = await res.text();
// Parse nested JSON error if present
const m = errBody.match(/"message"\s*:\s*"([^"]+)"/);
if (m) errText = m[1].replace(/\\"/g, '"');
else if (errBody.length < 200) errText = errBody;
} catch {}
// Auto-switch to chat mode for tool-related errors
if (errText.includes('tool') || errText.includes('auto')) {
errText = 'This model doesn\'t support agent tools — switched to Chat mode. Try again.';
const _ab = document.getElementById('mode-agent-btn');
const _cb = document.getElementById('mode-chat-btn');
if (_ab && _cb) {
_ab.classList.remove('active');
_cb.classList.add('active');
const _toggle = _ab.closest('.mode-toggle');
if (_toggle) _toggle.classList.add('mode-chat');
}
if (typeof Storage !== 'undefined' && Storage.KEYS) {
const _st = Storage.getJSON(Storage.KEYS.TOGGLES, {});
_st.mode = 'chat';
Storage.setJSON(Storage.KEYS.TOGGLES, _st);
}
}
typewriterInto(holder.querySelector('.body'), errText);
enableResearchBtn();
return;
}
const streamRunId = res.headers.get('X-Odysseus-Run-Id') || '';
if (streamRunId) _rememberStreamRunId(streamSessionId, streamRunId, streamGeneration);
// Mark the chat log busy while streaming so screen readers wait for the
// settled response instead of announcing every token. Cleared in finally.
const _chatLog = document.getElementById('chat-history');
if (_chatLog) _chatLog.setAttribute('aria-busy', 'true');
const reader = res.body.getReader();
_sendPerf.mark('reader_ready');
_sendPerf.report('reader_ready');
const decoder = new TextDecoder();
let buffer = '';
let metrics = null;
let isThinking = false;
let thinkingStartTime = null;
// Streaming TTS: synthesize sentence-by-sentence during streaming
streamingTTS = !!(window.aiTTSManager && window.aiTTSManager.autoPlay && window.aiTTSManager.available);
if (streamingTTS) window.aiTTSManager.streamingStart();
// Multi-bubble agent tracking
let roundHolder = holder; // Current AI text bubble (changes per round)
let roundText = ''; // Text accumulated for current round
let roundReplyText = null; // Reply-only text after a thinking transition
let currentToolBubble = null; // Current tool execution bubble
let lastToolThread = null; // Visible tool timeline for tool-only turns
let finishEditorButton = null;
const clearFinishEditorButton = () => {
finishEditorButton?.remove();
finishEditorButton = null;
};
const offerFinishEditorTurn = () => {
if (finishEditorButton || !lastToolThread || !_streamRunIds.get(streamSessionId)) return;
const button = document.createElement('button');
button.type = 'button';
button.className = 'continue-btn resume-btn agent-finish-editor';
button.textContent = 'Finish with these';
button.title = 'Stop generating after the completed document work; keep the saved edits and suggestions';
button.addEventListener('click', async () => {
const runId = _streamRunIds.get(streamSessionId);
if (!runId) return;
button.disabled = true;
button.textContent = 'Finishing…';
try {
const response = await fetch(`${API_BASE}/api/chat/finish/${encodeURIComponent(streamSessionId)}`, {
method: 'POST', credentials: 'same-origin',
headers: { 'X-Odysseus-Run-Id': runId },
});
const result = await response.json();
if (!response.ok || !result.accepted) throw new Error('The run has already finished or changed');
} catch (error) {
button.disabled = false;
button.textContent = 'Finish with these';
uiModule?.showError?.(error.message || 'Could not finish this run');
}
});
lastToolThread.appendChild(button);
finishEditorButton = button;
};
let roundFinalized = false; // Whether current round's text is finalized
let terminalFinalResponseRendered = false; // final_response already rendered the canonical bubble
let roundFinalization = null; // Terminal owner/result for the current round
let lastContentRoundHolder = null; // Last non-empty round for an empty continuation Stop
let _sourcesHtml = ''; // Sources box HTML to prepend to body
let _sourcesExpanded = false; // Track if user expanded sources during stream
let _sourcesData = null; // Raw sources data for rebuilding
let _sourcesType = ''; // 'web' or 'research'
let _findingsData = null; // Raw findings data for collapsible box
const _generatedImagesForTurn = [];
function _rememberGeneratedImage(data) {
const imageUrl = data?.image_url || data?.url || '';
if (!imageUrl) return;
const imageKey = String(data.image_id || imageUrl);
if (_generatedImagesForTurn.some(x => String(x.image_id || x.image_url || x.url) === imageKey || x.image_url === imageUrl || x.url === imageUrl)) return;
_generatedImagesForTurn.push({ ...data, image_url: imageUrl, url: imageUrl });
}
// _keepResearchOn removed — clarification state now persisted server-side via DB mode
function _metricsTargetForTurn() {
const visibleRound = (roundHolder && roundHolder.style.display !== 'none') ? roundHolder : null;
const visibleText = visibleRound ? (visibleRound.querySelector('.body')?.textContent || '').trim() : '';
if (lastToolThread && lastToolThread.isConnected && (!visibleRound || !visibleText || visibleText === 'Done.')) {
return lastToolThread;
}
return visibleRound || holder;
}
let _savedAssistantMessageId = '';
const _turnRendering = createTurnRendering({ root: box, start: _streamTurnMarker });
_settleTurnRendering = () => _turnRendering.settle();
function _terminalAnswerHtml(text, body) {
const expanded = _sourcesExpanded || !!body?.querySelector('.sources-content.expanded');
return (_sourcesData ? _buildSourcesBox(_sourcesData, _sourcesType, expanded) : '')
+ markdownModule.processWithThinking(markdownModule.squashOutsideCode(markdownModule.normalizeThinkingMarkup(_streamDisplayText(text, { final: _docFenceOpened }))))
+ (_findingsData ? chatRenderer.buildFindingsBox(_findingsData) : '');
}
function _renderTerminalAnswer(text, messageId = '', renderOwner, replacementScope) {
if (renderOwner && !_turnRendering.accepts({ type: 'final_response', render_owner: renderOwner, replacement_scope: replacementScope })) return false;
_ensureVisibleRoundForDelta();
const body = roundHolder?.querySelector('.body');
if (!body) return false;
const result = _turnRendering.render({
body, html: _terminalAnswerHtml(text, body), raw: text, messageId, render_owner: renderOwner, replacement_scope: replacementScope,
});
if (result.changed && window.hljs) body.querySelectorAll('pre code').forEach(block => window.hljs.highlightElement(block));
if (result.accepted) _turnRendering.settle();
return result.accepted;
}
async function _replaceLiveTurnWithSavedAssistantMessage(_attempt = 0) {
if (!streamSessionId || !_savedAssistantMessageId) return false;
const isCurrent = () => (
sessionModule.getCurrentSessionId() === streamSessionId
&& _streamGenerations.get(streamSessionId) === streamGeneration
&& _streamTurnMarker?.parentNode === box
);
if (!isCurrent()) return false;
try {
const res = await fetch(`${API_BASE}/api/history/${encodeURIComponent(streamSessionId)}?limit=12`, {
credentials: 'same-origin',
});
if (!res.ok || !isCurrent()) return false;
const data = await res.json();
if (!isCurrent()) return false;
const saved = (Array.isArray(data.history) ? data.history : []).find(msg => (
msg?.role === 'assistant'
&& String(msg.metadata?._db_id || '') === _savedAssistantMessageId
));
if (!saved && _attempt < 4) {
await new Promise(resolve => setTimeout(resolve, 100 * (_attempt + 1)));
return _replaceLiveTurnWithSavedAssistantMessage(_attempt + 1);
}
if (!saved || !String(saved.content || '').trim()) return false;
const scrollSnapshot = uiModule.captureHistoryScroll?.();
const rendered = _renderTerminalAnswer(saved.content, _savedAssistantMessageId, saved.metadata?.render_owner, saved.metadata?.replacement_scope);
uiModule.restoreHistoryScroll?.(scrollSnapshot);
if (rendered) _streamTurnMarker.remove();
return rendered;
} catch (err) {
console.warn('Failed to reconcile saved assistant answer:', err);
return false;
}
}
// Insert sources box as a stable DOM node that won't be replaced during streaming.
// Returns the content container to use for innerHTML updates.
function _ensureStreamLayout(body) {
if (!body) return body;
// Sources are deferred to final render — don't insert during streaming
// Ensure a stable content div exists for text content
var contentDiv = body.querySelector('.stream-content');
if (!contentDiv) {
contentDiv = document.createElement('div');
contentDiv.className = 'stream-content';
body.appendChild(contentDiv);
}
return contentDiv;
}
function _ensureVisibleRoundForDelta() {
if (!roundHolder || roundHolder.style.display !== 'none') return;
if (sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId() !== streamSessionId) return;
const box = document.getElementById('chat-history');
if (!box) {
roundHolder.style.display = '';
return;
}
const newWrap = document.createElement('div');
newWrap.className = 'msg msg-ai msg-continuation streaming';
const newRole = document.createElement('div');
newRole.className = 'role';
const metaS = sessionModule.getSessions().find(s => s.id === streamSessionId);
inheritModelRouteState(holder, roundHolder, newWrap, metaS?.model || modelName);
const requested = newWrap._requestedModel;
const actual = newWrap._actualModel;
newRole.textContent = _modelRouteLabel(
requested,
actual,
newWrap._requestedEndpointLabel,
newWrap._actualEndpointLabel,
newWrap._requestedEndpointId,
newWrap._actualEndpointId,
) || '';
_applyModelColor(newRole, actual);
newWrap.appendChild(newRole);
const newBody = document.createElement('div');
newBody.className = 'body';
newWrap.appendChild(newBody);
box.appendChild(newWrap);
if (lastToolThread && lastToolThread.isConnected) lastToolThread.classList.add('has-bottom');
roundHolder = newWrap;
roundText = '';
roundReplyText = null;
roundFinalized = false;
terminalFinalResponseRendered = false;
roundFinalization = null;
isThinking = false;
_thinkingMode = null;
_cancelThinkingGrace();
_thinkingAnalysisGate.reset();
_roundDisplayProjector.reset();
_replyDisplayProjector.reset();
_docFenceOpened = false;
}
const esc = uiModule.esc;
// Remove thinking spinner helper
let _thinkingSpinnerEl = null;
_removeThinkingSpinner = () => {
const el = _thinkingSpinnerEl;
if (el) {
if (el._spinner) el._spinner.destroy();
el.remove();
}
_thinkingSpinnerEl = null;
};
// Tool-aware thinking spinner
let _lastToolName = '';
const _searchIcon = '';
const _toolLabels = {
'web_search': 'Searching',
'bash': 'Running',
'python': 'Running',
'read_document': 'Reading',
'edit_file': 'Editing',
'read_file': 'Reading',
'write_file': 'Writing',
'create_document': 'Writing',
'edit_document': 'Editing',
'update_document': 'Rewriting',
'suggest_document': 'Reviewing',
'list_files': 'Browsing',
'image_gen': 'Generating',
'generate_image': 'Generating',
'manage_memory': 'Remembering',
'save_memory': 'Remembering',
'search_memory': 'Recalling',
'manage_session': 'Organizing',
'deep_research': 'Researching',
'list_models': 'Browsing',
'ui_control': 'Adjusting',
'mcp__email__list_emails': 'Checking email',
'mcp__email__read_email': 'Reading email',
'mcp__email__search_emails': 'Searching email',
'list_emails': 'Checking email',
'read_email': 'Reading email',
'search_emails': 'Searching email',
};
const _toolIcons = {
'web_search': _searchIcon,
'web_fetch': _searchIcon,
};
function _safeExternalToolUrl(raw) {
const value = String(raw || '').trim();
if (!value) return '';
try {
const parsed = new URL(value.includes('://') ? value : `https://${value}`);
if (parsed.protocol === 'http:' || parsed.protocol === 'https:') return parsed.href;
} catch (_) {}
return '';
}
function _webFetchUrlFromCommand(command) {
const raw = String(command || '').trim();
if (!raw) return '';
try {
const args = JSON.parse(raw);
return _safeExternalToolUrl(args && args.url);
} catch (_) {
return _safeExternalToolUrl(raw.split(/\s+/)[0]);
}
}
function _webSearchQueryFromCommand(command) {
const raw = String(command || '').trim();
if (!raw) return '';
try {
const args = JSON.parse(raw);
if (args && typeof args.query === 'string') return args.query.trim();
if (args && Array.isArray(args.queries) && args.queries.length) return String(args.queries[0] || '').trim();
} catch (_) {}
return raw;
}
function _searxngSearchUrl(query) {
const q = String(query || '').trim();
if (!q) return '';
try {
const url = new URL('/search/web', window.location.origin);
url.search = '';
url.hash = '';
url.searchParams.set('q', q);
return url.href;
} catch (_) {
return '';
}
}
function _toolHeaderLinkHtml(url, title = 'Open link') {
const href = _safeExternalToolUrl(url);
if (!href) return '';
return ``;
}
function _toolHeaderHashLinkHtml(hash, title = 'Open item', iconHtml = '', className = '') {
const href = String(hash || '').trim();
if (!/^#(?:event|note|email|document|task|research|skill)-[A-Za-z0-9_.:-]+$/.test(href)) return '';
const cls = `agent-thread-header-link${className ? ' ' + className : ''}`;
return `${iconHtml || ''}`;
}
function _calendarEventUidFromToolData(command, data) {
const direct = String((data && data.uid) || '').trim();
if (direct) return direct;
const events = data && Array.isArray(data.events) ? data.events : [];
if (events.length === 1 && events[0] && events[0].uid) return String(events[0].uid).trim();
const text = `${command || ''}\n${(data && data.output) || ''}\n${(data && data.anchor) || ''}`;
const match = text.match(/#event-([A-Za-z0-9_.:-]+)/);
return match ? match[1] : '';
}
function _emailToolHash(args = {}, data = null) {
const uid = String((data && data.uid) || args.uid || '').trim();
if (!/^\d+$/.test(uid)) return '';
const folder = String((data && data.folder) || args.folder || 'INBOX').trim() || 'INBOX';
const account = String((data && (data.account_id || data.account)) || args.account_id || args.account || '').trim();
const clean = value => String(value || '').replace(/[^A-Za-z0-9_.@-]/g, '_');
return `#email-${[clean(folder), uid, clean(account)].filter(Boolean).join(':')}`;
}
function _toolDisplayInfo(tool, command, data = null) {
const rawTool = String(tool || '');
const lower = rawTool.toLowerCase();
let args = null;
try { args = JSON.parse(command || '{}'); } catch (_) {}
if (lower === 'web_search' || lower.endsWith('web_search') || lower.includes('__web_search')) {
const q = _webSearchQueryFromCommand(command);
return {
label: '',
commandHtml: q
? `${uiModule.esc(q)}`
: '',
};
}
if (lower === 'web_fetch' || lower.endsWith('web_fetch') || lower.includes('__web_fetch')) {
const url = _webFetchUrlFromCommand(command);
return {
label: '',
headerActionHtml: _toolHeaderLinkHtml(url, 'Open fetched page'),
commandHtml: url
? `${uiModule.esc(url)}`
: '',
};
}
if (lower === 'manage_calendar' || lower.endsWith('manage_calendar')) {
const action = args && args.action ? String(args.action).toLowerCase() : '';
const summary = args && args.summary ? String(args.summary) : '';
const start = args && args.start ? String(args.start).slice(0, 10) : '';
const end = args && args.end ? String(args.end).slice(0, 10) : '';
const uid = _calendarEventUidFromToolData(command, data || {});
const actionLabel = action.includes('create') ? 'Create event'
: action.includes('update') ? 'Update event'
: action.includes('delete') ? 'Delete event'
: 'Check calendar';
const rangeSummary = start && end ? `${start} to ${end}` : '';
return {
label: actionLabel,
// The calendar glyph is rendered as the action link itself.
headerActionHtml: '',
commandHtml: summary
? `${uiModule.esc(summary)}
`
: rangeSummary
? `${uiModule.esc(rangeSummary)}
`
: '',
};
}
const emailTool = lower.includes('email');
if (emailTool && (lower.includes('read_email') || lower.endsWith('read_email'))) {
const uid = args && args.uid ? String(args.uid) : '';
const folder = args && args.folder ? String(args.folder) : 'INBOX';
const href = _emailToolHash(args || {}, data);
return {
label: uid ? `Read email UID ${uid}` : 'Read email',
headerActionHtml: href
? _toolHeaderHashLinkHtml(href, 'Open this email')
: '',
commandHtml: uid
? `UID ${uiModule.esc(uid)} · ${uiModule.esc(folder)}`
: '',
};
}
if (emailTool && (lower.includes('list_emails') || lower.endsWith('list_emails'))) {
const max = args && args.max_results ? String(args.max_results) : '';
const folder = args && args.folder ? String(args.folder) : 'INBOX';
const bits = [folder, max ? `${max} latest` : 'latest'].filter(Boolean).join(' · ');
return {
label: 'Check email',
commandHtml: `${uiModule.esc(bits)}
`,
};
}
if (emailTool && (lower.includes('search_emails') || lower.endsWith('search_emails'))) {
const q = args && args.query ? String(args.query) : '';
return {
label: 'Search email',
commandHtml: q ? `${uiModule.esc(q)}
` : '',
};
}
return { label: '', commandHtml: '' };
}
function _suppressRawToolOutput(tool, ok) {
if (!ok) return false;
const lower = String(tool || '').toLowerCase();
if (lower === 'manage_calendar' || lower.endsWith('manage_calendar')) return true;
return (
lower.includes('email')
&& (
lower.includes('list_emails')
|| lower.includes('search_emails')
|| lower.includes('read_email')
|| lower.includes('download_attachment')
|| lower.includes('scan_spam')
|| lower.includes('scan_email_unsubscribes')
)
);
}
function _thinkingLabel() {
if (!_lastToolName) {
return 'Thinking';
}
// Check exact match first, then prefix match
const lower = _lastToolName.toLowerCase();
if (_toolLabels[lower]) return _toolLabels[lower];
for (const [key, label] of Object.entries(_toolLabels)) {
if (lower.includes(key) || key.includes(lower)) return label;
}
return 'Thinking';
}
function _showThinkingSpinner(label) {
if (sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId() !== streamSessionId) return;
const chatBox = document.getElementById('chat-history');
if (!chatBox) return;
if (_thinkingSpinnerEl || chatBox.querySelector('.agent-thinking-dots')) return;
const _thinkMsg = document.createElement('div');
_thinkMsg.className = 'msg msg-ai agent-thinking-dots';
const _thinkBody = document.createElement('div');
_thinkBody.className = 'body';
const _ts = spinnerModule.create(label || 'Thinking', 'right', 'wave');
_thinkBody.appendChild(_ts.createElement());
_ts.start(120);
_thinkMsg._spinner = _ts;
_thinkMsg.appendChild(_thinkBody);
_thinkingSpinnerEl = _thinkMsg;
chatBox.appendChild(_thinkMsg);
uiModule.scrollHistory();
}
function _replaceThinkingSpinner(label) {
_removeThinkingSpinner();
_showThinkingSpinner(label);
}
// Show waiting feedback only between tool rounds, never infer thinking
// from a text pause (which also occurs while a finished reply is saved).
let _toolPauseTimer = null;
function _scheduleToolWaitSpinner() {
if (_toolPauseTimer) clearTimeout(_toolPauseTimer);
_toolPauseTimer = setTimeout(() => {
const active = _activeStreams.get(streamSessionId);
const isVisible = !(sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId() !== streamSessionId);
_toolPauseTimer = null;
if (active?.abortCtrl === abortCtrl && !abortCtrl?.signal?.aborted
&& !_streamSawDone && isVisible && !_thinkingSpinnerEl) {
_showThinkingSpinner(_thinkingLabel());
}
}, 400);
}
_cancelThinkingTimer = () => {
if (_toolPauseTimer) { clearTimeout(_toolPauseTimer); _toolPauseTimer = null; }
};
// Document streaming state (text-fence detection)
let _docFenceOpened = false;
const _thinkingAnalysisGate = createThinkingAnalysisGate({
startsWithReasoningPrefix: markdownModule.startsWithReasoningPrefix,
});
const _roundDisplayProjector = createIncrementalDisplayProjector(_streamDisplayText);
const _replyDisplayProjector = createIncrementalDisplayProjector(_streamDisplayText);
let _thinkingMode = null;
let _thinkingRecheckAt = 0;
let _thinkingGraceTimer = null;
let _liveThinkSection = null;
let _liveThinkContent = null;
let _liveThinkInner = null;
let _liveThinkHeader = null;
let _liveThinkSpinnerSlot = null;
let _liveThinkTimerEl = null;
let _liveThinkSpinner = null;
let _liveThinkTokenCount = 0;
let _liveThinkToggle = null;
let _liveThinkDomId = null;
let _liveThinkRenderThrottle = null;
let _liveThinkLatestText = '';
let _liveThinkTimerId = null;
let _liveThinkReducedMotion = false;
function _estimateThinkingTokens(text) {
const clean = (text || '').trim();
if (!clean) return 0;
return Math.max(1, Math.ceil(clean.length / 4));
}
function _formatThinkStats(seconds, tokenCount) {
const time = seconds ? seconds + 's' : '';
const tokens = tokenCount ? tokenCount + ' tok' : '';
return time && tokens ? time + ' · ' + tokens : (time || tokens);
}
function _stripThinkingWrappers(text) {
return text
.replace(/<\|channel>thought\s*\n?/gi, '')
.replace(/<\|channel>response\s*\n?/gi, '')
.replace(/Thinking' +
(lines > 1 ? ` (${lines} lines)` : '') + '
Thinking\u2026
${esc(cmd)}` : ''));
node.innerHTML = `${toolIcon}${esc(toolLabel)}${toolHeaderAction}▁▂▃
${cmdHtml}
`;
// Expand/collapse via delegated click handler (init at module bottom).
threadWrap.appendChild(node);
currentToolBubble = node;
if (_isPrivateBrowserTool(json.tool)) {
_showPrivateBrowserPreview(json.command || '', node.querySelector('.agent-thread-content'));
}
// Animate the wave
const waveEl = node.querySelector('.agent-thread-wave');
if (waveEl) {
const waveFrames = ['▁▂▃', '▂▃▄', '▃▄▅', '▄▅▆', '▅▆▇', '▆▅▄', '▅▄▃', '▄▃▂'];
let waveIdx = 0;
node._waveInterval = setInterval(() => {
waveIdx = (waveIdx + 1) % waveFrames.length;
waveEl.textContent = waveFrames[waveIdx];
}, 100);
}
// Smooth per-second "cooking" timer — ticks every second (not
// just on the 2s backend heartbeat) so a long-running tool
// always shows visible motion and never reads as frozen.
node._startTime = Date.now();
node._elapsedTicker = setInterval(() => {
const hdr2 = node.querySelector('.agent-thread-header');
if (!hdr2) return;
let el2 = hdr2.querySelector('.agent-thread-elapsed');
if (!el2) {
el2 = document.createElement('span');
el2.className = 'agent-thread-elapsed';
// Sits on the LEFT, right after the icon.
const icon = hdr2.querySelector('.agent-thread-icon');
if (icon && icon.nextSibling) hdr2.insertBefore(el2, icon.nextSibling);
else hdr2.appendChild(el2);
}
const s = (Date.now() - node._startTime) / 1000;
// Hundredths so it visibly counts sub-second (1.00, 1.05, …).
el2.textContent = s < 60 ? `${s.toFixed(2)}s` : `${Math.floor(s / 60)}m ${(s % 60).toFixed(2).padStart(5, '0')}s`;
}, 50);
uiModule.scrollHistory();
} else if (json.type === 'editor_progress') {
if (_isBg) continue;
_editorProgress = json;
if (spinner?.element) _startTtftDisplay();
} else if (json.type === 'tool_progress') {
// Long-running subprocess (bash, python) is still in
// flight — refresh the running tool card with the
// elapsed-time + tail of its stdout/stderr so the
// user doesn't stare at a blind "Running…" spinner.
if (_isBg) continue;
if (!currentToolBubble) continue;
const isImageProgress = /image/i.test(String(json.tool || '')) || /image/i.test(String(json.message || ''));
if (json.total || json.percent != null || isImageProgress) {
const content = currentToolBubble.querySelector('.agent-thread-content');
if (content) {
let progressEl = currentToolBubble.querySelector('.agent-image-progress');
if (!progressEl) {
progressEl = document.createElement('div');
progressEl.className = 'agent-image-progress';
progressEl.innerHTML = '';
content.appendChild(progressEl);
}
const step = Number(json.step || 0);
const total = Number(json.total || 0);
const hasExactProgress = total > 0 || json.percent != null;
progressEl.classList.toggle('is-indeterminate', !hasExactProgress);
const pct = Number(json.percent != null ? json.percent : (total ? (step / total) * 100 : 0));
const bounded = Math.max(0, Math.min(100, Number.isFinite(pct) ? pct : 0));
const label = progressEl.querySelector('.agent-image-progress-label');
const value = progressEl.querySelector('.agent-image-progress-value');
if (label) label.textContent = json.message || 'Editing image…';
if (value) value.textContent = hasExactProgress ? (total ? `${step}/${total}` : `${Math.round(bounded)}%`) : (json.elapsed ? `${json.elapsed}s` : '');
}
}
// The per-second ticker (started in tool_start) owns the
// elapsed display; here we just surface the live output tail.
const tailStr = (json.tail || '').trim();
if (tailStr) {
let tailEl = currentToolBubble.querySelector('.agent-thread-tail');
if (!tailEl) {
tailEl = document.createElement('pre');
tailEl.className = 'agent-thread-tail';
tailEl.style.cssText = 'margin:4px 0 0;padding:6px 8px;font-size:11px;background:rgba(0,0,0,0.18);border-radius:4px;max-height:140px;overflow:auto;white-space:pre-wrap;opacity:0.85;';
const content = currentToolBubble.querySelector('.agent-thread-content');
if (content) content.appendChild(tailEl);
}
tailEl.textContent = tailStr;
tailEl.scrollTop = tailEl.scrollHeight;
}
uiModule.scrollHistory();
} else if (json.type === 'tool_output') {
// Let feature panels reconcile state from the actual tool
// result rather than trying to infer completion from the
// assistant's prose. Email unsubscribe uses this for the
// exact UIDs deleted by an agent follow-up.
try {
window.dispatchEvent(new CustomEvent('odysseus:agent-tool-output', { detail: json }));
} catch (_) {}
if (_isBg) continue;
// --- Update the current thread node ---
if (currentToolBubble) {
// Stop wave animation + the per-second cooking ticker
if (currentToolBubble._waveInterval) {
clearInterval(currentToolBubble._waveInterval);
currentToolBubble._waveInterval = null;
}
if (currentToolBubble._elapsedTicker) {
clearInterval(currentToolBubble._elapsedTicker);
currentToolBubble._elapsedTicker = null;
}
const ok = (json.exit_code === 0 || json.exit_code == null);
const cmd = json.command || '';
let outHtml = '';
if (!_suppressRawToolOutput(json.tool, ok) && json.output && json.output.trim()) {
outHtml = `
Output
${esc(json.output)}${esc(d.file || 'diff')} ${stat}
${rows}${esc(cmd)}` : ''));
// Preserve the user's .open choice across the innerHTML
// rewrite \u2014 otherwise expanding a running tool collapses
// it as soon as the result lands, forcing the user to
// click again. Click handling is delegated (see init at
// bottom of file) so no per-node listener needed.
if (browserTool) {
outHtml = _privateBrowserPreviewHtml(cmd, json.screenshot) + outHtml;
}
const _wasOpen = currentToolBubble.classList.contains('open') || browserTool;
currentToolBubble.className = 'agent-thread-node' + (ok ? '' : ' error') + (_wasOpen ? ' open' : '') + (browserTool ? ' browser-preview-node' : '');
currentToolBubble.innerHTML = `${toolIcon2}${esc(toolInfo2.label || json.tool)}${toolHeaderAction2}${ok ? 'done' : 'failed'}
${cmdHtml2}${outHtml}${diffHtml}
`;
// Reset so thinking spinner between tools says "Thinking" not the old tool's label
_lastToolName = '';
uiModule.scrollHistory();
}
// --- Render generated images inline ---
if (json.image_url) {
_rememberGeneratedImage(json);
_appendGeneratedImageBubble(json, streamSessionId);
}
// --- Render browser screenshots in tool output ---
if (json.screenshot && currentToolBubble) {
const contentEl = currentToolBubble.querySelector('.agent-thread-content');
if (contentEl) {
_updatePrivateBrowserPreview(json, contentEl);
const screenshotSrc = chatRenderer.safeToolScreenshotSrc(json.screenshot);
if (screenshotSrc && !_isPrivateBrowserTool(json.tool)) {
const details = document.createElement('details');
details.className = 'agent-tool-output';
const summary = document.createElement('summary');
summary.textContent = 'Screenshot';
const img = document.createElement('img');
img.src = screenshotSrc;
img.style.cssText = 'max-width:100%;border-radius:6px;margin-top:6px;border:1px solid var(--border)';
details.appendChild(summary);
details.appendChild(img);
contentEl.appendChild(details);
}
}
}
// --- Reload sessions after manage_session tool (delete, rename, etc.) ---
// Debounce so bulk deletes don't fire loadSessions per call
if (json.tool === 'manage_session' && sessionModule) {
if (window._manageSessionTimer) clearTimeout(window._manageSessionTimer);
window._manageSessionTimer = setTimeout(() => sessionModule.loadSessions(), 1000);
}
// --- Live-refresh the calendar after manage_calendar (add/edit/delete) ---
// so a new event shows without the user hard-refreshing. Debounced
// so a batch of event creates only triggers one refetch.
if (json.tool === 'manage_calendar') {
if (window._manageCalTimer) clearTimeout(window._manageCalTimer);
window._manageCalTimer = setTimeout(
() => window.dispatchEvent(new CustomEvent('calendar-refresh')), 600);
}
// --- Live-refresh Memories after manage_memory changes ---
if (json.tool === 'manage_memory') {
if (window._manageMemoryTimer) clearTimeout(window._manageMemoryTimer);
window._manageMemoryTimer = setTimeout(
() => window.dispatchEvent(new CustomEvent('memory-refresh')), 600);
}
// --- Apply UI control actions embedded in tool_output ---
if (json.ui_event) {
chatStream.handleUIControl(json);
}
// Native document tool calls can arrive as a completed
// tool_output without the text-fence streaming path. Open the
// document editor from the real doc metadata carried on the
// tool result so "create a document" never leaves only a chat
// link behind if the later doc_update event is missed.
if (
documentModule
&& json.doc_id
&& ['create_document', 'update_document', 'edit_document',
'draft_email', 'mcp__email__draft_email',
'draft_email_reply', 'mcp__email__draft_email_reply',
'ai_draft_email_reply', 'mcp__email__ai_draft_email_reply'].includes(json.tool)
) {
if (['draft_email', 'mcp__email__draft_email',
'draft_email_reply', 'mcp__email__draft_email_reply',
'ai_draft_email_reply', 'mcp__email__ai_draft_email_reply'].includes(json.tool)
&& documentModule.loadDocument) {
documentModule.loadDocument(json.doc_id);
} else {
documentModule.handleDocUpdate({
type: 'doc_update',
doc_id: json.doc_id,
title: json.document_title || '',
language: json.document_language || '',
version: json.document_version || 1,
content: json.document_content || '',
});
}
}
// Schedule a thinking spinner between tool rounds (short delay so
// agent_step in the same SSE chunk can cancel it before it shows)
_scheduleToolWaitSpinner();
uiModule.scrollHistory();
} else if (json.type === 'doc_stream_open') {
if (_isBg) {
// Store for replay when user returns to this session
var bgDocOpen = _backgroundStreams.get(streamSessionId);
if (bgDocOpen) {
bgDocOpen._docTitle = json.title || '';
bgDocOpen._docLang = json.language || '';
bgDocOpen._docContent = '';
}
continue;
}
if (documentModule) {
documentModule.streamDocOpen(json.title || '', json.language || '');
}
} else if (json.type === 'doc_stream_delta') {
if (_isBg) {
var bgDocDelta = _backgroundStreams.get(streamSessionId);
if (bgDocDelta) bgDocDelta._docContent = json.content || '';
continue;
}
if (documentModule) {
documentModule.streamDocDelta(json.content || '');
}
} else if (json.type === 'doc_update') {
// doc_update means the server already saved the doc to DB.
if (_isBg) continue;
_editorProgress = null;
if (documentModule) {
documentModule.handleDocUpdate(json);
}
offerFinishEditorTurn();
} else if (json.type === 'doc_suggestions') {
if (_isBg) continue;
_editorProgress = null;
if (documentModule && documentModule.handleDocSuggestions) {
documentModule.handleDocSuggestions(json);
}
offerFinishEditorTurn();
} else if (json.type === 'email_open') {
if (_isBg) continue;
import('./emailLibrary.js?v=20260915trashmove2').then(mod =>
mod.openEmailFromTool(json, () => sessionModule.getCurrentSessionId() === streamSessionId)
).catch(err => uiModule.showToast(`Could not open email: ${err.message}`));
} else if (json.type === 'ui_control') {
if (_isBg) continue;
chatStream.handleUIControl(json.data || {});
} else if (json.type === 'ask_user') {
if (_isBg) continue;
// The agent posed a multiple-choice question; the turn has ended.
// Use the shared history renderer so the live and restored
// versions have identical behavior.
_cancelThinkingTimer();
_removeThinkingSpinner();
chatRenderer.renderAskUserCard(json.data || {});
} else if (json.type === 'plan_update') {
if (_isBg) continue;
// Agent wrote back to the plan (ticked a step / revised). Update
// the stored plan + live-refresh the docked plan window.
const _pu = (json.data && json.data.plan) ? json.data.plan : '';
if (_pu) _setStoredPlan(_pu);
} else if (json.type === 'agent_step') {
if (!_turnRendering.accepts(json)) continue;
if (!startsContinuationRound(json)) {
// Keep the current label stable; the TTFT ticker owns it
// until visible output arrives.
continue;
}
_closeOpenThinkingMarkup(_isBg);
if (_isBg) continue;
_cancelThinkingTimer();
_removeThinkingSpinner();
if (isThinking) {
_endLiveThinkingSection({ rich: false });
} else {
_cancelLiveThinkingWork();
}
_finalizeRoundRender();
// Mark thread as connected to bubble below
const _activeThread = document.querySelector('.agent-thread.streaming');
if (_activeThread) {
_activeThread.classList.add('has-bottom');
}
// --- New round: create fresh AI bubble with spinner ---
currentToolBubble = null;
roundFinalized = false;
terminalFinalResponseRendered = false;
roundFinalization = null;
isThinking = false;
roundReplyText = null;
_thinkingMode = null;
_thinkingRecheckAt = 0;
_thinkingAnalysisGate.reset();
_roundDisplayProjector.reset();
_replyDisplayProjector.reset();
_docFenceOpened = false;
const box = document.getElementById('chat-history');
const newWrap = document.createElement('div');
newWrap.className = 'msg msg-ai msg-continuation streaming';
// Add model name label
const newRole = document.createElement('div');
newRole.className = 'role';
const metaS = sessionModule.getSessions().find(s => s.id === streamSessionId);
inheritModelRouteState(holder, roundHolder, newWrap, metaS?.model || modelName);
const _roundRequested = newWrap._requestedModel;
const _roundActual = newWrap._actualModel;
newRole.textContent = _modelRouteLabel(
_roundRequested,
_roundActual,
newWrap._requestedEndpointLabel,
newWrap._actualEndpointLabel,
newWrap._requestedEndpointId,
newWrap._actualEndpointId,
) || '';
_applyModelColor(newRole, _roundActual);
newWrap.appendChild(newRole);
const newBody = document.createElement('div');
newBody.className = 'body';
newWrap.appendChild(newBody);
box.appendChild(newWrap);
roundHolder = newWrap;
roundText = '';
// Destroy any previous spinner before creating new one
if (spinner && spinner.element) spinner.destroy();
// Show spinner while waiting for text (skip for research — has its own progress)
if (!_researchingStreamIds.has(streamSessionId)) {
spinner = spinnerModule.create('Generating response', 'right', 'wave');
newBody.appendChild(spinner.createElement());
spinner.start();
}
if (streamingTTS) window.aiTTSManager._streamSentencesSent = 0;
uiModule.scrollHistory();
} else if (json.type === 'budget_exceeded') {
if (_isBg) continue;
_cancelThinkingTimer();
_removeThinkingSpinner();
const budgetDiv = document.createElement('div');
budgetDiv.style.cssText = 'font-size:11px;opacity:0.6;font-style:italic;padding:4px 8px;margin:4px 0;';
budgetDiv.textContent = `Tool budget reached (${json.used}/${json.limit} calls). Agent stopped.`;
const chatBox = document.getElementById('chat-history');
chatBox.appendChild(budgetDiv);
} else if (json.type === 'loop_breaker_triggered' || json.type === 'intent_nudge_exhausted') {
if (_isBg) continue;
_cancelThinkingTimer();
_removeThinkingSpinner();
const guardDiv = document.createElement('div');
guardDiv.className = 'stopped-indicator';
const guardLabel = document.createElement('span');
guardLabel.textContent = `[Agent guard: ${json.message || json.reason || 'internal stop'}]`;
guardDiv.appendChild(guardLabel);
const targetBody = roundHolder && roundHolder.querySelector('.body');
if (targetBody) targetBody.appendChild(guardDiv);
else {
const chatBox = document.getElementById('chat-history');
if (chatBox) chatBox.appendChild(guardDiv);
}
} else if (json.type === 'teacher_takeover') {
if (!_turnRendering.accepts(json)) continue;
if (_isBg) continue;
_cancelThinkingTimer();
_removeThinkingSpinner();
// Finalize any in-flight bubble so the takeover banner
// separates student attempt from teacher attempt.
if (spinner && spinner.element) { try { spinner.destroy(); } catch(_){} spinner = null; }
const chatBox = document.getElementById('chat-history');
const banner = document.createElement('div');
banner.className = 'teacher-takeover-banner';
banner.style.cssText = 'margin:10px 0;padding:8px 12px;border-left:3px solid #c08a3e;background:rgba(192,138,62,0.08);font-size:12px;color:var(--fg);border-radius:4px;';
const teacherName = json.teacher_model || 'teacher';
const why = json.student_failure ? ` — ${esc(json.student_failure)}` : '';
banner.innerHTML = `Teacher takeover: escalating to ${esc(teacherName)}${why}`;
chatBox.appendChild(banner);
// Reset round bubble state so the teacher's first text starts a new bubble
roundHolder = null;
roundText = '';
roundFinalized = false;
terminalFinalResponseRendered = false;
roundFinalization = null;
currentToolBubble = null;
uiModule.scrollHistory();
} else if (json.type === 'skill_saved') {
if (_isBg) continue;
const chatBox = document.getElementById('chat-history');
const note = document.createElement('div');
note.className = 'skill-saved-note';
note.style.cssText = 'margin:6px 0;padding:6px 10px;border-left:3px solid #4a8a4a;background:rgba(74,138,74,0.07);font-size:12px;color:var(--fg);border-radius:4px;';
note.innerHTML = `Skill learned: ${esc(json.name || '')}${json.category ? ` [${esc(json.category)}]` : ''}`;
chatBox.appendChild(note);
uiModule.scrollHistory();
} else if (json.type === 'escalation_failed' || json.type === 'skill_save_failed') {
if (_isBg) continue;
const chatBox = document.getElementById('chat-history');
const note = document.createElement('div');
note.className = 'escalation-failed-note';
note.style.cssText = 'margin:6px 0;padding:6px 10px;border-left:3px solid #8a4a4a;background:rgba(138,74,74,0.07);font-size:12px;color:var(--fg);border-radius:4px;';
const label = json.type === 'escalation_failed' ? 'Teacher could not solve it' : 'Skill not saved';
note.innerHTML = `${label}: ${esc(json.reason || '')}`;
chatBox.appendChild(note);
uiModule.scrollHistory();
} else if (json.error) {
// --- Backend error (timeout, connection issue, etc.) ---
console.error('Stream error from backend:', json.error);
if (_isBg) continue;
if (spinner && spinner.element) spinner.destroy();
const errDiv = document.createElement('div');
errDiv.style.cssText = 'color: var(--color-error); font-style: italic; padding: 4px 0;';
errDiv.textContent = `[Error: ${json.error}]`;
roundHolder.querySelector('.body').appendChild(errDiv);
uiModule.scrollHistory();
}
} catch (e) {
console.error('Error parsing SSE data:', e);
}
}
}
}
if (_streamTerminalError) {
throw _streamTerminalError;
}
if (!_streamSawDone) {
if (!_canonicalTerminalSaved) {
throw new Error('Stream closed before completion');
}
// The backend persisted a canonical terminal record (partial output +
// failure metadata) before the connection died. Route through the
// terminal-error path so that record is reloaded; falling through to
// the success renderer would present the partial output as a clean
// completion.
throw createTerminalStreamError({
text: 'Stream closed after canonical terminal event',
});
}
// The final foreground render below is authoritative. Cancel any delayed
// live-view work instead of parsing and rendering the full round once
// here and then immediately replacing it.
_cancelLiveThinkingWork();
if (spinner && spinner.element) { try { spinner.destroy(); } catch (_) {} spinner = null; }
_cancelThinkingTimer();
_removeThinkingSpinner();
// Stop any thread pulse animations
document.querySelectorAll('.agent-thread.streaming').forEach(t => t.classList.remove('streaming'));
// --- Final render (skip if stream was ever backgrounded or currently in background) ---
const _isBgFinal = (sessionModule.getCurrentSessionId() !== streamSessionId) || _backgroundStreams.has(streamSessionId);
if (!_isBgFinal) {
if (!terminalFinalResponseRendered && !_turnRendering.isVisible(roundHolder.querySelector('.body'), _terminalAnswerHtml(roundText, roundHolder.querySelector('.body')))) _renderStream();
if (spinner && spinner.element) { try { spinner.destroy(); } catch (_) {} spinner = null; }
_cancelThinkingTimer();
_removeThinkingSpinner();
// Stop this visible thread's pulse animations.
document.querySelectorAll('#chat-history .agent-thread.streaming').forEach(t => t.classList.remove('streaming'));
}
// Remove streaming class from all round bubbles
holder.classList.remove('streaming');
if (roundHolder && roundHolder !== holder) roundHolder.classList.remove('streaming');
if (!_isBgFinal) {
finalMeta = sessionModule.getSessions().find(s => s.id === sessionModule.getCurrentSessionId());
const _finalModelHolder = applyModelMetricsState(
metrics,
holder,
roundHolder,
finalMeta?.model || modelName,
) || holder;
const _finalActualModel = _finalModelHolder._actualModel || finalMeta?.model;
const _finalRequestedModel = _finalModelHolder._requestedModel || finalMeta?.model || _finalActualModel;
// Prepend character name if set
var _charNameFinal = presetsModule.getCharacterName ? presetsModule.getCharacterName() : '';
const roleEl = _finalModelHolder.querySelector('.role');
if (roleEl) {
_setRoleModelLabel(roleEl, _finalRequestedModel, _finalActualModel, {
suffix: _finalModelHolder._roleSuffix,
characterName: _charNameFinal || _finalModelHolder._characterName,
requestedEndpointId: _finalModelHolder._requestedEndpointId,
requestedEndpointLabel: _finalModelHolder._requestedEndpointLabel,
actualEndpointId: _finalModelHolder._actualEndpointId,
actualEndpointLabel: _finalModelHolder._actualEndpointLabel,
});
}
holder.dataset.raw = accumulated;
// Anti-stall: a turn that ran tools but ended with essentially no
// final prose usually means the model stopped mid-task (the case
// where you had to type "did you finish?"). Offer a one-click
// Continue that resumes exactly where it left off — reuses the same
// resume mechanism as the user-stop "[Message interrupted]" button.
try {
const _usedTools = holder.querySelector('.agent-thread-node');
const _proseLen = (accumulated || '').replace(/<[^>]*>/g, '').trim().length;
if (_usedTools && _proseLen < 24 && !holder.querySelector('.agent-continue-btn')) {
const _stall = document.createElement('div');
_stall.className = 'stopped-indicator';
const _lbl = document.createElement('span');
_lbl.style.cssText = 'font-style:italic;opacity:0.7;';
_lbl.textContent = 'Paused mid-task';
_stall.appendChild(_lbl);
const _cont = document.createElement('button');
_cont.className = 'continue-btn resume-btn agent-continue-btn';
_cont.title = 'Continue — pick up where it left off';
_cont.innerHTML = 'Resume';
_cont.addEventListener('click', () => {
_stall.remove();
const mi = uiModule.el('message');
if (mi) {
mi.value = 'Continue — you stopped before finishing. Pick up exactly where you left off and complete the task.';
const sb = document.querySelector('.send-btn');
if (sb) sb.click();
}
});
_stall.appendChild(_cont);
(holder.querySelector('.body') || holder).appendChild(_stall);
}
} catch (_) {}
const _terminalScrollSnapshot = uiModule.captureHistoryScroll?.();
// Clear streaming minHeight lock
const _streamContent = roundHolder.querySelector('.stream-content');
if (_streamContent) _streamContent.style.minHeight = '';
if (_docFenceOpened) {
_finishDocumentWritingStatus(roundHolder, true);
roundHolder.style.display = '';
}
// Finalize the last round's bubble — flatten stream-content wrapper for clean DOM
const finalDisplay = terminalFinalResponseRendered ? '' : _streamDisplayText(roundText, { final: _docFenceOpened });
if (terminalFinalResponseRendered) {
// A canonical answer must not fall through to the empty-round
// branch below, which hides continuation bubbles.
_renderTerminalAnswer(roundText);
} else if (finalDisplay.trim() && _turnRendering.isVisible(roundHolder.querySelector('.body'), _terminalAnswerHtml(finalDisplay, roundHolder.querySelector('.body')))) {
// Preserve the actual streamed nodes, including selection.
} else if (finalDisplay.trim()) {
var _body4 = roundHolder.querySelector('.body');
// Preserve sources expanded state before final render
var _wasExpanded = _sourcesExpanded || !!(_body4 && _body4.querySelector('.sources-content.expanded'));
if (_suppressThinkingForPersona()) {
const _personaFinal = _visiblePersonaReplyText(finalDisplay);
_body4.innerHTML = (_sourcesData ? _buildSourcesBox(_sourcesData, _sourcesType, _wasExpanded) : '')
+ (_personaFinal.trim() ? markdownModule.mdToHtml(markdownModule.squashOutsideCode(_personaFinal)) : '')
+ (_findingsData ? chatRenderer.buildFindingsBox(_findingsData) : '');
} else {
// If thinking was collapsed in-place during streaming, preserve it
var _liveReplyEl = _body4 && _body4.querySelector('.live-reply-content');
var _extracted = _liveReplyEl ? markdownModule.extractThinkingBlocks(finalDisplay) : null;
var _finalReply = '';
if (_liveReplyEl) {
// Try standard extraction first (for native ${_esc(src.snippet)}
`;
details.appendChild(item);
});
holder.querySelector('.body').appendChild(details);
}
// Hide first bubble if it has no visible text content (e.g. agent went straight to tools)
if (holder !== roundHolder && holder.style.display !== 'none') {
const _hBody = holder.querySelector('.body');
const _hText = _hBody ? _hBody.textContent.trim() : '';
if (!_hText) holder.style.display = 'none';
}
// Attach footer to the last visible bubble (roundHolder for multi-round agent, holder for single)
const footerTarget = (roundHolder && roundHolder !== holder && roundHolder.style.display !== 'none') ? roundHolder : holder;
if (!footerTarget.querySelector('.msg-footer')) {
footerTarget.appendChild(createMsgFooter(footerTarget, { animate: true }));
}
if (_generatedImagesForTurn.length && !_isBgFinal) {
_generatedImagesForTurn.forEach(imgData => _appendGeneratedImageBubble(imgData, streamSessionId));
}
// Add "View Report" link for completed research
if (_researchingStreamIds.has(streamSessionId)) {
_appendViewReportLink(footerTarget, streamSessionId);
}
// Also store raw on the footer target so copy/TTS work
if (footerTarget !== holder) footerTarget.dataset.raw = accumulated;
try {
const _endToggles = Storage.loadToggleState();
if (_endToggles.plan_mode && accumulated) {
_setStoredPlan(accumulated);
_attachPlanActions(footerTarget, accumulated);
}
} catch (_) {}
if (addAITTSButton && accumulated && window.aiTTSManager?._provider !== 'disabled' && window.aiTTSManager?.available) {
addAITTSButton(footerTarget, accumulated);
}
// TTS auto-play: streaming mode flushes remaining text, non-streaming enqueues full message
if (accumulated && window.aiTTSManager && window.aiTTSManager.autoPlay) {
const ttsBtn = holder.querySelector('.ai-tts-button');
if (ttsBtn) {
var ICON_PLAY_TTS = '';
var ICON_STOP_TTS = '';
const resetFn = () => {
ttsBtn.innerHTML = ICON_PLAY_TTS;
ttsBtn.classList.remove('playing', 'loading');
ttsBtn.style.color = '#6b7280';
ttsBtn.title = 'Read aloud';
};
if (streamingTTS) {
// Flush remaining partial sentence and attach the real button
window.aiTTSManager.streamingEnd(accumulated);
window.aiTTSManager.streamingAttachButton(ttsBtn, resetFn);
// If still playing sentences from the stream, show stop icon
if (window.aiTTSManager.isPlaying || window.aiTTSManager._processing) {
ttsBtn.innerHTML = ICON_STOP_TTS;
ttsBtn.classList.add('playing');
ttsBtn.style.color = '#ccc';
ttsBtn.title = 'Stop';
}
} else {
// Non-streaming fallback (autoPlay toggled mid-stream, etc.)
window.aiTTSManager.enqueue(accumulated, ttsBtn, resetFn);
}
}
}
if (metrics) {
displayMetrics(_metricsTargetForTurn() || footerTarget, metrics);
}
// Attach variant navigation if this was a regeneration
_attachVariantNav(footerTarget);
// Merge with previous stopped message if this was a continue
if (_pendingContinue) {
const prevEl = _pendingContinue;
_pendingContinue = null;
const prevBody = prevEl.querySelector('.body');
const newBody = footerTarget.querySelector('.body');
if (prevBody && newBody && prevEl.parentNode) {
// Merge: combine raw text with *(continued)* marker
const oldRaw = prevEl.dataset.raw || '';
const newRaw = footerTarget.dataset.raw || '';
const mergedRaw = oldRaw + '\n\n*(continued)*\n\n' + newRaw;
prevEl.dataset.raw = mergedRaw;
// Re-render merged content
prevBody.innerHTML = markdownModule.processWithThinking(
markdownModule.squashOutsideCode(mergedRaw)
);
// Remove the new bubble and re-add footer to the merged one
footerTarget.remove();
const oldFooter = prevEl.querySelector('.msg-footer');
if (oldFooter) oldFooter.remove();
prevEl.appendChild(createMsgFooter(prevEl));
if (window.hljs) {
prevEl.querySelectorAll('pre code').forEach(block => window.hljs.highlightElement(block));
}
// Persist merge to server
const sid = sessionModule.getCurrentSessionId();
if (sid) {
fetch(`${API_BASE}/api/session/${sid}/merge-last-assistant`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ separator: '\n\n*(continued)*\n\n' })
}).catch(e => console.warn('merge-last-assistant failed:', e));
}
}
}
// Reconcile only the final answer; the tool timeline retains its DOM.
uiModule.restoreHistoryScroll?.(_terminalScrollSnapshot);
// A saved answer can correct the live answer without rebuilding the turn.
if (!_pendingContinue) {
const _needsCanonicalTurnRebuild = !!(
lastToolThread
|| terminalFinalResponseRendered
|| _generatedImagesForTurn.length
);
if (_needsCanonicalTurnRebuild) {
await _replaceLiveTurnWithSavedAssistantMessage();
}
if (_streamTurnMarker && _streamTurnMarker.parentNode) {
_turnRendering.settle();
_streamTurnMarker.remove();
}
}
} // end if (!_isBgFinal)
} catch (err) {
// If a Stop or timeout was waiting for an identity header and the POST
// failed before producing one, keep this on the cancellation path. There
// is no safe headerless server cancel to send, but it must not be turned
// into an automatic recovery attempt either. Only this send's own
// queued Stop counts; a replacement's queued Stop is not ours to spend.
const _pendingCatchKey = streamSessionId + ':' + streamGeneration;
if (
_pendingRunStops.has(_pendingCatchKey)
&& abortCtrl
&& !abortCtrl.signal.aborted
) {
_pendingRunStops.delete(_pendingCatchKey);
abortCtrl._reason = 'user-stop';
abortCtrl.abort();
}
// Check if this stream was running in background — needed before any
// stop-state write, so an errored background stream can't clobber the
// foreground session's text.
const _isBgCatch = (sessionModule.getCurrentSessionId() !== streamSessionId) || _backgroundStreams.has(streamSessionId);
let _catchTerminalView = null;
_closeOpenThinkingMarkup(_isBgCatch);
if (_isBgCatch) {
_cancelLiveThinkingWork();
// A canonical terminal event may have been persisted immediately
// before the stream moved into the background. Preserve that terminal
// state instead of allowing the catch path to turn it back into a
// running/error stream.
const bgTerminal = _backgroundStreams.get(streamSessionId);
if (bgTerminal && _terminalSavedStreams.has(streamSessionId)) {
bgTerminal.status = 'completed';
if (sessionModule && sessionModule.clearStreaming) {
sessionModule.clearStreaming(streamSessionId);
}
}
} else if (accumulated) {
_catchTerminalView = _finalizeInterruptedView();
} else {
// Empty terminal views are owned by _renderCancelledBubble; do not run
// the rich round renderer first because it hides an empty holder.
_endThinkingOnTerminalPath({ rich: false });
}
const _catchViewHolder = _catchTerminalView?.holder || holder;
if (_isBgCatch) {
// Detaching intentionally closes only this browser subscriber. The
// server-owned run is still live and will be rejoined on session entry.
var bgErr = _backgroundStreams.get(streamSessionId);
if (abortCtrl && abortCtrl._reason === 'detach') {
if (bgErr && bgErr.status !== 'completed') bgErr.status = 'running';
} else if (bgErr && (
bgErr.status === 'completed' || _terminalSavedStreams.has(streamSessionId)
)) {
bgErr.status = 'completed';
// [DONE] was already processed — this error is benign (e.g. reader.read() after close)
// Don't override the completed status; just ensure the completed dot stays
if (sessionModule && sessionModule.clearStreaming) {
sessionModule.clearStreaming(streamSessionId);
}
} else if (bgErr) {
console.error('Background stream error:', err);
bgErr.status = 'error';
if (sessionModule && sessionModule.clearStreaming) {
sessionModule.clearStreaming(streamSessionId);
}
}
}
if (!_isBgCatch) {
// Clean up any active spinner (e.g. "Generating response" during tool calls)
if (spinner && spinner.element) spinner.destroy();
_cancelThinkingTimer();
_removeThinkingSpinner();
document.querySelectorAll('#chat-history .agent-thread.streaming').forEach(t => t.classList.remove('streaming'));
// Stop streaming TTS on any error/abort
if (streamingTTS && window.aiTTSManager) window.aiTTSManager.stop();
if (abortCtrl && abortCtrl.signal.aborted) {
const abortReason = abortCtrl._reason || '';
// Timeout-triggered aborts should remain visible instead of disappearing.
if (timedOut || abortReason === 'timeout') {
const timeoutMsg = _isAgent
? 'Agent response timed out. Try again, switch to a faster model, or reduce tool usage.'
: 'Response timed out. Try again.';
if (holder && !accumulated) {
holder.querySelector('.body').innerHTML =
`[${timeoutMsg}]
`;
} else if (_catchViewHolder && accumulated) {
const timeoutNote = document.createElement('div');
timeoutNote.className = 'stopped-indicator';
timeoutNote.innerHTML =
`[${timeoutMsg}]`;
_catchViewHolder.querySelector('.body').appendChild(timeoutNote);
}
if (currentAbort === abortCtrl) currentAbort = null;
return;
}
if (abortReason === 'offline') {
const offlineMsg = 'Endpoint offline — switch model or try again.';
if (holder && !accumulated) {
holder.querySelector('.body').innerHTML =
`[${offlineMsg}]
`;
} else if (_catchViewHolder && accumulated) {
const offlineNote = document.createElement('div');
offlineNote.className = 'stopped-indicator';
offlineNote.innerHTML =
`[${offlineMsg}]`;
_catchViewHolder.querySelector('.body').appendChild(offlineNote);
}
if (currentAbort === abortCtrl) currentAbort = null;
return;
}
if (abortReason === 'recovery') {
const recoveryMsg = 'Streaming was interrupted after the tab went inactive. Partial output was preserved.';
if (holder && !accumulated) {
holder.querySelector('.body').innerHTML =
`[${recoveryMsg}]
`;
} else if (_catchViewHolder && accumulated) {
const recoveryNote = document.createElement('div');
recoveryNote.className = 'stopped-indicator';
recoveryNote.innerHTML =
`[${recoveryMsg}]`;
_catchViewHolder.querySelector('.body').appendChild(recoveryNote);
}
if (currentAbort === abortCtrl) currentAbort = null;
return;
}
if (abortReason === 'stale-local') {
const staleMsg = 'Stream connection ended. Composer unlocked; send again if needed.';
if (holder && !accumulated) {
holder.querySelector('.body').innerHTML =
`[${staleMsg}]
`;
} else if (_catchViewHolder && accumulated) {
const staleNote = document.createElement('div');
staleNote.className = 'stopped-indicator';
staleNote.innerHTML = `[${staleMsg}]`;
_catchViewHolder.querySelector('.body').appendChild(staleNote);
}
if (currentAbort === abortCtrl) currentAbort = null;
return;
}
// User-initiated stop (or browser navigation abort).
// Stopped before any text arrived — keep the bubble as a
// "Cancelled by user" record (so it survives a refresh).
if (holder && !accumulated) {
_renderCancelledBubble(holder);
}
// Navigation and non-button aborts do not pass through the synchronous
// Stop renderer. The catch render above owns markdown; add only the
// interruption controls here so each terminal path renders once.
if (_catchViewHolder && accumulated && currentHolder) {
_catchViewHolder.dataset.raw = accumulated;
const stoppedIndicator = document.createElement('div');
stoppedIndicator.className = 'stopped-indicator';
const stoppedLabel = document.createElement('span');
stoppedLabel.textContent = '[Message interrupted]';
stoppedIndicator.appendChild(stoppedLabel);
const continueBtn = document.createElement('button');
continueBtn.className = 'continue-btn resume-btn';
continueBtn.title = 'Resume response';
continueBtn.innerHTML = 'Resume';
continueBtn.addEventListener('click', () => {
stoppedIndicator.remove();
_hideUserBubble = true;
_pendingContinue = _catchViewHolder;
const msgInput = uiModule.el('message');
if (msgInput) {
msgInput.value = 'Continue from where you left off.';
const sb = document.querySelector('.send-btn');
if (sb) sb.click();
}
});
stoppedIndicator.appendChild(continueBtn);
_catchViewHolder.querySelector('.body').appendChild(stoppedIndicator);
// Tell server to mark this message as stopped
const _sid2 = sessionModule.getCurrentSessionId();
if (_sid2) fetch(`${API_BASE}/api/session/${_sid2}/mark-stopped`, { method: 'POST' }).catch(e => console.warn('mark-stopped failed:', e));
if (!_catchViewHolder.querySelector('.msg-footer')) {
_catchViewHolder.appendChild(createMsgFooter(_catchViewHolder));
}
uiModule.scrollHistory();
}
// Now clear the abort controller
if (currentAbort === abortCtrl) currentAbort = null;
} else {
console.error(err);
// Stream died with a tool node still spinning. Its per-node tickers
// (_elapsedTicker 50ms / _waveInterval 100ms) are normally cleared in
// `tool_output`, which will never arrive now — without this sweep they
// fire forever on the orphaned node (and auto-recover compounds it per
// nudge). Safe here: auto-recover's new send is deferred 200ms, so no
// fresh running nodes exist yet.
document.querySelectorAll('.agent-thread-node.running').forEach(node => {
if (node._waveInterval) { clearInterval(node._waveInterval); node._waveInterval = null; }
if (node._elapsedTicker) { clearInterval(node._elapsedTicker); node._elapsedTicker = null; }
node.classList.remove('running');
});
// Stream died unexpectedly — the "silently died" case. Re-engage the
// model immediately (no wait) with a completion handshake, up to the
// cap. Only auto-recover from connection-class failures; deterministic
// errors (unsupported tools, 4xx/5xx, parse failures) surface right away
// instead of burning the nudge budget on a guaranteed-to-fail retry.
if (!(isRecoverableStreamError(err) && _tryAutoRecover(_catchViewHolder, accumulated, streamSessionId))) {
if (err.terminalStreamError) {
if (_canonicalTerminalSaved) {
// Let this stream's finally block clear foreground state before
// reselecting; otherwise selectSession would detach the already
// terminal reader and leave a stale background-stream marker.
setTimeout(async () => {
if (sessionModule.getCurrentSessionId() === streamSessionId) {
await sessionModule.selectSession(streamSessionId, { showLoading: false });
} else {
await sessionModule.loadSessions();
}
}, 0);
} else {
// Streamed text is not evidence of a saved terminal record.
// Reloading here erases partial replies when an upstream
// failure left only the user message in server history.
// Preserve the live answer and append the escaped error.
const terminalBody =
_catchViewHolder?.querySelector('.body')
|| roundHolder?.querySelector('.body')
|| document.querySelector('.msg-ai:last-of-type .body');
if (terminalBody) {
const terminalNote = document.createElement('div');
terminalNote.style.cssText = 'color: var(--color-error); font-style: italic; padding: 4px 0;';
terminalNote.textContent = `[Error: ${err.message}]`;
terminalBody.appendChild(terminalNote);
}
}
return;
}
const errorHolder =
_catchViewHolder?.querySelector('.body')
|| document.querySelector('.msg-ai:last-of-type .body');
if (errorHolder) {
let errMsg = `Error: ${err.message}`;
// Add hint for tool-call errors
if (err.message && (err.message.includes('tool') || err.message.includes('auto'))) {
errMsg += '\n\nThis model may not support tools — try switching to Chat mode.';
}
typewriterInto(errorHolder, errMsg);
}
}
}
}
} finally {
_editorProgress = null;
document.querySelectorAll('.agent-finish-editor').forEach(button => button.remove());
_settleTurnRendering();
_cancelLiveThinkingWork();
clearResponseTimeout();
clearProcessingProbe();
clearFirstTokenWaitTimers();
_stopTtftDisplay();
// A replacement send bumps the session's generation the moment it
// starts, before it registers or reaches the server, so cleanup rights
// are decided by generation: a superseded send may remove only what it
// itself owns (its stream registration by controller identity, its own
// generation's queued Stop) and must leave session-level state — the
// reader session id, research marker, UI — to the replacement.
const _ownsStreamState =
_streamGenerations.get(streamSessionId) === streamGeneration;
if (_ownsStreamState && sessionModule.getCurrentSessionId() === streamSessionId) {
documentModule?.streamDocFinalize?.();
}
if (_ownsStreamState && _streamSawDone) {
sessionModule.markStreamComplete?.(streamSessionId);
} else if (_ownsStreamState && abortCtrl?._reason === 'user-stop') {
sessionModule.clearStreaming?.(streamSessionId);
}
const _finallyRegistered = _activeStreams.get(streamSessionId);
if (!_finallyRegistered || _finallyRegistered.abortCtrl === abortCtrl) {
_activeStreams.delete(streamSessionId);
}
_pendingRunStops.delete(streamSessionId + ':' + streamGeneration);
if (_ownsStreamState) {
if (_streamSessionId === streamSessionId) _streamSessionId = null;
if (_sendStates.get(streamSessionId) === _sendState) {
_sendStates.delete(streamSessionId);
}
// Superseded sends must not resync: with the replacement not yet
// registered, a stale sync would set isStreaming false and drop
// currentAbort while _sendInFlight is already false, reopening the
// send gate mid-preflight. The replacement syncs when it registers
// or finishes.
_syncForegroundStreamGlobals();
}
// Streaming done — let screen readers announce the settled response.
if (_ownsStreamState) {
const _chatLogDone = document.getElementById('chat-history');
if (_chatLogDone) _chatLogDone.setAttribute('aria-busy', 'false');
}
// Research markers gate /api/research/cancel in the Stop handler, so a
// superseded send must not strip a replacement research run's marker.
if (_ownsStreamState) _researchingStreamIds.delete(streamSessionId);
if (_researchingStreamIds.size === 0) {
var _rToggleCleanup = document.getElementById('research-toggle-btn');
if (_rToggleCleanup) _rToggleCleanup.classList.remove('research-running');
}
// Only reset UI state if still on the stream's session, never
// backgrounded, and no replacement stream owns the session now — the
// replacement disabled the composer for its own send, so re-enabling
// it here would hand input back mid-stream.
const _isBgFinally = (sessionModule.getCurrentSessionId() !== streamSessionId) || _backgroundStreams.has(streamSessionId);
if (_ownsStreamState) _terminalSavedStreams.delete(streamSessionId);
if (!_isBgFinally && _ownsStreamState) {
// Reset button to idle state
updateSubmitButton('idle', submitBtn);
// Re-enable message input; on mobile blur to dismiss keyboard
if (messageInput) {
messageInput.disabled = false;
if (window.innerWidth <= 768) {
messageInput.blur();
} else if (!document.getElementById('doc-editor-pane')) {
// Do not steal focus from an open document at stream completion.
// preventScroll also keeps the chat viewport stable in browsers
// that reveal a focused input even when it is already visible.
try { messageInput.focus({ preventScroll: true }); }
catch (_) { messageInput.focus(); }
}
}
// Clear tracking variables
currentAccumulated = '';
currentHolder = null;
currentSpinner = null;
_researchingStreamIds.delete(streamSessionId);
// Clear research-running highlight if no more active research
if (_researchingStreamIds.size === 0) {
var _rToggle2 = document.getElementById('research-toggle-btn');
if (_rToggle2) _rToggle2.classList.remove('research-running');
}
_clearResearchTimer();
// Re-enable research button and auto-untoggle after use
// (skip if clarification round — keep toggle on for follow-up)
const _el = uiModule.el;
const _researchBtn = _el('research-toggle-btn');
const _researchToggle = _el('research-toggle');
if (_researchToggle && _researchToggle.checked) {
_researchToggle.checked = false;
Storage.setToggle('research', false);
}
if (_researchBtn) {
_researchBtn.disabled = false;
_researchBtn.classList.remove('active');
_researchBtn.style.display = 'none';
}
// Also sync overflow and tool sidebar buttons
const _overflowRes = _el('overflow-research-btn');
if (_overflowRes) _overflowRes.classList.remove('active');
const _toolRes = _el('tool-research-btn');
if (_toolRes) _toolRes.classList.remove('active');
}
// Research clarification timeout — if user doesn't reply within 5 min, show timeout
if (holder && holder._roleSuffix === 'Research' && !_researchingStreamIds.has(streamSessionId)) {
var _timeoutSessionId = streamSessionId;
var _timeoutTimer = setTimeout(async function() {
// Check if research_pending is still active (user hasn't replied)
try {
var _box = document.getElementById('chat-history');
if (_box && sessionModule.getCurrentSessionId() === _timeoutSessionId) {
var _timeoutMsg = document.createElement('div');
_timeoutMsg.className = 'msg msg-ai';
_timeoutMsg.innerHTML = 'Odysseus
Research clarification timed out. Toggle research again to start over.
';
_box.appendChild(_timeoutMsg);
uiModule.scrollHistory();
}
} catch(_te) {}
}, 5 * 60 * 1000);
// Cancel timeout if user sends a message
var _origSubmit = window._researchTimeoutTimer;
if (_origSubmit) clearTimeout(_origSubmit);
window._researchTimeoutTimer = _timeoutTimer;
}
// Release Web Lock
if (_webLockRelease) {
_webLockRelease();
_webLockRelease = null;
}
// Refresh session list after a delay (picks up auto-generated names)
setTimeout(() => {
if (sessionModule && sessionModule.loadSessions) {
sessionModule.loadSessions();
}
}, 3000);
_drainQueuedAgentRequests();
}
}
/**
* Abort current chat request
*/
// stopServer=true ONLY for an explicit user Stop. The run is now DETACHED
// (survives tab close / navigation), so the generic abort used by cleanup
// paths (session switch, delete, reader teardown on tab close) must NOT stop
// the server run — otherwise closing the tab would kill the background task,
// defeating the whole point. Only the Stop button cancels the server run.
export function abortCurrentRequest(stopServer = false) {
const _sid = (sessionModule && sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId())
|| _streamSessionId
|| (window.sessionModule && window.sessionModule.getCurrentSessionId && window.sessionModule.getCurrentSessionId());
// The CURRENT send's controller comes from its send state, installed at
// send commit — never borrowed from the stream registry, which during the
// replacement's preflight still holds the superseded send's entry.
// Aborting that older controller here would sever the only identity
// channel able to name the old run. A send committed but pre-POST has a
// null controller: the Stop queues and there is nothing to abort yet.
const _sendStateNow = _sid ? _sendStates.get(_sid) : null;
const active = _getForegroundStreamState();
const abortCtrl = _sendStateNow
? _sendStateNow.abortCtrl
: (active ? active.abortCtrl : currentAbort);
let abortNow = true;
if (stopServer) {
try {
if (_sid) {
// Before response headers arrive there is no safe server-side stop
// identity yet. Keep the POST alive just long enough to receive that
// opaque id, then _rememberStreamRunId sends the exact Stop and aborts
// this reader. Never fall back to a headerless session-wide cancel.
abortNow = _stopExactRun(_sid, abortCtrl);
}
} catch (_) {}
}
if (abortCtrl && abortNow) {
abortCtrl.abort();
// Don't set to null here - let catch block handle it
}
}
// ── Stall watchdog ──────────────────────────────────────────────
// Auto-recover a turn whose browser stream died by reconnecting to the exact
// detached server run. Returns false at the cap so the caller can surface
// the failure instead of retrying forever.
// Only auto-recover from connection-class failures (the genuine "silently
// died" case). Deterministic errors — unsupported tools, HTTP 4xx/5xx, JSON
// parse failures — will fail identically on retry, so surfacing them
// immediately is both more honest and avoids wasting the nudge budget.
function _tryAutoRecover(holder, accumulated, sessionId) {
if (_autoNudges >= _AUTO_NUDGE_CAP) return false;
_autoNudges++;
if (holder && accumulated) {
holder.dataset.raw = accumulated;
}
// The server run is detached and keeps its exact pinned model/tool state.
// Reconnect to that run instead of submitting a new user turn, which would
// cancel it, retry the selected model, and risk duplicating side effects.
setTimeout(async () => {
// The stream that died may not be the chat the user is now looking at —
// never attach the recovery reader to the wrong conversation.
if (sessionId && sessionModule.getCurrentSessionId() !== sessionId) return;
const resumed = await resumeStream(sessionId, holder || null);
if (!resumed && holder && holder.isConnected) {
const body = holder.querySelector('.body');
if (body) typewriterInto(body, 'Connection lost. The existing run could not be resumed.');
}
}, 200);
return true;
}
function _removeStallBanner() {
const b = document.getElementById('stall-banner');
if (b) b.remove();
_stallBannerShown = false;
}
function _showStallBanner(secs) {
if (document.getElementById('stall-banner')) return;
_stallBannerShown = true;
const box = document.getElementById('chat-history');
if (!box) return;
const bar = document.createElement('div');
bar.id = 'stall-banner';
bar.className = 'stall-banner';
const mins = Math.floor(secs / 60);
const label = mins >= 1 ? `${mins}m` : `${secs}s`;
bar.innerHTML = ``;
const cont = document.createElement('button');
cont.className = 'stall-banner-btn';
cont.textContent = 'Nudge it';
cont.title = 'Stop the stalled stream and ask it to continue';
cont.addEventListener('click', () => {
_removeStallBanner();
const mi = uiModule.el('message');
if (mi) {
mi.value = 'Are you still working? If you stopped, continue exactly where you left off and finish the task.';
const sb = document.querySelector('.send-btn');
if (sb) sb.click();
}
});
const stop = document.createElement('button');
stop.className = 'stall-banner-btn stall-banner-stop';
stop.textContent = 'Stop';
stop.addEventListener('click', () => { _removeStallBanner(); abortCurrentRequest(true); });
bar.appendChild(cont);
bar.appendChild(stop);
box.appendChild(bar);
if (uiModule.scrollHistory) uiModule.scrollHistory();
}
async function _probeStaleLocalStream() {
const active = _getForegroundStreamState();
if (!active || _staleStreamProbeInFlight) return;
if (Date.now() - (active.lastActivity || _lastReaderActivity) < STALE_LOCAL_STREAM_MS) return;
const sid = sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId();
if (!sid) return;
if (_backgroundStreams.has(sid) || (sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId() !== sid)) return;
_staleStreamProbeInFlight = true;
try {
const res = await fetch(`${API_BASE}/api/chat/stream_status/${encodeURIComponent(sid)}`, {
credentials: 'same-origin',
cache: 'no-store',
});
if (!_getForegroundStreamState() || _backgroundStreams.has(sid)) return;
// The server now reports "no active stream" as 200 {status:"idle"} (an
// older server used 404); a body with status "streaming" means it is NOT
// stale. Accept both so the watchdog keeps working across deploys.
let _probe = null;
try { _probe = await res.json(); } catch (_) { _probe = null; }
const _noActiveStream = res.status === 404 || !_probe || _probe.status !== 'streaming';
if (!_noActiveStream) return;
console.warn('[stream-watchdog] Local stream was stale and server has no active stream. Unlocking composer.');
if (active.abortCtrl && !active.abortCtrl.signal.aborted) {
active.abortCtrl._reason = 'stale-local';
active.abortCtrl.abort();
}
_activeStreams.delete(sid);
_syncForegroundStreamGlobals();
_sendInFlight = false;
if (_webLockRelease) {
_webLockRelease();
_webLockRelease = null;
}
const submitBtn = document.querySelector('.send-btn');
if (submitBtn) updateSubmitButton('idle', submitBtn);
const messageInput = uiModule.el('message');
if (messageInput) messageInput.disabled = false;
_drainQueuedAgentRequests();
} catch (err) {
console.warn('[stream-watchdog] Stream status probe failed:', err);
} finally {
_staleStreamProbeInFlight = false;
}
}
function _startStallWatchdog() {
// Keep the old noisy stall banner disabled. This watchdog only unlocks
// a dead local stream after the backend confirms no active stream exists.
if (_stallWatchdog) { clearInterval(_stallWatchdog); _stallWatchdog = null; }
_removeStallBanner();
_stallWatchdog = setInterval(_probeStaleLocalStream, 5000);
}
function _stopStallWatchdog() {
if (_stallWatchdog) { clearInterval(_stallWatchdog); _stallWatchdog = null; }
_removeStallBanner();
}
/** Show a "Cancelled by user" record in `holder` and persist an empty
* assistant placeholder server-side so the turn survives a refresh.
* Called from both abort paths when no tokens had streamed yet. */
function _renderCancelledBubble(holder) {
if (!holder) return;
if (holder.dataset.cancelledRendered === '1') return;
holder.dataset.cancelledRendered = '1';
holder.dataset.raw = '';
holder.style.display = '';
const body = holder.querySelector('.body');
if (body) {
body.innerHTML = '';
const indicator = document.createElement('div');
indicator.className = 'stopped-indicator';
const label = document.createElement('span');
label.style.fontStyle = 'italic';
label.style.opacity = '0.7';
label.textContent = '[Cancelled by user]';
indicator.appendChild(label);
body.appendChild(indicator);
}
if (typeof createMsgFooter === 'function' && !holder.querySelector('.msg-footer')) {
holder.appendChild(createMsgFooter(holder));
}
// Persist as an assistant message with stopped+cancelled metadata so the
// chat-history loader renders the same indicator after a refresh.
// Include the model name so the bubble header still shows which model
// was running when the user hit Stop.
const sid = sessionModule.getCurrentSessionId();
if (sid) {
let modelName = '';
try { modelName = sessionModule.getCurrentModel?.() || ''; } catch {}
// Fallback: pull from the holder's existing meta (the streaming
// placeholder usually has the model set in the header already).
if (!modelName) {
modelName = holder.dataset.model
|| holder.querySelector('.msg-header .msg-model')?.textContent
|| '';
}
fetch(`${API_BASE}/api/session/${sid}/inject_messages`, {
method: 'POST', credentials: 'same-origin',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
messages: [{
role: 'assistant',
content: '',
metadata: { stopped: true, cancelled: true, model: modelName },
}],
}),
}).catch(() => {});
}
}
/**
* Detach current stream to run in background instead of aborting.
* Called when user switches sessions mid-stream.
*/
export function detachCurrentStream(sessionId) {
const active = sessionId ? _activeStreams.get(sessionId) : _getForegroundStreamState();
if (!active || !active.abortCtrl) {
// Not streaming — fall through to abort
abortCurrentRequest();
return;
}
// The backend owns the detached run. Stop this tab's subscriber and its
// delayed rendering; session re-entry will replay and follow the same run.
if (active.cancelViewWork) active.cancelViewWork();
const terminalSaved = _terminalSavedStreams.has(sessionId);
// Store background stream state. A canonical terminal event can precede
// its SSE error event; preserve completion if the user switches sessions
// during that gap instead of creating a fresh running/error marker.
_backgroundStreams.set(sessionId, {
status: terminalSaved ? 'completed' : 'running',
accumulated: currentAccumulated,
sourcesHtml: '',
findingsData: null,
abortCtrl: active.abortCtrl,
query: active.query || (active.holder ? (active.holder._researchQuery || '') : ''),
metrics: null,
});
// Mark session with pulsing dot in sidebar
if (!terminalSaved && sessionModule && sessionModule.markStreaming) {
sessionModule.markStreaming(sessionId);
} else if (terminalSaved && sessionModule && sessionModule.clearStreaming) {
sessionModule.clearStreaming(sessionId);
}
active.abortCtrl._reason = 'detach';
_activeStreams.delete(sessionId);
if (!active.abortCtrl.signal.aborted) active.abortCtrl.abort();
// Clear foreground state without cancelling the server-owned run.
if (currentAbort === active.abortCtrl) currentAbort = null;
if (currentHolder === active.holder) currentHolder = null;
if (_streamSessionId === sessionId) _streamSessionId = null;
currentAccumulated = '';
_syncForegroundStreamGlobals();
// Reset submit button so the new chat is ready to send
const submitBtn = document.querySelector('.send-btn');
if (submitBtn) updateSubmitButton('idle', submitBtn);
}
// _notifyStreamComplete and _insertStreamDoneToast now in chatStream.js
var _notifyStreamComplete = chatStream.notifyStreamComplete;
var _insertStreamDoneToast = chatStream.insertStreamDoneToast;
/**
* Live-resume a chat run still streaming detached on the server (#2539).
*
* On session re-entry, GET /api/chat/resume/{id} replays the run's buffer then
* streams live; reply tokens render as they arrive. On completion a plain text
* reply is finalized in place (canonical bubble via chatRenderer.addMessage, no
* reload); a "rich" reply (tool calls, sources, doc streaming, multi-round) is
* reloaded from the DB so its full render stays faithful. Returns true if it
* attached, false to let the caller fall back to spinner+poll.
*/
export async function resumeStream(sessionId, replaceHolder = null) {
if (!sessionId) return false;
if (hasActiveStream(sessionId)) return false;
let res;
try {
res = await fetch(`${API_BASE}/api/chat/resume/${sessionId}`);
} catch (e) {
return false;
}
if (!res.ok || !res.body) return false;
const resumeRunId = res.headers.get('X-Odysseus-Run-Id') || '';
if (resumeRunId) _streamRunIds.set(sessionId, resumeRunId);
const box = document.getElementById('chat-history');
if (!box) return false;
if (replaceHolder && replaceHolder.parentNode) replaceHolder.remove();
// Block duplicate re-attach attempts while this reader is live. A dedicated
// set (not _backgroundStreams) so checkBackgroundStream doesn't mistake this
// for a same-tab POST stream and spawn its own spinner+poll on re-entry.
_resumingStreams.add(sessionId);
_backgroundStreams.delete(sessionId);
const submitBtn = document.querySelector('.send-btn');
if (submitBtn) updateSubmitButton('streaming', submitBtn);
if (sessionModule && sessionModule.markStreaming) sessionModule.markStreaming(sessionId);
const holder = document.createElement('div');
holder.className = 'msg msg-ai';
const meta = sessionModule.getSessions().find(s => s.id === sessionId);
const roleLabel = _shortModel(meta && meta.model);
const roleTs = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
holder.innerHTML = '' + uiModule.esc(roleLabel) +
'
' +
'';
holder._requestedModel = meta && meta.model;
holder._actualModel = holder._requestedModel;
_applyModelColor(holder.querySelector('.role'), meta && meta.model);
let roundHolder = holder;
let contentDiv = holder.querySelector('.stream-content');
const replayMarker = document.createComment('live-stream-turn');
box.appendChild(replayMarker);
const replayRendering = createTurnRendering({ root: box, start: replayMarker });
box.appendChild(holder);
const replayNodes = [holder];
const spinner = spinnerModule.create('Generating response...', 'right');
holder.querySelector('.body').appendChild(spinner.createElement());
spinner.start();
uiModule.scrollHistory();
const reader = res.body.getReader();
const decoder = new TextDecoder();
let buffer = '';
let roundText = '';
let replayThinking = '';
let replayMessageId = '';
let docFenceOpened = false;
let gotDelta = false;
let leftSession = false;
let metricsData = null;
let replayError = null;
let canonicalTerminalSeen = false;
let currentToolBubble = null;
let currentToolThread = null;
// "Rich" responses (tool calls, sources, doc streaming, multi-round) need the
// full canonical render, which is rebuilt from the saved DB record on reload.
// Plain text replies can be finalized in place without a reload.
let rich = false;
const cleanup = () => {
replayRendering.settle();
try { spinner.destroy(); } catch (_) {}
_resumingStreams.delete(sessionId);
if (sessionModule.getCurrentSessionId && sessionModule.getCurrentSessionId() === sessionId) {
if (submitBtn) updateSubmitButton('idle', submitBtn);
if (sessionModule && sessionModule.clearStreaming) sessionModule.clearStreaming(sessionId);
const input = uiModule.el && uiModule.el('message');
if (input) input.disabled = false;
}
};
const renderDelta = (event = {}, scroll = true) => {
if (!roundHolder.isConnected || roundHolder.style.display === 'none'
|| (event.type === 'final_response' && currentToolThread?.isConnected
&& (roundHolder.compareDocumentPosition(currentToolThread) & Node.DOCUMENT_POSITION_FOLLOWING))) {
const text = roundText;
const thinking = replayThinking;
startReplayRound();
roundText = text;
replayThinking = thinking;
}
contentDiv = roundHolder.querySelector('.body');
const dt = markdownModule.normalizeThinkingMarkup(_streamDisplayText(roundText, { final: docFenceOpened }));
if (docFenceOpened && !dt.trim()) {
_showDocumentWritingStatus(contentDiv);
} else {
const source = (replayThinking ? `
';
box.appendChild(next);
replayNodes.push(next);
roundHolder = next;
contentDiv = next.querySelector('.stream-content');
currentToolBubble = null;
currentToolThread = null;
};
const startReplayTool = (json) => {
try { spinner.destroy(); } catch (_) {}
if (!roundText.trim() && roundHolder) roundHolder.style.display = 'none';
const thread = document.createElement('div');
thread.className = 'agent-thread streaming' + (roundText.trim() ? ' has-top' : '');
const node = document.createElement('div');
node.className = 'agent-thread-node running';
const command = String(json.command || json.args || '');
const label = String(json.label || json.tool || 'Tool');
const icon = renderToolIcon(json.tool || '', command, json) || '';
node.innerHTML = '
' +
icon + '' + uiModule.esc(label) + '' +
'▁▂▃
' +
(command ? '
';
thread.appendChild(node);
box.appendChild(thread);
replayNodes.push(thread);
currentToolThread = thread;
currentToolBubble = node;
uiModule.scrollHistory();
};
const finishReplayTool = (json) => {
if (!currentToolBubble) return;
const ok = json.exit_code === 0 || json.exit_code == null;
const command = String(json.command || json.args || '');
const output = String(json.output || '');
const label = String(json.label || json.tool || 'Tool');
const icon = renderToolIcon(json.tool || '', command, json) || '';
currentToolBubble.className = 'agent-thread-node' + (ok ? '' : ' error');
currentToolBubble.innerHTML = '' + uiModule.esc(command) + '' : '') + '
' +
'' + icon +
'' + uiModule.esc(label) + '' +
'' + (ok ? 'done' : 'failed') + '' +
'
' +
'' +
(command ? '' : '') +
'
';
if (currentToolThread) currentToolThread.classList.remove('streaming');
};
try {
readLoop:
while (true) {
// User left this session: stop rendering, the run continues server-side.
if (sessionModule.getCurrentSessionId &&
sessionModule.getCurrentSessionId() !== sessionId) {
leftSession = true;
try { await reader.cancel(); } catch (_) {}
break;
}
const { done, value } = await reader.read();
if (done) break;
buffer += decoder.decode(value, { stream: true });
const parts = buffer.split('\n\n');
buffer = parts.pop();
for (const part of parts) {
const eventIsError = part.split('\n').some(l => l.trim() === 'event: error');
if (eventIsError) rich = true;
const line = part.split('\n').find(l => l.startsWith('data: '));
if (!line) continue;
const payload = line.slice(6);
if (payload === '[DONE]') {
try { await reader.cancel(); } catch (_) {}
break readLoop;
}
let json;
try { json = JSON.parse(payload); } catch (_) { continue; }
if (eventIsError || ['stable', 'complete', 'error', 'agent_terminal', 'chat_terminal'].includes(json.type)) replayRendering.settle();
if (eventIsError) {
replayError = createTerminalStreamError(json);
} else if (json.type === 'final_response') {
const finalText = String(json.content || json.delta || '');
if (!finalText.trim()) continue;
if (!replayRendering.accepts(json)) continue;
roundText = finalText;
gotDelta = true;
try { spinner.destroy(); } catch (_) {}
renderDelta(json);
if (json.photo_editor_action) renderPhotoEditorApplyButton(roundHolder, json.photo_editor_action);
replayRendering.settle();
} else if (json.delta) {
if (!replayRendering.accepts(json)) continue;
if (!json.thinking && json.render_owner === 'streamed' && json.replacement_scope === 'turn') {
roundText = '';
}
if (json.thinking) replayThinking += json.delta;
else
roundText += json.delta;
if (!docFenceOpened && (roundText.includes('```create_document\n') || roundText.includes('```document\n') || roundText.includes('```documen\n'))) {
docFenceOpened = true;
rich = true;
}
if (!gotDelta) { gotDelta = true; try { spinner.destroy(); } catch (_) {} }
renderDelta(json);
} else if (json.type === 'doc_stream_open') {
rich = true;
if (documentModule) documentModule.streamDocOpen(json.title || '', json.lang || '');
} else if (json.type === 'doc_stream_delta') {
rich = true;
if (documentModule) documentModule.streamDocDelta(json.content || json.delta || '');
} else if (json.type === 'metrics') {
metricsData = json.data || metricsData;
if (metricsData && resumeRunId) {
metricsData._costRecordId = _metricsCostRecordId(resumeRunId, json);
}
if (metricsData) {
chatRenderer.recordSessionMetricsCost(metricsData, sessionId);
}
} else if (json.type === 'message_saved') {
replayMessageId = String(json.id || '');
} else if (json.type === 'fallback') {
// Replay can attach after the selected route has already failed.
// Reflect the fallback immediately, then reload the canonical
// multi-round record when the detached run completes.
rich = true;
const fallbackHolder = applyModelRouteEventState(json, holder, null, meta && meta.model);
if (fallbackHolder) {
_setRoleModelLabel(
fallbackHolder.querySelector('.role'),
fallbackHolder._requestedModel,
fallbackHolder._actualModel,
{
reason: json.reason,
requestedEndpointId: fallbackHolder._requestedEndpointId,
requestedEndpointLabel: fallbackHolder._requestedEndpointLabel,
actualEndpointId: fallbackHolder._actualEndpointId,
actualEndpointLabel: fallbackHolder._actualEndpointLabel,
},
);
}
uiModule.showToast(
'Fallback: ' + _shortModel(json.selected_model || '') + ' failed — answered by ' +
_shortModel(json.answered_by || ''),
6000,
);
} else if (json.type === 'model_actual') {
rich = true;
const modelHolder = applyModelRouteEventState(json, holder, null, meta && meta.model);
if (modelHolder) {
_setRoleModelLabel(
modelHolder.querySelector('.role'),
modelHolder._requestedModel,
modelHolder._actualModel,
{
requestedEndpointId: modelHolder._requestedEndpointId,
requestedEndpointLabel: modelHolder._requestedEndpointLabel,
actualEndpointId: modelHolder._actualEndpointId,
actualEndpointLabel: modelHolder._actualEndpointLabel,
},
);
}
} else if (json.type === 'agent_terminal' || json.type === 'chat_terminal') {
// The server has already persisted canonical partial content plus
// a sanitized failure note and actual route provenance. Do not
// finalize replayed deltas as a successful local-only answer.
rich = true;
canonicalTerminalSeen = true;
metricsData = json.data || metricsData;
if (metricsData && resumeRunId) {
metricsData._costRecordId = _metricsCostRecordId(resumeRunId, json);
}
if (metricsData) displayMetrics(holder, metricsData);
} else if (json.type === 'tool_start' || json.type === 'tool_output' ||
json.type === 'tool_progress' || json.type === 'agent_step' ||
json.type === 'web_sources' || json.type === 'rag_sources' ||
json.type === 'research_progress' || json.type === 'research_sources' ||
json.type === 'research_findings' || json.type === 'research_done') {
rich = true;
if (json.type === 'tool_start') {
startReplayTool(json);
} else if (json.type === 'tool_output') {
finishReplayTool(json);
} else if (json.type === 'tool_progress' && currentToolBubble) {
const target = currentToolBubble.querySelector('.agent-thread-content');
if (target && (json.tail || json.message)) {
let progress = target.querySelector('.agent-thread-tail');
if (!progress) {
progress = document.createElement('pre');
progress.className = 'agent-thread-tail';
target.appendChild(progress);
}
progress.textContent = String(json.tail || json.message || '');
}
} else if (json.type === 'agent_step') {
if (replayRendering.accepts(json) && startsContinuationRound(json)) startReplayRound();
}
}
}
}
} catch (e) {
// Network drop or parse failure: fall through to the canonical reload.
rich = true;
}
cleanup();
if (docFenceOpened) _finishDocumentWritingStatus(holder, true);
if (leftSession) { removeReplayNodes(); return true; }
const onThisSession = sessionModule.getCurrentSessionId &&
sessionModule.getCurrentSessionId() === sessionId;
// A failure before substantive output has no persisted assistant record to
// recover through a canonical reload. Keep its sanitized provider/request
// error visible in the replay holder instead of deleting the only evidence.
if (onThisSession && replayError && !canonicalTerminalSeen) {
const errorDiv = document.createElement('div');
errorDiv.style.cssText = 'color: var(--color-error); font-style: italic; padding: 4px 0;';
errorDiv.textContent = `[Error: ${replayError.message}]`;
contentDiv.appendChild(errorDiv);
uiModule.scrollHistory();
return true;
}
const isReplayCurrent = () => sessionModule.getCurrentSessionId() === sessionId
&& replayMarker.parentNode === box
&& (!resumeRunId || _streamRunIds.get(sessionId) === resumeRunId);
if (!onThisSession || !isReplayCurrent()) { removeReplayNodes(); return true; }
const scrollSnapshot = uiModule.captureHistoryScroll?.();
// Reconcile only this saved answer. Rebuilding history would discard open
// tool cards and resurrect drafts in clients with older history renderers.
if (replayMessageId) {
try {
const savedResponse = await fetch(`${API_BASE}/api/history/${encodeURIComponent(sessionId)}?limit=12`);
if (savedResponse.ok && isReplayCurrent()) {
const data = await savedResponse.json();
if (!isReplayCurrent()) { removeReplayNodes(); return true; }
const saved = (data.history || []).find(message => message.role === 'assistant'
&& String(message.metadata?._db_id || '') === replayMessageId);
if (saved) {
metricsData = { ...metricsData, ...saved.metadata };
roundText = String(saved.content || '');
if (roundText.trim()) renderDelta(saved.metadata || {}, false);
}
}
} catch (error) {
console.warn('Could not reconcile resumed answer:', error);
}
}
if (!isReplayCurrent()) { removeReplayNodes(); return true; }
const target = roundHolder?.isConnected && roundHolder.style.display !== 'none'
? roundHolder : currentToolThread;
if (target) {
target.classList.remove('streaming');
if (replayMessageId) target.dataset.dbId = replayMessageId;
if (target.classList.contains('msg-ai')) {
target.dataset.raw = roundText;
if (!target.querySelector('.msg-footer')) target.appendChild(createMsgFooter(target));
const body = target.querySelector('.body');
if (body && !body.querySelector('.sources-section')) {
const sources = metricsData?.web_sources || metricsData?.research_sources;
if (sources?.length) body.insertAdjacentHTML('afterbegin', chatRenderer.buildSourcesBox(sources, metricsData.web_sources ? 'web' : 'research'));
if (metricsData?.research_findings?.length) body.insertAdjacentHTML('beforeend', chatRenderer.buildFindingsBox(metricsData.research_findings));
}
if (body && metricsData?.rag_sources?.length && !body.querySelector('.rag-sources')) {
body.insertAdjacentHTML('beforeend', chatRenderer.buildRagSourcesBox(metricsData.rag_sources));
}
}
if (metricsData) displayMetrics(target, metricsData);
}
replayRendering.settle();
replayMarker.remove();
uiModule.restoreHistoryScroll?.(scrollSnapshot);
return true;
}
/**
* Check for background streams when switching to a session.
* Called after history loads on session switch.
*/
export function checkBackgroundStream(sessionId) {
if (!sessionId || !_backgroundStreams.has(sessionId)) return;
var entry = _backgroundStreams.get(sessionId);
if (entry.status === 'completed') {
// Response is already saved to DB and will appear in history — just clean up
_backgroundStreams.delete(sessionId);
_syncForegroundStreamGlobals();
return;
}
if (entry.status === 'error') {
_backgroundStreams.delete(sessionId);
_syncForegroundStreamGlobals();
var box = document.getElementById('chat-history');
if (box) {
var errHolder = document.createElement('div');
errHolder.className = 'msg msg-ai';
errHolder.innerHTML = '' + uiModule.esc(command) + '' : '') + (output ? '
Output
' + uiModule.esc(output) + '
[Background stream encountered an error]
';
box.appendChild(errHolder);
}
return;
}
if (entry.status === 'running') {
// The local subscriber was intentionally detached. Remove the local
// marker so sessions.js can attach /api/chat/resume and render the
// buffered structured events from the server.
_backgroundStreams.delete(sessionId);
_syncForegroundStreamGlobals();
}
}
// Tag short single-line code blocks with .pre-compact so the CSS can
// render the Run/Edit/Copy buttons as a slim row that doesn't make a
// 1-line bash block taller than its own contents.
function _markCompactPre(pre) {
const code = pre.querySelector('code');
if (!code) return;
const txt = code.textContent || '';
// Count visible lines — ignore trailing newline (common with fenced
// blocks) and treat any empty extra line as not a real second line.
const lines = txt.replace(/\n+$/, '').split('\n');
const compact = lines.length <= 1 && txt.length < 200;
pre.classList.toggle('pre-compact', compact);
}
function _scanCompactPres(root) {
if (!root || !root.querySelectorAll) return;
root.querySelectorAll('pre').forEach(_markCompactPre);
}
// Global observer so any added anywhere in the app (chat stream,
// chat re-renders, document library chat previews, slash commands,
// research previews, etc.) gets tagged without each call site needing
// to remember.
(function _initCompactPreObserver() {
if (window._cmpPreObserverWired) return;
window._cmpPreObserverWired = true;
_scanCompactPres(document.body);
const obs = new MutationObserver((muts) => {
for (const m of muts) {
for (const n of m.addedNodes) {
if (n.nodeType !== 1) continue;
if (n.tagName === 'PRE') _markCompactPre(n);
if (n.querySelectorAll) _scanCompactPres(n);
}
}
});
obs.observe(document.body, { childList: true, subtree: true });
})();
/**
* Initialize event listeners
*/
export function initListeners() {
// Global event delegation for copy-code buttons
document.addEventListener('click', (e) => {
const btn = e.target.closest('.copy-code');
if (!btn) return;
e.stopPropagation();
const code = btn.getAttribute('data-code');
if (code && uiModule) {
uiModule.copyToClipboard(code);
// Visual feedback: swap the icon to a checkmark (regular size)
// and add .copied which the CSS uses to flash green + pulse.
// For slim/.pre-compact buttons the label text comes from a
// CSS ::before — swap it via data-state so we don't break the
// text-button layout.
const origHTML = btn.innerHTML;
const isCompact = !!btn.closest('pre.pre-compact');
if (!isCompact) {
btn.innerHTML = '';
}
btn.classList.add('copied');
btn.dataset.state = 'copied';
setTimeout(() => {
if (!isCompact) btn.innerHTML = origHTML;
btn.classList.remove('copied');
delete btn.dataset.state;
}, 1500);
}
});
// Run code button delegation
document.addEventListener('click', (e) => {
const btn = e.target.closest('.run-code');
if (!btn) return;
e.stopPropagation();
if (codeRunnerModule) codeRunnerModule.run(btn);
});
// Edit code button delegation — toggle contentEditable on the code element
document.addEventListener('click', (e) => {
const btn = e.target.closest('.edit-code');
if (!btn) return;
e.stopPropagation();
const pre = btn.closest('pre');
if (!pre) return;
const codeEl = pre.querySelector('code');
if (!codeEl) return;
const isEditing = codeEl.contentEditable !== 'false' && codeEl.contentEditable !== 'inherit';
if (isEditing) {
// Save: exit edit mode, update data-code on copy/run buttons
codeEl.contentEditable = 'false';
codeEl.classList.remove('editing');
pre.classList.remove('editing');
const newCode = codeEl.textContent;
const copyBtn = pre.querySelector('.copy-code');
if (copyBtn) copyBtn.setAttribute('data-code', newCode);
const runBtn = pre.querySelector('.run-code');
if (runBtn) runBtn.setAttribute('data-code', newCode);
// Swap icon back to pencil
btn.innerHTML = '';
btn.title = 'Edit';
btn.classList.remove('active');
} else {
// Enter edit mode. Firefox (especially on mobile) historically lacks
// contentEditable="plaintext-only" — setting it there leaves the block
// non-editable, so the tap "just gets a checkmark" with no way to type.
// Fall back to "true" when plaintext-only didn't take.
try { codeEl.contentEditable = 'plaintext-only'; } catch (_) { /* unsupported value */ }
if (codeEl.contentEditable !== 'plaintext-only') codeEl.contentEditable = 'true';
codeEl.classList.add('editing');
pre.classList.add('editing');
// preventScroll keeps the page from jumping to the codeblock when
// focusing the editable on mobile — the browser would otherwise
// scroll it into view above the keyboard, which reads as "auto-
// scroll triggered by clicking Edit".
try { codeEl.focus({ preventScroll: true }); } catch (_) { codeEl.focus(); }
// Swap icon to checkmark
btn.innerHTML = '';
btn.title = 'Done editing';
btn.classList.add('active');
}
});
// Tapping a code block body (not its buttons) toggles the overlay
// copy/edit/run buttons, which otherwise cover the text on mobile.
document.addEventListener('click', (e) => {
if (e.target.closest('.copy-code, .edit-code, .run-code')) return;
const pre = e.target.closest('pre');
if (!pre || !pre.querySelector('.copy-code')) return;
// Don't hide while editing — the buttons (incl. the Done checkmark) matter.
if (pre.classList.contains('editing')) return;
pre.classList.toggle('buttons-hidden');
});
// Position copy/run buttons top or bottom based on viewport position
// — DESKTOP ONLY. On mobile this was constantly retriggering on tap
// (synthetic mouseenter) and made the buttons jump, so the user's
// finger landed on the moved target. Keep them pinned at the top on
// touch — no auto-repositioning.
document.addEventListener('mouseenter', (e) => {
if (window.matchMedia('(max-width: 768px)').matches) return;
const pre = e.target.closest ? e.target.closest('pre') : null;
if (!pre || pre.dataset.btnPosComputed) return;
const rect = pre.getBoundingClientRect();
const threshold = window.innerHeight * 0.35;
const isBottom = rect.top < threshold;
const copyBtn = pre.querySelector('.copy-code');
if (copyBtn) copyBtn.classList.toggle('bottom', isBottom);
const editBtn = pre.querySelector('.edit-code');
if (editBtn) editBtn.classList.toggle('bottom', isBottom);
const runBtn = pre.querySelector('.run-code');
if (runBtn) runBtn.classList.toggle('bottom', isBottom);
pre.dataset.btnPosComputed = '1';
}, true);
// A hidden browser tab may throttle timers and delivery for an arbitrary
// amount of time. The detached backend run is authoritative, so becoming
// visible must never abort an otherwise healthy run. Buffered SSE data will
// catch up naturally; genuine connection failures use resumeStream(), and
// the status probe only unlocks the composer when the server confirms that
// no run exists.
document.addEventListener('visibilitychange', () => {
if (document.visibilityState !== 'visible') {
for (const active of _activeStreams.values()) active.wasAway = true;
return;
}
_restoreQueuedRequestsForCurrentSession();
_probeStaleLocalStream().then(() => {
_drainQueuedAgentRequests();
}).catch(err => {
console.warn('[tab-recovery] Server status probe failed:', err);
});
});
// On mobile, fade out welcome text when keyboard opens to prevent overlap
if (window.innerWidth <= 768) {
const msgInput = document.getElementById('message');
if (msgInput) {
msgInput.addEventListener('focus', () => {
const ws = document.getElementById('welcome-screen');
if (ws && !ws.classList.contains('hidden')) {
ws.classList.add('kb-hidden');
}
});
msgInput.addEventListener('blur', () => {
const ws = document.getElementById('welcome-screen');
if (ws && !ws.classList.contains('hidden')) {
// Delay re-show so tapping within chatbox doesn't flash
setTimeout(() => {
if (document.activeElement !== msgInput) {
ws.classList.remove('kb-hidden');
}
}, 200);
}
});
}
// Smooth viewport resize when keyboard opens/closes
if (window.visualViewport) {
window.visualViewport.addEventListener('resize', () => {
document.documentElement.style.setProperty('--vh', window.visualViewport.height + 'px');
});
document.documentElement.style.setProperty('--vh', window.visualViewport.height + 'px');
}
}
// If the browser discarded and restored this tab, reload the current session
// so the user sees the server-saved partial response instead of a blank page
if (document.wasDiscarded) {
console.warn('[tab-recovery] Tab was discarded by browser — reloading session');
setTimeout(() => {
var _sid = sessionModule && sessionModule.getCurrentSessionId();
if (_sid) sessionModule.selectSession(_sid);
}, 500);
}
}
/**
* Regenerate response: truncate history to the user message before this AI message,
* then re-submit that user message.
*/
/**
* Edit a user message: show an input, truncate to before it, resubmit the edited text.
*/
export async function editUserMessage(userMsgElement) {
const box = document.getElementById('chat-history');
const allMsgs = Array.from(box.querySelectorAll('.msg'));
const msgIndex = allMsgs.indexOf(userMsgElement);
if (msgIndex < 0) return;
const bodyEl = userMsgElement.querySelector('.body');
let currentText = (userMsgElement.dataset.raw || (bodyEl ? bodyEl.textContent : '') || '').trim();
currentText = currentText.replace(/\s*\[\d+ attachment\(s\)\]$/, '');
// Replace body with an editable textarea
const editor = document.createElement('textarea');
editor.className = 'edit-textarea';
editor.value = currentText;
editor.rows = Math.max(2, currentText.split('\n').length);
const btnRow = document.createElement('div');
btnRow.style.cssText = 'display:flex; gap:6px; margin-top:4px;';
const saveBtn = document.createElement('button');
saveBtn.className = 'edit-save-btn';
saveBtn.type = 'button';
saveBtn.title = 'Send edited message';
saveBtn.innerHTML = 'Send';
const cancelBtn = document.createElement('button');
cancelBtn.className = 'edit-cancel-btn';
cancelBtn.type = 'button';
cancelBtn.title = 'Cancel editing';
cancelBtn.innerHTML = 'Cancel';
btnRow.appendChild(saveBtn);
btnRow.appendChild(cancelBtn);
const originalHTML = bodyEl.innerHTML;
bodyEl.innerHTML = '';
bodyEl.appendChild(editor);
bodyEl.appendChild(btnRow);
editor.focus();
cancelBtn.addEventListener('click', (e) => {
e.stopPropagation();
bodyEl.innerHTML = originalHTML;
});
saveBtn.addEventListener('click', async (e) => {
e.stopPropagation();
const newText = editor.value.trim();
if (!newText) return;
const sessionId = sessionModule.getCurrentSessionId();
if (!sessionId) return;
const keepCount = msgIndex;
try {
await fetch(`${API_BASE}/api/session/${sessionId}/truncate`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ keep_count: keepCount })
});
// Remove DOM elements from msgIndex onward
for (let i = allMsgs.length - 1; i >= msgIndex; i--) {
allMsgs[i].remove();
}
// Submit the edited text
const messageInput = uiModule.el('message');
messageInput.value = newText;
const submitBtn = document.querySelector('.send-btn');
if (submitBtn) submitBtn.click();
} catch (err) {
console.error('Edit failed:', err);
if (uiModule) uiModule.showError('Edit failed: ' + err.message);
bodyEl.innerHTML = originalHTML;
}
});
// Also submit on Enter (without shift)
editor.addEventListener('keydown', (e) => {
const isMobile = window.innerWidth <= 768
if (e.key === 'Enter' && !e.shiftKey && !e.isComposing && !isMobile) {
e.preventDefault();
saveBtn.click();
}
});
}
/**
* Resend a user message. By default this replaces from the selected user turn
* so failed attempts do not remain in model context or SFT traces. Callers can
* opt into append-only behavior with `{ append: true }`.
*/
export async function resendUserMessage(userMsgElement, opts = {}) {
const appendOnly = Boolean(opts && opts.append);
const replaceFromHere = !appendOnly || Boolean(opts && opts.replaceFromHere);
const box = document.getElementById('chat-history');
const allMsgs = Array.from(box.querySelectorAll('.msg'));
const msgIndex = allMsgs.indexOf(userMsgElement);
if (msgIndex < 0) return;
// Prefer dataset.raw (stripped original user text) over .body.textContent
// — the latter slurps the rendered "View image description" collapsible
// content too, which would then be sent back as the user's question and
// the AI would reply to that gibberish instead of the actual prompt.
const bodyEl = userMsgElement.querySelector('.body');
let text = (userMsgElement.dataset.raw || (bodyEl ? bodyEl.textContent : '') || '').trim();
text = text.replace(/\s*\[\d+ attachment\(s\)\]$/, '');
// Collect file_ids attached to this user message so the resend re-carries
// the photos / docs (and the chat handler picks up the user-edited OCR
// text cached server-side under those file ids).
const _attachEls = userMsgElement.querySelectorAll('[data-file-id]');
let _ids = Array.from(_attachEls).map(el => el.dataset.fileId).filter(Boolean);
if (!_ids.length) {
const _imgs = userMsgElement.querySelectorAll('.attach-image-preview img, .attach-card img');
for (const _im of _imgs) {
const _m = (_im.getAttribute('src') || '').match(/\/api\/upload\/([A-Za-z0-9_\-]+)/);
if (_m && _m[1] && !_ids.includes(_m[1])) _ids.push(_m[1]);
}
}
// Rescue: legacy bubbles may have stored the filename as the message
// content (artifact of earlier broken resends). Don't re-send that as
// the user prompt if we still have the file attached. Loosen the regex
// to cover real-world camera/screenshot names with spaces, parens,
// multi-dots: "Screen Shot 2026-05-28 at 4.05.32 PM.png", "IMG (1).JPG".
if (text && _ids.length && /^[^\n\r]{1,200}\.(png|jpe?g|gif|webp|svg|bmp|heic|heif)$/i.test(text)) {
text = '';
}
// Empty text + no attachments → tell the user instead of silently bailing.
// The common case is a regen during a pre-upload race where the bubble
// never had an `[data-file-id]` to scrape.
if (!text && !_ids.length) {
if (uiModule?.showError) uiModule.showError('Nothing to resend — message has no text and no attachments yet (try again after the upload finishes).');
return;
}
const sessionId = sessionModule.getCurrentSessionId();
if (!sessionId) return;
try {
if (replaceFromHere) {
// Resend/regenerate trims history to this point before resubmitting so
// the replacement request is the only copy the backend sees.
const keepCount = msgIndex;
const beforeMsgId = userMsgElement.dataset.dbId || '';
const truncateBody = beforeMsgId ? { before_msg_id: beforeMsgId } : { keep_count: keepCount };
const truncateRes = await fetch(`${API_BASE}/api/session/${sessionId}/truncate`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(truncateBody)
});
if (!truncateRes.ok) throw new Error('Server error ' + truncateRes.status);
// Drop the selected user turn and every rendered trace after it,
// including agent-thread tool history that is not a `.msg` bubble.
let node = userMsgElement;
while (node) {
const prev = node;
node = node.nextElementSibling;
prev.remove();
}
}
_pendingRegenAttachments = _ids;
// Resubmit
const messageInput = uiModule.el('message');
messageInput.value = text;
const submitBtn = document.querySelector('.send-btn');
if (submitBtn) submitBtn.click();
} catch (err) {
console.error('Resend failed:', err);
if (uiModule) uiModule.showError('Resend failed: ' + err.message);
}
}
export async function regenerateFrom(aiMsgElement) {
const box = document.getElementById('chat-history');
const allMsgs = Array.from(box.querySelectorAll('.msg'));
const aiIndex = allMsgs.indexOf(aiMsgElement);
if (aiIndex < 0) return;
// Find the preceding user message
let userIndex = -1;
let userText = '';
let userMsgEl = null;
for (let i = aiIndex - 1; i >= 0; i--) {
if (allMsgs[i].classList.contains('msg-user')) {
userIndex = i;
userMsgEl = allMsgs[i];
// Prefer dataset.raw (set by addMessage with the stripped, original
// user text) over the rendered body's textContent — the latter
// pulls in the "View image description" collapsible content too,
// duplicating the OCR text on regen.
const bodyEl = userMsgEl.querySelector('.body');
userText = (userMsgEl.dataset.raw || (bodyEl ? bodyEl.textContent : '') || '').trim();
userText = userText.replace(/\s*\[\d+ attachment\(s\)\]$/, '');
break;
}
}
if (userIndex < 0) {
if (uiModule) uiModule.showError('Could not find the user message to regenerate');
return;
}
// Collect any file_ids attached to the original user message so the
// regenerated send re-uses them. Without this the AI is regenerated on
// text alone — photos (and the user-edited OCR text cached server-side
// under that file_id) would be silently dropped.
const _attachEls = userMsgEl ? userMsgEl.querySelectorAll('[data-file-id]') : [];
let _regenIds = Array.from(_attachEls).map(el => el.dataset.fileId).filter(Boolean);
// Fallback for bubbles rendered before the data-file-id stamp landed:
// sniff the file id straight out of any `.attach-image-preview img`
// src URLs (matches /api/upload/). Otherwise an older bubble would
// regen with zero attachments and the photo would be lost from the
// resulting message even though the file still exists on disk.
if (!_regenIds.length && userMsgEl) {
const _imgs = userMsgEl.querySelectorAll('.attach-image-preview img, .attach-card img');
for (const _im of _imgs) {
const _m = (_im.getAttribute('src') || '').match(/\/api\/upload\/([A-Za-z0-9_\-]+)/);
if (_m && _m[1] && !_regenIds.includes(_m[1])) _regenIds.push(_m[1]);
}
}
_pendingRegenAttachments = _regenIds;
// Rescue: earlier-version regens (before the dataset.raw fix) stored the
// photo's filename as the user-message content. On a follow-up regen,
// that filename would be sent back as the literal user prompt, so the
// AI thinks the question is "blue_night_preview.jpg" and replies "that's
// an image file". If userText is just a bare image filename and we have
// attachments, drop it so the OCR text (or the image bytes for vision
// models) is what the model actually sees.
if (userText && _pendingRegenAttachments.length &&
/^[^\n\r]{1,200}\.(png|jpe?g|gif|webp|svg|bmp|heic|heif)$/i.test(userText.trim())) {
userText = '';
}
// A photo-only message has empty user text — regen must still proceed,
// because the attachments themselves are the message. Bail only if there
// is no text AND no attachments to send.
if (!userText && !_pendingRegenAttachments.length) {
if (uiModule) uiModule.showError('Nothing to regenerate — the user message has no text and no attachments');
return;
}
const sessionId = sessionModule.getCurrentSessionId();
if (!sessionId) return;
// Save current response as a variant
const oldRaw = aiMsgElement.dataset.raw || aiMsgElement.querySelector('.body')?.textContent || '';
const oldHtml = aiMsgElement.querySelector('.body')?.innerHTML || '';
let variants = [];
try { variants = JSON.parse(aiMsgElement.dataset.variants || '[]'); } catch(_) {}
if (variants.length === 0) {
// First regen — save the original as variant 0
variants.push({ raw: oldRaw, html: oldHtml, label: 'original' });
}
const keepCount = userIndex;
try {
await fetch(`${API_BASE}/api/session/${sessionId}/truncate`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ keep_count: keepCount })
});
// Keep the original user bubble, but remove every rendered trace after
// it, including agent-thread tool history between the user and AI bubble.
let node = userMsgEl.nextElementSibling;
while (node) {
const prev = node;
node = node.nextElementSibling;
prev.remove();
}
// The old AI message was removed from DOM — it will be replaced by the new streaming response
// But first, stash the variants data so we can transfer it to the new element
_pendingVariants = variants;
_pendingVariantLabel = 'regen';
_hideUserBubble = true;
const messageInput = uiModule.el('message');
messageInput.value = userText;
const submitBtn = document.querySelector('.send-btn');
if (submitBtn) submitBtn.click();
} catch (err) {
console.error('Regenerate failed:', err);
if (uiModule) uiModule.showError('Regenerate failed: ' + err.message);
}
}
// Pending variants from a regeneration — transferred to new streaming element
let _pendingVariants = null;
let _pendingVariantLabel = null;
// File-ids carried over from the original user message during a regen, so
// photos / OCR overrides survive into the new send. Consumed once.
let _pendingRegenAttachments = null;
/**
* Called after streaming completes to attach variant navigation if this was a regen.
*/
function _attachVariantNav(msgElement) {
if (!_pendingVariants) return;
const variants = _pendingVariants;
_pendingVariants = null;
// Add the new response as the latest variant
const newRaw = msgElement.dataset.raw || msgElement.querySelector('.body')?.textContent || '';
const newHtml = msgElement.querySelector('.body')?.innerHTML || '';
const varLabel = _pendingVariantLabel || 'regen';
_pendingVariantLabel = null;
variants.push({ raw: newRaw, html: newHtml, label: varLabel });
msgElement.dataset.variants = JSON.stringify(variants);
msgElement.dataset.variantIndex = String(variants.length - 1);
_renderVariantNav(msgElement, variants, variants.length - 1);
// Persist variants to server
const sid = sessionModule.getCurrentSessionId();
if (sid) {
fetch(`${API_BASE}/api/session/${sid}/update-last-meta`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ metadata: { variants: variants, variantIndex: variants.length - 1 } })
}).catch(e => console.warn('update-last-meta (variants) failed:', e));
}
}
const _VARIANT_ICONS = { regen: '\u21BB', shorter: '\u2702', simpler: '?', original: '\u25CB' };
function _variantTagText(label) {
return _VARIANT_ICONS[label] || _VARIANT_ICONS['original'];
}
function _renderVariantNav(msgElement, variants, currentIdx) {
// Remove existing nav if any
const old = msgElement.querySelector('.variant-nav');
if (old) old.remove();
if (variants.length < 2) return;
const nav = document.createElement('span');
nav.className = 'variant-nav';
nav.addEventListener('click', (e) => e.stopPropagation());
// Label showing what this variant is
// Divider
const divider = document.createElement('span');
divider.className = 'variant-divider';
divider.textContent = '|';
nav.appendChild(divider);
// Label
const curVariant = variants[currentIdx];
const tagLabel = document.createElement('span');
tagLabel.className = 'variant-tag' + (curVariant?.label === 'shorter' ? ' variant-tag-scissors' : '');
tagLabel.textContent = _variantTagText(curVariant?.label);
nav.appendChild(tagLabel);
// < button
const prevBtn = document.createElement('button');
prevBtn.className = 'variant-btn';
prevBtn.textContent = '<';
prevBtn.disabled = currentIdx === 0;
prevBtn.addEventListener('click', (e) => { e.stopPropagation(); _switchVariant(msgElement, variants, currentIdx - 1); });
nav.appendChild(prevBtn);
// Clickable number for current index (click left number = go left, right = go right)
const numLeft = document.createElement('button');
numLeft.className = 'variant-num';
numLeft.textContent = String(currentIdx + 1);
numLeft.disabled = currentIdx === 0;
numLeft.addEventListener('click', (e) => { e.stopPropagation(); _switchVariant(msgElement, variants, currentIdx - 1); });
nav.appendChild(numLeft);
const slash = document.createElement('span');
slash.className = 'variant-slash';
slash.textContent = '/';
nav.appendChild(slash);
const numRight = document.createElement('button');
numRight.className = 'variant-num';
numRight.textContent = String(variants.length);
numRight.disabled = currentIdx === variants.length - 1;
numRight.addEventListener('click', (e) => { e.stopPropagation(); _switchVariant(msgElement, variants, currentIdx + 1); });
nav.appendChild(numRight);
// > button
const nextBtn = document.createElement('button');
nextBtn.className = 'variant-btn';
nextBtn.textContent = '>';
nextBtn.disabled = currentIdx === variants.length - 1;
nextBtn.addEventListener('click', (e) => { e.stopPropagation(); _switchVariant(msgElement, variants, currentIdx + 1); });
nav.appendChild(nextBtn);
// Insert into the .role header
const roleEl = msgElement.querySelector('.role');
if (roleEl) {
roleEl.appendChild(nav);
} else {
msgElement.appendChild(nav);
}
}
function _switchVariant(msgElement, variants, newIdx) {
if (newIdx < 0 || newIdx >= variants.length) return;
const v = variants[newIdx];
const body = msgElement.querySelector('.body');
if (body) body.innerHTML = v.html;
msgElement.dataset.raw = v.raw;
msgElement.dataset.variantIndex = String(newIdx);
if (window.hljs) {
msgElement.querySelectorAll('pre code').forEach(block => window.hljs.highlightElement(block));
}
_renderVariantNav(msgElement, variants, newIdx);
// Persist selected variant to server
const sid = sessionModule.getCurrentSessionId();
if (sid) {
fetch(`${API_BASE}/api/session/${sid}/update-last-meta`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ metadata: { variantIndex: newIdx } })
}).catch(e => console.warn('update-last-meta (variantIndex) failed:', e));
}
}
export async function forkFrom(aiMsgElement) {
const box = document.getElementById('chat-history');
const allMsgs = Array.from(box.querySelectorAll('.msg'));
const aiIndex = allMsgs.indexOf(aiMsgElement);
if (aiIndex < 0) return;
const sessionId = sessionModule.getCurrentSessionId();
if (!sessionId) return;
const keepCount = aiIndex + 1;
try {
const res = await fetch(`${API_BASE}/api/session/${sessionId}/fork`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ keep_count: keepCount }),
});
if (!res.ok) throw new Error(await res.text());
const data = await res.json();
await sessionModule.loadSessions();
await sessionModule.selectSession(data.id);
if (uiModule) uiModule.showToast(`Forked → ${data.name}`);
} catch (err) {
console.error('Fork failed:', err);
if (uiModule) uiModule.showError('Fork failed: ' + err.message);
}
}
/**
* Check for pending/completed research after page refresh or session switch.
* If research is still running, show a spinner and poll until done.
* If research is done, fetch result and render it.
*/
export async function checkPendingResearch(sessionId) {
if (!sessionId) return;
try {
const res = await fetch(`${API_BASE}/api/research/status/${sessionId}`);
if (!res.ok) {
if (sessionModule && sessionModule.clearResearching) sessionModule.clearResearching(sessionId);
return; // 404 = no research for this session
}
const data = await res.json();
if (data.status === 'done') {
// Fetch and render the completed result
_notifyResearchComplete(sessionId, data.query || '');
if (sessionModule && sessionModule.clearResearching) sessionModule.clearResearching(sessionId);
const resultRes = await fetch(`${API_BASE}/api/research/result/${sessionId}`, { method: 'POST' });
if (resultRes.ok) {
const resultData = await resultRes.json();
if (resultData.result) {
// Skip if history already has a research message for this session
if (document.querySelector(`#chat-history .msg-ai[data-research-session="${sessionId}"]`)) return;
var srcBox = '';
if (resultData.sources && resultData.sources.length > 0) {
srcBox = _buildSourcesBox(resultData.sources, 'research');
}
var findingsBox = chatRenderer.buildFindingsBox(resultData.raw_findings);
var cleanResult = resultData.result;
// Build DOM directly to avoid double-processing through addMessage
chatRenderer.hideWelcomeScreen();
var _box = document.getElementById('chat-history');
if (_box) {
var _wrap = document.createElement('div');
_wrap.className = 'msg msg-ai';
_wrap.dataset.researchSession = sessionId;
var _role = document.createElement('div');
_role.className = 'role';
var _meta = sessionModule.getSessions().find(function(s) { return s.id === sessionId; });
_role.textContent = _shortModel(_meta?.model);
_applyModelColor(_role, _meta?.model);
_role.appendChild(chatRenderer.roleTimestamp());
var _body = document.createElement('div');
_body.className = 'body';
_body.innerHTML = srcBox + markdownModule.processWithThinking(
markdownModule.squashOutsideCode(cleanResult)
) + findingsBox;
_wrap.dataset.raw = cleanResult;
_wrap.appendChild(_role);
_wrap.appendChild(_body);
_wrap.appendChild(chatRenderer.createMsgFooter(_wrap));
_appendViewReportLink(_wrap, sessionId);
_box.appendChild(_wrap);
if (window.hljs) _wrap.querySelectorAll('pre code').forEach(function(b) { window.hljs.highlightElement(b); });
uiModule.scrollHistory();
}
}
}
return;
}
if (data.status !== 'running') return;
// Don't show reconnect UI if we've already switched away
if (sessionModule.getCurrentSessionId() !== sessionId) return;
// Research is still running — show reconnect UI with spinner
const box = document.getElementById('chat-history');
if (!box) return;
const holder = document.createElement('div');
holder.className = 'msg msg-ai research-reconnect';
holder.dataset.researchSession = sessionId;
const roleTs = new Date().toLocaleTimeString([], {hour: '2-digit', minute:'2-digit'});
const agentMeta = sessionModule.getSessions().find(s => s.id === sessionModule.getCurrentSessionId());
const agentModelLabel = _shortModel(agentMeta?.model);
holder.innerHTML = `${uiModule.esc(agentModelLabel)} `;
_applyModelColor(holder.querySelector('.role'), agentMeta?.model);
box.appendChild(holder);
const bodyDiv = holder.querySelector('.body');
const spinner = spinnerModule.create('Reconnecting to research...', 'right');
bodyDiv.appendChild(spinner.createElement());
spinner.start();
// Update spinner with current progress if available
function updateSpinnerFromProgress(progress) {
if (!progress || !progress.phase) return;
const rp = progress;
if (rp.phase === 'probing') {
spinner.updateMessage(`Verifying model: ${rp.model || '?'}`);
} else if (rp.phase === 'planning') {
spinner.updateMessage('Analyzing question & planning research strategy');
} else if (rp.phase === 'searching') {
const q = rp.queries ? `${rp.queries} queries` : '';
const s = rp.total_sources ? ` · ${rp.total_sources} sources` : '';
spinner.updateMessage(`Round ${rp.round || '?'}: Searching${q ? ' (' + q + ')' : ''}${s}`);
} else if (rp.phase === 'reading') {
spinner.updateMessage(rp.title ? `Reading: ${rp.title}` : `Round ${rp.round || '?'}: Reading ${rp.new_sources || ''} pages · ${rp.total_sources || 0} sources total`);
} else if (rp.phase === 'analyzing') {
spinner.updateMessage(`Round ${rp.round || '?'}: Analyzing ${rp.total_findings || 0} findings`);
} else if (rp.phase === 'writing') {
spinner.updateMessage(`Writing report · ${rp.total_sources || 0} sources`);
}
}
updateSpinnerFromProgress(data.progress);
_researchingStreamIds.add(sessionId);
if (sessionModule && sessionModule.markResearching) sessionModule.markResearching(sessionId);
// Restore research timer from started_at
if (data.started_at && spinner && spinner.element) {
_researchStartTime = data.started_at * 1000;
_researchAvgDuration = data.avg_duration || null;
_researchTimerEl = document.createElement('div');
_researchTimerEl.className = 'research-timer';
_researchTimerEl.style.cssText = 'font-size:0.8em; opacity:0.6; margin-top:4px; font-family:monospace;';
spinner.element.parentNode.insertBefore(_researchTimerEl, spinner.element.nextSibling);
_researchTimerInterval = setInterval(() => {
if (!_researchTimerEl) return;
var elapsed = Math.floor((Date.now() - _researchStartTime) / 1000);
var mm = String(Math.floor(elapsed / 60)).padStart(2, '0');
var ss = String(elapsed % 60).padStart(2, '0');
var txt = mm + ':' + ss;
if (_researchAvgDuration) {
var avgM = String(Math.floor(_researchAvgDuration / 60)).padStart(2, '0');
var avgS = String(Math.round(_researchAvgDuration % 60)).padStart(2, '0');
txt += ' / avg ' + avgM + ':' + avgS;
}
_researchTimerEl.textContent = txt;
}, 1000);
// Reconnect synapse — seed it with whatever progress is already known
try {
_researchSynapse = createResearchSynapse(spinner.element.parentNode, {
query: data.query || '',
startedAt: _researchStartTime,
});
if (_researchSynapse.element && _researchTimerEl) {
spinner.element.parentNode.insertBefore(_researchSynapse.element, _researchTimerEl);
}
if (data.progress) {
_researchSynapse.setPhase(data.progress.phase, data.progress);
if (typeof data.progress.round === 'number') _researchSynapse.setRound(data.progress.round);
if (typeof data.progress.total_sources === 'number') _researchSynapse.setSourceCount(data.progress.total_sources);
}
} catch (e) { console.warn('synapse reconnect failed', e); }
}
// Poll for completion
const pollInterval = setInterval(async () => {
// Stop polling if user switched to a different session
if (sessionModule.getCurrentSessionId() !== sessionId) {
clearInterval(pollInterval);
spinner.destroy();
_clearResearchTimer();
if (holder.parentNode) holder.remove();
_researchingStreamIds.delete(sessionId);
if (_researchingStreamIds.size === 0) {
var _rToggleP = document.getElementById('research-toggle-btn');
if (_rToggleP) _rToggleP.classList.remove('research-running');
}
return;
}
try {
const pollRes = await fetch(`${API_BASE}/api/research/status/${sessionId}`);
if (!pollRes.ok) {
clearInterval(pollInterval);
spinner.destroy();
_clearResearchTimer();
_researchingStreamIds.delete(sessionId);
if (sessionModule && sessionModule.clearResearching) sessionModule.clearResearching(sessionId);
return;
}
const pollData = await pollRes.json();
updateSpinnerFromProgress(pollData.progress);
if (_researchSynapse && pollData.progress) {
_researchSynapse.setPhase(pollData.progress.phase, pollData.progress);
if (typeof pollData.progress.round === 'number') _researchSynapse.setRound(pollData.progress.round);
if (typeof pollData.progress.total_sources === 'number') _researchSynapse.setSourceCount(pollData.progress.total_sources);
}
if (pollData.status !== 'running') {
clearInterval(pollInterval);
spinner.destroy();
_clearResearchTimer();
_researchingStreamIds.delete(sessionId);
if (sessionModule && sessionModule.clearResearching) sessionModule.clearResearching(sessionId);
if (pollData.status === 'done') {
_notifyResearchComplete(sessionId, data.query || '');
const rRes = await fetch(`${API_BASE}/api/research/result/${sessionId}`, { method: 'POST' });
if (rRes.ok) {
const rData = await rRes.json();
if (rData.result) {
var srcHtml = '';
if (rData.sources && rData.sources.length > 0) {
srcHtml = _buildSourcesBox(rData.sources, 'research');
}
var findingsHtml = chatRenderer.buildFindingsBox(rData.raw_findings);
bodyDiv.innerHTML = srcHtml + markdownModule.processWithThinking(
markdownModule.squashOutsideCode(rData.result)
) + findingsHtml;
holder.dataset.raw = rData.result;
_appendViewReportLink(holder, sessionId);
if (window.hljs) {
holder.querySelectorAll('pre code').forEach(b => window.hljs.highlightElement(b));
}
}
}
} else {
bodyDiv.innerHTML = '[Research ' + pollData.status + ']';
}
}
} catch (e) {
console.error('Research poll error:', e);
}
}, 2000);
} catch (e) {
// No research pending, that's fine
}
}
/** Set a display override for the next user message bubble */
export function setDisplayOverride(text) {
_displayOverride = text;
}
/** Hide the user bubble for the next submit (e.g. continue after stop) */
export function setHideUserBubble() {
_hideUserBubble = true;
}
/** Set the AI element to merge with the next streamed response (continue after stop) */
export function setPendingContinue(el) {
_pendingContinue = el;
}
/**
* Delete an AI message and its preceding user message from the conversation.
*/
export async function deleteMessage(msgElement) {
if (uiModule && uiModule.styledConfirm) {
const ok = await uiModule.styledConfirm('Delete this message?', {
confirmText: 'Delete',
cancelText: 'Cancel',
danger: true,
});
if (!ok) return;
}
const box = document.getElementById('chat-history');
const allMsgs = Array.from(box.querySelectorAll('.msg'));
const clickedIndex = allMsgs.indexOf(msgElement);
if (clickedIndex < 0) return;
// No early-out on a missing session: an output shown before any model was
// selected (issue #1428) has no session/persisted rows, but its "x" must
// still remove it. We only need the session id for the server-side delete
// below; without one we fall back to removing the DOM.
const sessionId = sessionModule.getCurrentSessionId();
const clickedIsUser = msgElement.classList.contains('msg-user');
// Find the user+AI pair
let userIndex = -1;
let aiIndex = -1;
if (clickedIsUser) {
userIndex = clickedIndex;
// Find the following AI message
for (let i = clickedIndex + 1; i < allMsgs.length; i++) {
if (allMsgs[i].classList.contains('msg-ai') && !allMsgs[i].classList.contains('msg-continuation')) {
aiIndex = i;
break;
}
if (allMsgs[i].classList.contains('msg-user')) break; // next user msg, no AI response
}
} else {
// If clicked on a continuation, walk back to the main AI message
let mainAiIndex = clickedIndex;
if (allMsgs[mainAiIndex].classList.contains('msg-continuation')) {
for (let i = mainAiIndex - 1; i >= 0; i--) {
if (allMsgs[i].classList.contains('msg-ai') && !allMsgs[i].classList.contains('msg-continuation')) {
mainAiIndex = i;
break;
}
}
}
aiIndex = mainAiIndex;
// Find the preceding user message
for (let i = aiIndex - 1; i >= 0; i--) {
if (allMsgs[i].classList.contains('msg-user')) {
userIndex = i;
break;
}
}
}
// Collect DB message IDs and DOM elements to remove
const msgIds = [];
const domToRemove = [];
// Add the user message if found
if (userIndex >= 0) {
domToRemove.push(allMsgs[userIndex]);
const uid = allMsgs[userIndex].dataset.dbId;
if (uid) msgIds.push(uid);
}
// Add the AI message if found
if (aiIndex >= 0) {
domToRemove.push(allMsgs[aiIndex]);
const aid = allMsgs[aiIndex].dataset.dbId;
if (aid) msgIds.push(aid);
const aiEl = allMsgs[aiIndex];
// Also remove agent-thread elements BETWEEN user and AI
if (userIndex >= 0) {
let between = allMsgs[userIndex].nextElementSibling;
while (between && between !== aiEl) {
domToRemove.push(between);
between = between.nextElementSibling;
}
}
// Walk forward from the AI element to remove continuations and tool bubbles
let sibling = aiEl.nextElementSibling;
while (sibling) {
if (sibling.classList.contains('msg-user') ||
(sibling.classList.contains('msg-ai') && !sibling.classList.contains('msg-continuation'))) {
break;
}
domToRemove.push(sibling);
sibling = sibling.nextElementSibling;
}
}
if (!msgIds.length || !sessionId) {
// No persisted rows to delete (no DB IDs, or no session at all — e.g. an
// error output shown before a model was selected, #1428). Just remove the
// DOM so the "x" works regardless.
domToRemove.forEach(el => el.remove());
if (uiModule) uiModule.showToast('Message deleted');
return;
}
try {
const res = await fetch(`${API_BASE}/api/session/${sessionId}/delete-messages`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ msg_ids: msgIds })
});
if (!res.ok) throw new Error('Server error ' + res.status);
domToRemove.forEach(el => el.remove());
if (uiModule) uiModule.showToast('Message deleted');
} catch (err) {
console.error('Delete failed:', err);
if (uiModule) uiModule.showError('Delete failed: ' + err.message);
}
}
/**
* Edit an AI message inline. Makes the body contentEditable, saves to DB on confirm.
*/
export async function editAIMessage(msgElement) {
const body = msgElement.querySelector('.body');
if (!body) return;
const isEditing = body.contentEditable === 'true' || body.contentEditable === 'plaintext-only';
if (isEditing) return; // already editing
const originalRaw = msgElement.dataset.raw || body.textContent || '';
// Create editable textarea overlay
const textarea = document.createElement('textarea');
textarea.className = 'msg-edit-textarea';
textarea.value = originalRaw;
textarea.style.width = '100%';
textarea.style.minHeight = Math.max(100, body.offsetHeight) + 'px';
body.style.display = 'none';
body.parentNode.insertBefore(textarea, body.nextSibling);
textarea.focus();
// Add save/cancel bar
const bar = document.createElement('div');
bar.className = 'msg-edit-bar';
const saveBtn = document.createElement('button');
saveBtn.className = 'msg-edit-save';
saveBtn.textContent = 'Save';
const cancelBtn = document.createElement('button');
cancelBtn.className = 'msg-edit-cancel';
cancelBtn.textContent = 'Cancel';
bar.appendChild(saveBtn);
bar.appendChild(cancelBtn);
textarea.parentNode.insertBefore(bar, textarea.nextSibling);
function cleanup() {
textarea.remove();
bar.remove();
body.style.display = '';
}
cancelBtn.addEventListener('click', (e) => {
e.stopPropagation();
cleanup();
});
saveBtn.addEventListener('click', async (e) => {
e.stopPropagation();
const newContent = textarea.value;
if (newContent === originalRaw) { cleanup(); return; }
const msgId = msgElement.dataset.dbId;
if (!msgId) { if (uiModule) uiModule.showError('Cannot edit: message ID not found'); cleanup(); return; }
const sessionId = sessionModule.getCurrentSessionId();
if (!sessionId) { cleanup(); return; }
try {
const res = await fetch(`${API_BASE}/api/session/${sessionId}/edit-message`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ msg_id: msgId, content: newContent }),
});
if (!res.ok) throw new Error('Server error ' + res.status);
// Re-render body with markdown
body.innerHTML = markdownModule.processWithThinking(markdownModule.squashOutsideCode(newContent));
msgElement.dataset.raw = newContent;
// Add edited indicator if not already present
if (!msgElement.querySelector('.edited-indicator')) {
const indicator = document.createElement('div');
indicator.className = 'edited-indicator';
indicator.textContent = '[Message edited]';
body.parentNode.insertBefore(indicator, body.nextSibling);
}
cleanup();
if (uiModule) uiModule.showToast('Message edited');
} catch (err) {
console.error('Edit failed:', err);
if (uiModule) uiModule.showError('Edit failed: ' + err.message);
}
});
}
/**
* Rewrite the AI's last response with a specific instruction.
* Uses the lightweight /api/rewrite endpoint — no tools, no agent loop.
* Just rewrites the text of the last AI bubble.
*/
export async function rewriteWith(aiMsgElement, instruction) {
const sessionId = sessionModule.getCurrentSessionId();
if (!sessionId) return;
// Get the original text from the AI bubble
const oldRaw = aiMsgElement.dataset.raw || aiMsgElement.querySelector('.body')?.textContent || '';
const oldHtml = aiMsgElement.querySelector('.body')?.innerHTML || '';
if (!oldRaw.trim()) {
if (uiModule) uiModule.showError('No text to rewrite');
return;
}
// Save current response as a variant
let variants = [];
try { variants = JSON.parse(aiMsgElement.dataset.variants || '[]'); } catch(_) {}
if (variants.length === 0) {
variants.push({ raw: oldRaw, html: oldHtml, label: 'original' });
}
// Determine label from instruction
let varLabel = 'rewrite';
if (instruction.includes('shorter')) varLabel = 'shorter';
else if (instruction.includes('simpler')) varLabel = 'simpler';
// Clear the bubble and show a whirlpool spinner while we wait for the
// rewrite (replaces the old "Rewriting..." text).
const bodyEl = aiMsgElement.querySelector('.body');
let _rwSpin = null;
if (bodyEl) {
bodyEl.innerHTML = '';
_rwSpin = spinnerModule.createWhirlpool(18);
_rwSpin.element.style.margin = '4px 0';
bodyEl.appendChild(_rwSpin.element);
}
// Stop + detach the spinner (called once real content starts rendering, and
// on the failure path so it never spins forever).
const _killRwSpin = () => { if (_rwSpin) { try { _rwSpin.destroy(); } catch (_) {} _rwSpin = null; } };
try {
const res = await fetch(`${API_BASE}/api/rewrite`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
session_id: sessionId,
original_text: oldRaw,
instruction: instruction,
}),
});
if (!res.ok) {
throw new Error(`HTTP ${res.status}`);
}
const reader = res.body.getReader();
const decoder = new TextDecoder();
let buffer = '';
let newText = '';
while (true) {
const { done, value } = await reader.read();
if (done) break;
buffer += decoder.decode(value, { stream: true });
const lines = buffer.split('\n');
buffer = lines.pop() || '';
for (const line of lines) {
if (!line.startsWith('data: ')) continue;
const payload = line.slice(6).trim();
if (payload === '[DONE]') continue;
try {
const data = JSON.parse(payload);
// The endpoint streams `event: error\ndata: {error,status}` on
// failure — surface it instead of silently hanging on "Rewriting…".
if (data.error) {
throw new Error(data.error || ('HTTP ' + (data.status || 500)));
}
// Reasoning tokens (vLLM --reasoning-parser: Qwen3 / DeepSeek-R1)
// arrive as separate {delta, thinking:true} chunks. They are NOT
// the rewrite — fold them away so they don't pollute the result.
if (data.thinking) continue;
if (data.delta) {
newText += data.delta;
_killRwSpin();
if (bodyEl) {
bodyEl.innerHTML = markdownModule.processWithThinking(
markdownModule.squashOutsideCode(newText)
);
}
}
} catch (e) {
if (e instanceof Error && e.message) throw e; // re-throw real errors
/* ignore JSON parse noise */
}
}
}
// Strip any thinking markup from the answer. A reasoning model may emit
// an inline … block, a bare