${_escHtml(entry.result || '')}`;
}
}
// Bracketed prefixes like "[Default] No recent emails" — the fan-out across
// accounts joins per-account results. Style them as compact accent tags so
// the activity row reads as "/ blocks: bash output / tracebacks / numbered lists often
// contain "\n[N] ..." sequences that the prefix regex would otherwise mangle.
{
const tagRe = /(^|||\n)\[([^\]\n<>]{1,40})\]\s*/g;
const replaceTags = (s) => s.replace(tagRe, '$1$2 ');
// Split on whole ...
blocks (greedy match per block); only
// transform the outside-of-pre segments. Then do the same for any stray
// inline ... spans inside the surviving outside text.
const parts = resultHtml.split(/()/i);
resultHtml = parts.map((seg, i) => {
if (i % 2 === 1) return seg; // odd indices = the …
chunks, leave intact
const codeParts = seg.split(/()/i);
return codeParts.map((cs, j) => j % 2 === 1 ? cs : replaceTags(cs)).join('');
}).join('');
}
const lineCount = (entry.result || '').split('\n').length;
const long = (entry.result || '').length > 600 || lineCount > 8;
const promptHtml = entry.prompt
? `Prompt
${_escHtml(entry.prompt)}`
: '';
const hue = _categoryHue(entry.taskName, entry.kind);
// CSS vars feed the colored title + accent stripe.
const styleVars = `--cat-hue:${hue};`;
const _runningPlaceholder = /^(Starting…|Starting\.\.\.|_Running…_|_Running\.\.\._|_Queued\b)/i.test((entry.result || '').trim());
const hasResult = !!(entry.result && entry.result.trim() && entry.status !== 'running' && entry.status !== 'queued');
const hasRunningProgress = !!(entry.result && entry.result.trim() && !_runningPlaceholder && (entry.status === 'running' || entry.status === 'queued'));
// "Open in chat" only makes sense for runs whose result is a real assistant
// message (Prompt / Research tasks). Action/event runs are just log lines
// (e.g. "No recent emails", "Tidied N memories") — for those, replace the
// button with "Copy log" so you can grab the text without spawning a chat
// with nothing useful in it.
const _isChatWorthy = entry.kind === 'llm' || entry.kind === 'research';
let actionBtn = '';
if (hasResult && _isChatWorthy) {
actionBtn = ``;
if (entry.kind === 'research' && entry.researchId) {
actionBtn += ``;
}
} else if (hasResult) {
actionBtn = ``;
}
const clearLabel = _taskClearCacheLabel(entry);
if (hasResult && clearLabel && entry.taskId) {
actionBtn += ``;
}
if (hasResult && entry.taskId) {
actionBtn += ``;
}
// Running rows replace the relative-time on the right with "Running NN" + a
// live whirlpool spinner. Queued shows "Queued" the same way (no timer —
// hasn't actually started yet). The elapsed counter ticks every second via
// `_startActivityTimers` after the row is in the DOM.
let rightHtml;
if (_isRunning) {
const isQueued = entry.status === 'queued';
// Initial elapsed for the first paint; the 1s interval below keeps it live.
const startMs = entry.ts ? new Date(entry.ts).getTime() : Date.now();
const stale = !isQueued && (Date.now() - startMs) > 30 * 60 * 1000;
const label = isQueued ? 'Queued' : stale ? 'Still running' : 'Running';
const elapsedInit = isQueued ? '' : `${_fmtElapsed(Date.now() - startMs)}`;
const forceBtn = isQueued && entry.taskId ? `` : '';
const stopBtn = entry.taskId ? `` : '';
rightHtml = `${label}${elapsedInit}${forceBtn}${stopBtn}`;
} else {
rightHtml = `${_escHtml(tsLabel)}`;
}
// Slim variant for skipped (noop) rows — single line, no body, no actions,
// dimmed. The reason (entry.result, e.g. "no pings due") sits inline so
// users can see *why* the row was skipped without expanding anything.
if (_isSkipped) {
const reason = (entry.result || '').trim();
return `
${statusDot}
${_escHtml(entry.taskName)}${_taskAiMark(entry)}
${repeatBadge}
skipped${reason ? ' — ' + _escHtml(reason) : ''}
${_escHtml(tsLabel)}
`;
}
return `
${statusDot}
${_escHtml(entry.taskName)}${_taskAiMark(entry)}
${repeatBadge}
${rightHtml}
${(_isRunning && !hasRunningProgress) ? '' : `${resultHtml}`}
${promptHtml}
${long ? '' : ''}
${actionBtn}
`;
}
function _escHtml(s) {
return String(s == null ? '' : s)
.replace(/&/g, '&').replace(//g, '>')
.replace(/"/g, '"').replace(/'/g, ''');
}
// ---- Main view ----
// Tasks list view state — search query + active category tag + select mode.
let _taskSearch = '';
let _taskFilter = null;
let _taskSort = 'recent';
let _taskSelectMode = false;
const _taskSelected = new Set();
async function _aiDraftTask(inputEl, btnEl) {
const desc = (inputEl.value || '').trim();
if (!desc) { inputEl.focus(); return; }
const origHtml = btnEl.innerHTML;
btnEl.disabled = true;
btnEl.classList.add('spinning');
btnEl.textContent = '';
// Match the Tidy buttons' silent whirlpool spinner.
const _sp = spinnerModule.create('', 'clean', 'whirlpool');
const _spEl = _sp.createElement();
_spEl.style.position = 'relative';
_spEl.style.top = '1px';
btnEl.appendChild(_spEl);
_sp.start();
try {
const res = await fetch(`${API_BASE}/api/tasks/parse`, {
method: 'POST', credentials: 'same-origin',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ description: desc }),
});
const data = await res.json();
if (!data.success || !data.draft) {
if (uiModule) uiModule.showError(data.message || 'Could not draft task');
return;
}
const draft = data.draft;
// The form treats scheduled_time as UTC (it converts UTC→local for the
// picker). The AI returns LOCAL time, so convert local→UTC here for the
// round-trip to land on the intended local time.
if (draft.scheduled_time) {
try { draft.scheduled_time = _localTimeToUtc(draft.scheduled_time); } catch (_) {}
}
// Pass the draft as a synthetic "existing" (no id) → form pre-fills every
// field but still creates via POST on save.
_showForm(draft, draft.task_type, draft.trigger_type || 'schedule');
} catch (e) {
if (uiModule) uiModule.showError('AI draft failed: ' + (e.message || e));
} finally {
try { _sp.stop(); } catch (_) {}
btnEl.classList.remove('spinning');
btnEl.disabled = false;
btnEl.innerHTML = origHtml;
}
}
function _renderMainView() {
const modal = document.getElementById('tasks-modal');
if (!modal) return;
const body = modal.querySelector('.modal-body');
if (!body) return;
body.innerHTML = `
`;
const searchEl = document.getElementById('tasks-search');
if (searchEl) searchEl.addEventListener('input', () => { _taskSearch = searchEl.value; _renderList(); });
const sortEl = document.getElementById('tasks-sort');
if (sortEl) { sortEl.value = _taskSort; sortEl.addEventListener('change', () => { _taskSort = sortEl.value; _renderList(); }); }
const selectBtn = document.getElementById('tasks-select-btn');
if (selectBtn) {
selectBtn.classList.toggle('active', _taskSelectMode);
selectBtn.addEventListener('click', () => _taskSelectMode ? _taskExitSelect() : _taskEnterSelect());
}
document.getElementById('tasks-pause-all-btn')?.addEventListener('click', () => _doToggleAll());
document.getElementById('tasks-select-all')?.addEventListener('change', _taskToggleSelectAll);
document.getElementById('tasks-bulk-cancel')?.addEventListener('click', _taskExitSelect);
document.getElementById('tasks-bulk-delete')?.addEventListener('click', _taskBulkDelete);
_renderList();
_syncPauseAllButton();
// Lazy-load action descriptions so the list can show them under each
// action task. Re-render once they arrive (no-op if already cached).
if (!_builtinActions) {
_fetchActions().then(() => {
if (document.getElementById('tasks-list')) _renderList();
});
}
}
// ---- Modal ----
export function openTasks(focusId) {
if (_open) {
// Already open — just focus the requested task.
if (focusId) _focusTask(focusId);
return;
}
_pendingFocusTaskId = focusId || null;
_open = true;
_tasksCascadeNext = true;
_viewingRuns = null;
_outputTargets = null; // refresh available targets
_builtinActions = null;
_triggerEvents = null;
const modal = document.createElement('div');
modal.className = 'modal';
modal.id = 'tasks-modal';
modal.innerHTML = `
`;
document.body.appendChild(modal);
// Tab routing
modal.querySelectorAll('.tasks-tab').forEach(btn => {
btn.addEventListener('click', () => _switchTab(btn.dataset.tab));
});
// Live clock
function _tickClock() {
const el = document.getElementById('tasks-clock');
if (!el) return;
const now = new Date();
const day = now.toLocaleDateString([], { weekday: 'long' });
const date = now.toLocaleDateString([], { month: 'short', day: 'numeric', year: 'numeric' });
const local = now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' });
el.textContent = `${day}, ${date} · ${local}`;
}
_tickClock();
_clockInterval = setInterval(_tickClock, 1000);
// Make draggable — shared helper handles drag + L/R dock + (none) fs.
{
const content = modal.querySelector('.modal-content');
const header = modal.querySelector('.modal-header');
if (content && header) {
makeWindowDraggable(modal, { content, header });
}
}
// Events
document.getElementById('tasks-close').addEventListener('click', closeTasks);
// "Pause all" + "Select" live in the main-view sub-header now (wired in _renderMainView).
modal.addEventListener('click', (e) => {
if (uiModule.isTouchInsideModal()) return;
if (e.target === modal) closeTasks();
});
_escHandler = (e) => {
if (e.key === 'Escape') {
if (_viewingRuns) {
_viewingRuns = null;
_renderMainView();
return;
}
// If we're on the "Add" tab inside the new-task form (preset already
// picked), step back to the preset picker instead of closing the modal.
// Detect by: Add tab active + the form's name input is mounted.
const _modal = document.getElementById('tasks-modal');
const _addActive = _modal?.querySelector('.tasks-tab.active[data-tab="new"]');
const _formMounted = _modal?.querySelector('#task-form-name');
if (_addActive && _formMounted) {
_showPresetPicker();
return;
}
closeTasks();
}
};
document.addEventListener('keydown', _escHandler);
// Paint the scaffolding immediately so the modal-enter animation reveals a
// populated shell (header/search/sort/empty list with a spinner row) instead
// of an empty modal-body that fills in after the fetch resolves — that delay
// was visible as a "flicker" right after opening.
_activeTab = 'tasks';
_switchTab('tasks');
_fetchTasks().then(() => {
// Re-render so the list swaps the Loading row for real cards.
_renderList();
_syncPauseAllButton();
if (_pendingFocusTaskId) {
_focusTask(_pendingFocusTaskId);
_pendingFocusTaskId = null;
}
_runFirstOpenOnboarding();
});
}
let _pendingFocusTaskId = null;
// Scroll to + briefly highlight a task card by id. Used by the chat
// anchor-link delegate ([Name](#task-)).
function _focusTask(taskId) {
if (!taskId) return;
// Find the task card with this id and scroll-into-view + flash it. Backend
// task IDs are UUIDs so the unescaped selector is safe in practice; if that
// changes, swap to `[data-id="${CSS.escape(taskId)}"]`.
setTimeout(() => {
const card = document.querySelector(`.task-card[data-id="${taskId}"], [data-id="${taskId}"]`);
if (!card) return;
card.scrollIntoView({ behavior: 'smooth', block: 'center' });
card.classList.add('task-card-flash');
setTimeout(() => card.classList.remove('task-card-flash'), 2000);
}, 150);
}
export function closeTasks() {
if (!_open) return;
_open = false;
_viewingRuns = null;
const modal = document.getElementById('tasks-modal');
if (modal) {
const content = modal.querySelector('.modal-content');
if (content) {
content.classList.add('modal-closing');
content.addEventListener('animationend', () => modal.remove(), { once: true });
setTimeout(() => { if (modal.parentElement) modal.remove(); }, 250);
} else {
modal.remove();
}
}
if (_escHandler) {
document.removeEventListener('keydown', _escHandler);
_escHandler = null;
}
if (_clockInterval) {
clearInterval(_clockInterval);
_clockInterval = null;
}
// Detach the form-Esc capture listener if it survived (e.g. user closed the
// modal from the X / outside-click while the form was open).
if (window._tasksFormEsc) {
document.removeEventListener('keydown', window._tasksFormEsc, true);
window._tasksFormEsc = null;
}
}
export function isTasksOpen() { return _open; }
// ---- Task run notifications polling ----
let _notifInterval = null;
async function _pollTaskNotifications() {
try {
const res = await fetch(`${API_BASE}/api/tasks/notifications`, { credentials: 'same-origin' });
if (!res.ok) return;
const data = await res.json();
const notes = data.notifications || [];
for (const n of notes) {
const ok = n.status === 'success';
// Tasks with output_target='notification' carry the result text in `body`
// — show it as a real browser Notification (richer than a toast). Falls
// back to a toast when permission is denied or unavailable.
if (ok && n.body) {
const title = n.task_name || 'Task';
let fired = false;
try {
if (typeof Notification !== 'undefined' && Notification.permission === 'granted') {
new Notification(title, { body: n.body, tag: 'task-' + (n.task_id || title), icon: '/static/favicon.ico' });
fired = true;
}
} catch (_) {}
if (!fired && uiModule) uiModule.showToast(title + ': ' + n.body.slice(0, 140), { duration: 7000 });
continue;
}
const msg = `Task ${ok ? 'finished' : 'failed'}: ${n.task_name}`;
if (!uiModule) continue;
if (ok) uiModule.showToast(msg, { duration: 5000 });
else uiModule.showError(msg);
}
} catch (e) {
// Silently ignore — server may be unreachable
}
}
function startNotificationPolling() {
if (_notifInterval) return;
_notifInterval = setInterval(_pollTaskNotifications, 30000);
}
function stopNotificationPolling() {
if (_notifInterval) {
clearInterval(_notifInterval);
_notifInterval = null;
}
}
// Start polling on module load
startNotificationPolling();
const tasksModule = { openTasks, closeTasks, isTasksOpen, startNotificationPolling, stopNotificationPolling };
export default tasksModule;
window.tasksModule = tasksModule;