@tea-agent/loop-agent 0.10.0 → 0.12.0

package/dist/worker/observe/static/views/run.js

@@ -0,0 +1,453 @@
+/** Observe UI view module (R5). */
+import {
+	UI_TEXT,
+	LIVENESS_LABELS,
+	ARTIFACT_LABELS,
+	ARTIFACT_KEYS,
+	STEP_LABELS,
+	STEP_ORDER,
+	DAG_INSPECTOR_DEFAULT_WIDTH,
+	DAG_INSPECTOR_MIN_WIDTH,
+	DAG_INSPECTOR_MAX_WIDTH,
+	DAG_INSPECTOR_RIGHT_OFFSET,
+	DAG_INSPECTOR_VIEWPORT_MARGIN,
+	DAG_INSPECTOR_KEYBOARD_STEP,
+	TERMINAL_RUN_STATUSES,
+	DAG_EFFECTIVE_STATUS_LABELS,
+	STATUS_LABELS,
+} from "../constants.js";
+import { clearNode, el, metaGrid, buildTable } from "../dom.js";
+import {
+	badge,
+	badgeClass,
+	statusLabel,
+	formatTs,
+	formatMs,
+	formatDuration,
+	formatAgo,
+	dagStatusBadge,
+	livenessBadge,
+	displayDurationMs,
+	derivedDurationMs,
+	summaryText,
+	truncateText,
+	repoBaseName,
+	parseMarkdownBlocks,
+	markdownLinkHref,
+} from "../format.js";
+import { parseRoute, navigate, buildHashPath } from "../router.js";
+import {
+	fetchJson,
+	artifactUrl,
+	parseArtifactPreviewResponse,
+} from "../api.js";
+import {
+	objectRouteLink,
+	findFeatureInSnapshot,
+	featureLookupState,
+	buildObjectRelations,
+	renderObjectRelationBar,
+} from "../relations.js";
+import { copyText, renderRecommendedCommand } from "../copy.js";
+import {
+	isPageVisible,
+	detailPollDelay,
+	dashboardPollDelay,
+	captureDagGraphViewportState,
+	updateDagGraphViewportState,
+	updateDagTimelineViewportState,
+	computeFollowLatest,
+	updateDagOutputViewportState,
+	renderViewState,
+	mountViewState,
+} from "../state.js";
+import { uiState } from "../state.js";
+import { sortPoolTasks } from "../format-pool.js";
+import {
+	dagMetaVisibility,
+	isDagRunActive,
+	dashboardVisibleFeatures,
+	findDagForRun,
+} from "../dag-model.js";
+import { layoutDag } from "../dag-layout.js";
+import {
+	showView,
+	setBreadcrumb,
+	updateHeaderRefresh,
+	mountRelationBar,
+} from "../shell-chrome.js";
+import { dagProgress } from "../dag-helpers.js";
+import {
+	findBatchRunIdForTask,
+	buildStepStates,
+	stepMarker,
+	getCurrentCommand,
+	getOutputTail,
+	collectArtifacts,
+} from "../run-processing.js";
+
+export async function mergeRunEvents(workerRunId) {
+	const page = await fetchJson(
+		`/api/runs/${encodeURIComponent(workerRunId)}/events?after=${uiState.runEventOffset}`,
+	);
+	if (!page?.events) return;
+	uiState.runEvents = uiState.runEvents.concat(page.events);
+	uiState.runEventOffset += page.events.length;
+}
+
+export function renderInlineArtifactList(container, artifacts) {
+	if (!artifacts || artifacts.size === 0) {
+		container.appendChild(el("p", "empty", UI_TEXT.noArtifacts));
+		return;
+	}
+	const list = el("ul", "artifact-list artifact-preview-list");
+	for (const [label, artifactPath] of artifacts) {
+		const li = document.createElement("li");
+		li.className = "artifact-preview-item";
+		const head = el("div", "artifact-preview-head");
+		const title = el(
+			"span",
+			"artifact-preview-label",
+			`${label}: ${artifactPath}`,
+		);
+		const open = document.createElement("a");
+		open.href = artifactUrl(artifactPath);
+		open.textContent = "打开";
+		open.target = "_blank";
+		open.rel = "noopener";
+		open.className = "artifact-link";
+		open.addEventListener("click", (e) => e.stopPropagation());
+		head.appendChild(title);
+		head.appendChild(document.createTextNode(" "));
+		head.appendChild(open);
+		const pre = el("pre", "output-block artifact-preview-body", "加载中…");
+		li.appendChild(head);
+		li.appendChild(pre);
+		list.appendChild(li);
+		void (async () => {
+			try {
+				const res = await fetch(artifactUrl(artifactPath));
+				const text = await res.text();
+				if (!res.ok) {
+					let message = text;
+					try {
+						const parsed = JSON.parse(text);
+						if (parsed && typeof parsed.message === "string") {
+							message = parsed.message;
+						} else if (parsed && typeof parsed.error === "string") {
+							message = parsed.error;
+						}
+					} catch {
+						/* keep raw */
+					}
+					pre.textContent = `无法读取 (${res.status}): ${message || "未知错误"}`;
+					pre.classList.add("artifact-preview-error");
+					return;
+				}
+				const preview = parseArtifactPreviewResponse(text);
+				pre.textContent = preview.content || "（空）";
+				if (preview.truncated) {
+					pre.appendChild(document.createTextNode("\n\n[预览已截断]"));
+				}
+			} catch (err) {
+				pre.textContent = `无法读取: ${err?.message ?? String(err)}`;
+				pre.classList.add("artifact-preview-error");
+			}
+		})();
+	}
+	container.appendChild(list);
+}
+
+export function renderRunDagProgress(task, snapshot) {
+	const panel = document.getElementById("run-dag-progress");
+	clearNode(panel);
+	const dag = findDagForRun(snapshot, task.workerRunId, task);
+	if (!dag) return;
+
+	const progress = dagProgress(dag);
+	panel.appendChild(el("h3", null, "DAG 节点进度"));
+	panel.appendChild(
+		metaGrid([
+			["DAG", dag.title || dag.dagRunId],
+			["当前状态", dagStatusBadge(dag.effectiveStatus ?? dag.status)],
+			["进度", `${progress.finished}/${progress.total} 个节点`],
+			[
+				"详情",
+				(() => {
+					const a = el("a", "link", "查看 DAG 详情 →");
+					a.href = `#/dag/${encodeURIComponent(dag.dagRunId)}`;
+					a.addEventListener("click", (e) => {
+						e.preventDefault();
+						navigate(`/dag/${encodeURIComponent(dag.dagRunId)}`);
+					});
+					return a;
+				})(),
+			],
+		]),
+	);
+}
+
+export function renderRunPanels(task, events, snapshot) {
+	const metaEl = document.getElementById("run-meta");
+	const stepsEl = document.getElementById("run-steps");
+	const commandEl = document.getElementById("run-command");
+	const outputEl = document.getElementById("run-output");
+	const artifactsEl = document.getElementById("run-artifacts");
+	const diagnosisEl = document.getElementById("run-diagnosis");
+
+	const nowMs = Date.now();
+	const livenessNode = livenessBadge(task.liveness);
+	const statusCell = livenessNode
+		? (() => {
+				const wrap = document.createDocumentFragment();
+				wrap.appendChild(badge(task.status));
+				wrap.appendChild(document.createTextNode(" "));
+				wrap.appendChild(livenessNode);
+				return wrap;
+			})()
+		: badge(task.status);
+
+	const dag = findDagForRun(snapshot, task.workerRunId, task);
+	const batchRunId =
+		task.batchRunId ?? findBatchRunIdForTask(snapshot, task) ?? null;
+	const runDuration = displayDurationMs(task);
+
+	mountRelationBar(
+		"run-relations",
+		{
+			featureId: task.featureId,
+			taskId: task.taskId,
+			batchRunId: batchRunId ?? undefined,
+			workerRunId: task.workerRunId,
+			dagRunId: dag?.dagRunId ?? task.dagRunId,
+		},
+		snapshot,
+	);
+
+	clearNode(metaEl);
+	metaEl.appendChild(el("h3", "layer-primary", "主事实"));
+	metaEl.appendChild(
+		metaGrid([
+			["Worker 运行 ID", task.workerRunId ?? "—"],
+			["Task", objectRouteLink("task", task.taskId, snapshot)],
+			[
+				"Feature",
+				task.featureId
+					? objectRouteLink("feature", task.featureId, snapshot)
+					: el("span", "muted", "—"),
+			],
+			["状态", statusCell],
+			[
+				"Batch",
+				batchRunId
+					? objectRouteLink("batch", batchRunId, snapshot)
+					: el("span", "muted", "缺失"),
+			],
+			[
+				"DAG",
+				dag
+					? objectRouteLink("dag", dag.dagRunId, snapshot)
+					: task.dagRunId
+						? el("span", "muted", task.dagRunId)
+						: el("span", "muted", "缺失"),
+			],
+			["开始时间", formatTs(task.startedAt)],
+			["结束时间", formatTs(task.finishedAt)],
+			["派生耗时", formatMs(runDuration)],
+			["已用时", formatDuration(task.elapsedMs)],
+			["上次心跳", formatAgo(task.lastHeartbeatAt, nowMs)],
+			["上次输出", formatAgo(task.lastOutputAt, nowMs)],
+			[
+				"超时截止",
+				task.timeoutAt
+					? formatAgo(task.timeoutAt, nowMs)
+					: task.pid !== undefined
+						? `pid ${task.pid}`
+						: "—",
+			],
+		]),
+	);
+
+	renderRunDagProgress(task, snapshot);
+
+	const steps = buildStepStates(events);
+	clearNode(stepsEl);
+	const stepsHeading = el("h3", null, "执行过程 · 步骤");
+	stepsEl.appendChild(stepsHeading);
+	if (steps.every((s) => s.status === "pending")) {
+		stepsEl.appendChild(el("p", "empty", "暂无步骤事件"));
+	}
+	const ul = el("ul", "step-timeline");
+	for (const step of steps) {
+		const li = document.createElement("li");
+		const marker = el(
+			"span",
+			`step-marker ${step.status}`,
+			stepMarker(step.status),
+		);
+		const name = el("span", "step-name", step.display);
+		const dur = el(
+			"span",
+			"step-duration",
+			step.durationMs !== undefined ? formatMs(step.durationMs) : "",
+		);
+		li.appendChild(marker);
+		if (step.label === "run-dag" && dag?.dagRunId) {
+			const link = document.createElement("a");
+			link.href = `#/dag/${encodeURIComponent(dag.dagRunId)}`;
+			link.className = "step-link";
+			link.textContent = "DAG →";
+			link.addEventListener("click", (e) => {
+				e.preventDefault();
+				navigate(`/dag/${encodeURIComponent(dag.dagRunId)}`);
+			});
+			li.appendChild(name);
+			li.appendChild(link);
+		} else {
+			li.appendChild(name);
+		}
+		li.appendChild(dur);
+		ul.appendChild(li);
+	}
+	stepsEl.appendChild(ul);
+
+	const cmd = getCurrentCommand(events);
+	clearNode(commandEl);
+	commandEl.appendChild(el("h3", null, "当前命令"));
+	if (!cmd) {
+		commandEl.appendChild(el("p", "empty", UI_TEXT.noActiveCommand));
+	} else {
+		commandEl.appendChild(
+			metaGrid([
+				["标签", cmd.label ?? "—"],
+				["命令", (cmd.command ?? []).join(" ") || "—"],
+				["PID", cmd.pid !== undefined ? String(cmd.pid) : "—"],
+				[
+					"超时上限",
+					cmd.timeoutMs !== undefined ? formatMs(cmd.timeoutMs) : "—",
+				],
+				[
+					"已用时间",
+					cmd.elapsedMs !== undefined ? formatMs(cmd.elapsedMs) : "—",
+				],
+			]),
+		);
+	}
+
+	const outputLabel = cmd?.label;
+	const tail = getOutputTail(events, outputLabel);
+	const existingPre = outputEl.querySelector("pre.output-block");
+	let followRunOutput = true;
+	let runOutputScrollLeft = 0;
+	let runOutputScrollTop = 0;
+	if (existingPre) {
+		followRunOutput = computeFollowLatest(
+			existingPre.scrollTop,
+			existingPre.scrollHeight,
+			existingPre.clientHeight,
+		);
+		runOutputScrollLeft = existingPre.scrollLeft;
+		runOutputScrollTop = existingPre.scrollTop;
+	}
+	const nextOutput = tail || "暂无输出";
+	// let pre = existingPre — preserve pre identity across polls when present.
+	let pre = existingPre;
+	if (!pre) {
+		clearNode(outputEl);
+		outputEl.appendChild(el("h3", null, "最新输出 (tail)"));
+		pre = el("pre", "output-block", nextOutput);
+		outputEl.appendChild(pre);
+	} else if (pre.textContent !== nextOutput) {
+		pre.textContent = nextOutput;
+	}
+	if (followRunOutput) {
+		pre.scrollTop = pre.scrollHeight;
+	} else {
+		pre.scrollTop = runOutputScrollTop;
+	}
+	pre.scrollLeft = runOutputScrollLeft;
+	const runRegionKey = `run:${task.workerRunId ?? task.taskId}:output`;
+	uiState.runOutputViewportState = updateDagOutputViewportState(
+		uiState.runOutputViewportState,
+		runRegionKey,
+		pre.scrollLeft,
+		pre.scrollTop,
+		followRunOutput,
+	);
+
+	let diagnosisHeader = diagnosisEl?.querySelector(".run-diagnosis-header");
+	if (diagnosisEl && !diagnosisHeader) {
+		diagnosisHeader = el("div", "run-diagnosis-header panel panel-meta");
+		diagnosisEl.insertBefore(diagnosisHeader, diagnosisEl.firstChild);
+	}
+	if (diagnosisHeader) {
+		clearNode(diagnosisHeader);
+		diagnosisHeader.appendChild(el("h3", "layer-diagnostic", "诊断证据"));
+		diagnosisHeader.appendChild(
+			metaGrid([
+				["失败分类", task.failureCategory ?? "—"],
+				["建议跟进", task.recommendedFollowUp ?? "—"],
+			]),
+		);
+	}
+
+	const artifacts = collectArtifacts(task, events);
+	clearNode(artifactsEl);
+	artifactsEl.appendChild(el("h3", null, "产物预览"));
+	renderInlineArtifactList(artifactsEl, artifacts);
+}
+
+export async function renderRun(workerRunId, initial = true) {
+	showView("run");
+	setBreadcrumb([
+		{ label: UI_TEXT.dashboard, href: "#/" },
+		{ label: workerRunId },
+	]);
+
+	if (initial) {
+		uiState.runEvents = [];
+		uiState.runEventOffset = 0;
+		uiState.currentRunId = workerRunId;
+		const runMeta = document.getElementById("run-meta");
+		if (runMeta) mountViewState(runMeta, "loading", "加载运行…");
+	} else if (uiState.currentRunId && uiState.currentRunId !== workerRunId) {
+		return false;
+	}
+
+	const [task, snapshot] = await Promise.all([
+		fetchJson(`/api/runs/${encodeURIComponent(workerRunId)}`),
+		fetchJson("/api/snapshot"),
+	]);
+	if (!task) {
+		if (initial) {
+			const runMeta = document.getElementById("run-meta");
+			if (runMeta) mountViewState(runMeta, "error", "找不到该运行。");
+		}
+		return false;
+	}
+
+	if (snapshot) {
+		uiState.lastSnapshot = snapshot;
+		updateHeaderRefresh(snapshot.generatedAt);
+	}
+
+	uiState.currentBatchRunId = task.batchRunId ?? uiState.currentBatchRunId;
+	await mergeRunEvents(workerRunId);
+	renderRunPanels(task, uiState.runEvents, snapshot ?? uiState.lastSnapshot);
+	return !TERMINAL_RUN_STATUSES.has((task.status ?? "").toLowerCase());
+}
+
+export function startRunPolling(workerRunId, initial = true) {
+	if (uiState.runPollTimer) clearTimeout(uiState.runPollTimer);
+	const generation = ++uiState.pollingGeneration;
+	const poll = async (isInitial) => {
+		const active = await renderRun(workerRunId, isInitial);
+		if (generation !== uiState.pollingGeneration || !active) return;
+		const delay = detailPollDelay("running", isPageVisible());
+		uiState.runPollTimer = setTimeout(() => {
+			uiState.runPollTimer = null;
+			void poll(false);
+		}, delay);
+	};
+	void poll(initial);
+}

package/dist/worker/observe/static/views/session-timeline.js

@@ -0,0 +1,205 @@
+/** Session event timeline helpers (Observe UI R5). */
+import { UI_TEXT } from "../constants.js";
+import { el } from "../dom.js";
+import { formatTs } from "../format.js";
+import { fetchJson } from "../api.js";
+import {
+	uiState,
+	updateDagTimelineViewportState,
+	computeFollowLatest,
+} from "../state.js";
+
+export function extractAssistantSummary(event) {
+	if (!event || typeof event !== "object") return "—";
+	const record = event;
+	if (record.message && typeof record.message === "object") {
+		const content = record.message.content;
+		if (Array.isArray(content)) {
+			return (
+				content
+					.filter(
+						(part) => part?.type === "text" && typeof part.text === "string",
+					)
+					.map((part) => part.text)
+					.join(" ") || "—"
+			);
+		}
+		if (typeof record.message.content === "string") {
+			return record.message.content;
+		}
+	}
+	if (typeof record.text === "string") return record.text;
+	if (typeof record.outputPreview === "string") return record.outputPreview;
+	return "—";
+}
+
+export function formatSessionEventLabel(event) {
+	if (!event || typeof event !== "object") return "未知类型";
+	const type = typeof event.type === "string" ? event.type : "unknown";
+	const toolName = event.toolName ?? event.name ?? "—";
+	if (type === "agent_start") return "Agent 已启动";
+	if (type === "agent_end") return "Agent 已结束";
+	if (type === "agent_settled") return "Agent 已稳定";
+	if (type === "turn_start") return "开始新一轮处理";
+	if (type === "tool_execution_start" || type === "tool_start") {
+		return `调用工具 · ${toolName}`;
+	}
+	if (type === "tool_execution_end" || type === "tool_end") {
+		return `工具调用完成 · ${toolName}`;
+	}
+	if (
+		type === "turn_end" ||
+		type === "assistant" ||
+		type === "assistant_message"
+	) {
+		return `AI 回复摘要 · ${truncateText(extractAssistantSummary(event), 120)}`;
+	}
+	return type;
+}
+
+export function sessionEventTimestamp(event) {
+	if (!event || typeof event !== "object") return "";
+	const ts =
+		(typeof event.timestamp === "string" && event.timestamp) ||
+		(typeof event.at === "string" && event.at) ||
+		(typeof event.recordedAt === "string" && event.recordedAt);
+	return ts || "";
+}
+
+export function formatSessionEventTime(event) {
+	const ts = sessionEventTimestamp(event);
+	if (!ts) return "未记录时间";
+	return formatTs(ts).replace(/\s.*/, "") || formatTs(ts);
+}
+
+export function sessionEventKind(event) {
+	const type = typeof event?.type === "string" ? event.type : "unknown";
+	if (type === "tool_execution_start" || type === "tool_start")
+		return "tool-start";
+	if (type === "tool_execution_end" || type === "tool_end") return "tool-end";
+	if (
+		type === "turn_end" ||
+		type === "assistant" ||
+		type === "assistant_message"
+	) {
+		return "assistant";
+	}
+	if (type.startsWith("agent_") || type === "turn_start") return "lifecycle";
+	return "protocol";
+}
+
+export function buildSessionTimelineItems(events) {
+	const items = [];
+	for (let index = 0; index < events.length; index += 1) {
+		const event = events[index];
+		const type = typeof event?.type === "string" ? event.type : "unknown";
+		if (type === "message_start" || type === "message_end") {
+			let count = 1;
+			while (index + 1 < events.length) {
+				const nextType = events[index + 1]?.type;
+				if (nextType !== "message_start" && nextType !== "message_end") break;
+				count += 1;
+				index += 1;
+			}
+			items.push({ event, kind: "protocol", protocolCount: count });
+			continue;
+		}
+		items.push({ event, kind: sessionEventKind(event) });
+	}
+	return items;
+}
+
+export async function mergeSessionEvents(dagRunId, nodeId) {
+	if (!dagRunId || !nodeId) return;
+	const page = await fetchJson(
+		`/api/dag-runs/${encodeURIComponent(dagRunId)}/nodes/${encodeURIComponent(nodeId)}/session-events?after=${uiState.sessionEventOffset}`,
+	);
+	if (!page) return;
+	if (Array.isArray(page.events) && page.events.length > 0) {
+		uiState.sessionEvents = uiState.sessionEvents.concat(page.events);
+	}
+	if (typeof page.nextOffset === "number") {
+		uiState.sessionEventOffset = page.nextOffset;
+	}
+}
+
+export function renderSessionTimeline(content, nodeId) {
+	content.dataset.dagRunId = uiState.currentDagRunId ?? "";
+	content.dataset.nodeId = nodeId ?? "";
+	content.classList.add("process-timeline-scroll");
+	if (!nodeId || uiState.sessionEvents.length === 0) {
+		content.appendChild(el("p", "empty", UI_TEXT.noSessionEvents));
+		return;
+	}
+
+	const timelineItems = buildSessionTimelineItems(uiState.sessionEvents);
+	const hasEventTimes = uiState.sessionEvents.some((event) =>
+		Boolean(sessionEventTimestamp(event)),
+	);
+	if (!hasEventTimes) {
+		content.appendChild(
+			el(
+				"p",
+				"process-timeline-note",
+				"事件未记录具体时间，以下按采集顺序展示。",
+			),
+		);
+	}
+	const ul = el("ul", "process-timeline");
+	for (let index = 0; index < timelineItems.length; index += 1) {
+		const item = timelineItems[index];
+		const li = el(
+			"li",
+			`process-timeline-item process-timeline-${item.kind}${hasEventTimes ? " has-time" : ""}`,
+		);
+		if (index === 0) li.classList.add("is-first");
+		if (index === timelineItems.length - 1) li.classList.add("is-last");
+		const rail = el("span", "process-timeline-rail");
+		rail.appendChild(el("span", "process-timeline-dot"));
+		li.appendChild(rail);
+		if (hasEventTimes) {
+			li.appendChild(
+				el("span", "process-timeline-time", formatSessionEventTime(item.event)),
+			);
+		}
+		const label =
+			item.protocolCount > 1
+				? `消息收发 · 已合并 ${item.protocolCount} 条协议事件`
+				: formatSessionEventLabel(item.event);
+		li.appendChild(el("span", "process-timeline-label", label));
+		ul.appendChild(li);
+	}
+	content.appendChild(ul);
+
+	const timelineState =
+		uiState.dagTimelineViewportState?.dagRunId === uiState.currentDagRunId &&
+		uiState.dagTimelineViewportState.nodeId === nodeId
+			? uiState.dagTimelineViewportState
+			: null;
+	content.addEventListener(
+		"scroll",
+		() => {
+			const followLatest = computeFollowLatest(
+				content.scrollTop,
+				content.scrollHeight,
+				content.clientHeight,
+			);
+			uiState.dagTimelineViewportState = updateDagTimelineViewportState(
+				uiState.dagTimelineViewportState,
+				uiState.currentDagRunId,
+				nodeId,
+				content.scrollLeft,
+				content.scrollTop,
+				followLatest,
+			);
+		},
+		{ passive: true },
+	);
+	if (timelineState?.followLatest ?? true) {
+		content.scrollLeft = timelineState?.scrollLeft ?? 0;
+		content.scrollTop = content.scrollHeight;
+	} else {
+		content.scrollLeft = timelineState.scrollLeft;
+		content.scrollTop = timelineState.scrollTop;
+	}
+}

package/dist/worker/observe/static/views/shell.js

@@ -0,0 +1,7 @@
+/**
+ * Shell service locator removed in R5 boundary final (BND-02).
+ * Views import focused modules directly (shell-chrome, kpi, dag-helpers, run-processing).
+ * This file is retained only so historical bundle paths do not 404; do not reintroduce getShell.
+ */
+
+export {};