botmux 2.107.0 → 2.108.0

package/dist/dashboard/web/legacy-workflow-page.js

@@ -0,0 +1,717 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Fragment, useCallback, useEffect, useMemo, useRef, useState, } from 'react';
+import { DropdownMenu, LoadingState } from './dashboard-components.js';
+import { mountReactPage } from './react-mount.js';
+import { useT } from './react-hooks.js';
+import { WorkflowVersionSwitch } from './workflow-version-switch.js';
+import { LEGACY_WORKFLOW_DETAIL_POLL_MS, LEGACY_WORKFLOW_POLL_MS, buildAttemptTimeline, buildCardDescriptors, cancelLegacyWorkflowRun, clamp, cliRequiresNativeSessionId, computeTerminalSurface, danglingSummary, endLegacyWorkflowResumeSession, eventSeqFromId, extractEventContext, fetchLegacyWorkflowEvents, fetchLegacyWorkflowRuns, fetchLegacyWorkflowSnapshot, fmtUpdated, formatClock, isOpenHumanGateAttempt, isResumeCapableCli, isTerminalWorkflowStatus, latestAttempt, legacyWorkflowStatusFilters, maxConcurrency, parseLegacyWorkflowHash, previewBody, previewMetaParts, resolveLegacyWorkflowWait, short, shortText, startLegacyWorkflowResumeSession, statusLabel, terminalMetaParts, terminalOpenInTabLabel, terminalSurfaceLabel, } from './workflows.js';
+const EMPTY_EVENT_STATE = {
+    events: [],
+    oldestSeq: null,
+    newestSeq: null,
+    hasOlder: false,
+    totalCount: 0,
+};
+function isDocumentHidden() {
+    return typeof document !== 'undefined' && document.hidden;
+}
+function statusClassToken(status) {
+    return status.replace(/[^A-Za-z0-9_-]/g, '-');
+}
+function errMessage(err) {
+    return err instanceof Error ? err.message : String(err);
+}
+function ioBlockKey(keyPrefix, label) {
+    return `${keyPrefix}:${label}`;
+}
+function StatusBadge(props) {
+    const terminal = isTerminalWorkflowStatus(props.status) ? ' terminal' : ' live';
+    return (_jsx("span", { className: `wf-status${terminal} wf-status-${statusClassToken(props.status)}`, children: statusLabel(props.status) }));
+}
+function useLegacyWorkflowRuns(status) {
+    const [rows, setRows] = useState([]);
+    const [lastErr, setLastErr] = useState(null);
+    const [lastLoadedAt, setLastLoadedAt] = useState(null);
+    useEffect(() => {
+        let disposed = false;
+        let inflight = false;
+        let timer = null;
+        async function poll() {
+            if (disposed || inflight || isDocumentHidden())
+                return;
+            inflight = true;
+            try {
+                const nextRows = await fetchLegacyWorkflowRuns(status);
+                if (disposed)
+                    return;
+                setRows(nextRows);
+                setLastErr(null);
+                setLastLoadedAt(new Date());
+            }
+            catch (err) {
+                if (disposed)
+                    return;
+                setRows([]);
+                setLastErr(errMessage(err));
+                setLastLoadedAt(new Date());
+            }
+            finally {
+                inflight = false;
+            }
+        }
+        function scheduleNext() {
+            if (timer !== null)
+                window.clearTimeout(timer);
+            timer = window.setTimeout(async () => {
+                await poll();
+                if (!disposed)
+                    scheduleNext();
+            }, LEGACY_WORKFLOW_POLL_MS);
+        }
+        function onVisibility() {
+            if (document.hidden)
+                return;
+            void poll();
+        }
+        document.addEventListener('visibilitychange', onVisibility);
+        void poll().then(() => {
+            if (!disposed)
+                scheduleNext();
+        });
+        return () => {
+            disposed = true;
+            if (timer !== null)
+                window.clearTimeout(timer);
+            document.removeEventListener('visibilitychange', onVisibility);
+        };
+    }, [status]);
+    return { rows, lastErr, lastLoadedAt };
+}
+function LegacyWorkflowListPage() {
+    const tr = useT();
+    const [query, setQuery] = useState('');
+    const [status, setStatus] = useState('');
+    const { rows, lastErr, lastLoadedAt } = useLegacyWorkflowRuns(status);
+    const statusFilters = legacyWorkflowStatusFilters();
+    const statusFilterLabel = statusFilters.find(option => option.value === status)?.label ?? status;
+    const filteredRows = useMemo(() => {
+        const q = query.trim().toLowerCase();
+        if (!q)
+            return rows;
+        return rows.filter((row) => row.runId.toLowerCase().includes(q) ||
+            row.workflowId.toLowerCase().includes(q) ||
+            (row.chatId ?? '').toLowerCase().includes(q));
+    }, [query, rows]);
+    const loadText = lastErr
+        ? tr('workflow.list.error', { error: lastErr })
+        : lastLoadedAt
+            ? tr('workflow.list.loaded', { count: rows.length, time: lastLoadedAt.toLocaleTimeString() })
+            : '';
+    const emptyText = lastErr
+        ? tr('workflow.list.failedLoad', { error: lastErr })
+        : rows.length === 0
+            ? tr('workflow.list.noRuns')
+            : tr('workflow.list.noFilterMatch');
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "page-heading", children: [_jsxs("div", { children: [_jsx("p", { className: "eyebrow", children: tr('nav.workflows') }), _jsx("h1", { children: tr('nav.workflows') })] }), _jsx("div", { className: "page-heading-actions", children: _jsx(WorkflowVersionSwitch, { active: "legacy" }) })] }), _jsxs("form", { className: "filters dashboard-toolbar", onSubmit: (event) => event.preventDefault(), children: [_jsx("input", { type: "search", name: "q", value: query, placeholder: tr('workflow.searchPlaceholder'), onChange: (event) => setQuery(event.currentTarget.value) }), _jsx(DropdownMenu, { id: "legacy-workflow-status", className: "legacy-workflow-status-menu", ariaLabel: tr('workflow.table.status'), label: statusFilterLabel, value: status, options: statusFilters, onChange: setStatus }), _jsx("span", { className: `toolbar-status${lastErr ? ' error' : ''}`, children: loadText })] }), _jsx("div", { className: "workflow-runs-table-wrap", children: _jsxs("table", { className: "data-table workflow-runs-table", children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: tr('workflow.table.run') }), _jsx("th", { children: tr('workflow.table.workflow') }), _jsx("th", { children: tr('workflow.table.status') }), _jsx("th", { children: tr('workflow.table.lastSeq') }), _jsx("th", { children: tr('workflow.table.dangling') }), _jsx("th", { children: tr('workflow.table.updated') }), _jsx("th", { children: tr('workflow.table.chatApp') })] }) }), _jsx("tbody", { children: filteredRows.length > 0 ? filteredRows.map((row) => (_jsx(RunListRow, { row: row }, row.runId))) : (_jsx("tr", { children: _jsx("td", { colSpan: 7, className: "empty", children: emptyText }) })) })] }) })] }));
+}
+function RunListRow(props) {
+    const row = props.row;
+    const dangling = `${row.dEf}/${row.dAct}/${row.dWait}`;
+    const danglingClass = row.dEf + row.dAct + row.dWait > 0 ? 'wf-dangling has' : 'wf-dangling none';
+    return (_jsxs("tr", { "data-runid": row.runId, children: [_jsx("td", { children: _jsx("a", { href: `#/legacy-workflow/${encodeURIComponent(row.runId)}`, children: _jsx("code", { children: row.runId }) }) }), _jsx("td", { children: row.workflowId }), _jsxs("td", { children: [_jsx(StatusBadge, { status: row.status }), row.failedNodeId ? _jsxs("span", { className: "muted", children: [" (", row.failedNodeId, ")"] }) : null, _jsx(RunErrorSummary, { row: row })] }), _jsx("td", { children: row.lastSeq }), _jsx("td", { className: danglingClass, children: dangling }), _jsx("td", { title: new Date(row.updatedAt).toISOString(), children: fmtUpdated(row.updatedAt) }), _jsxs("td", { children: [row.chatId ? row.chatId : null, row.chatId && row.larkAppId ? _jsx("br", {}) : null, row.larkAppId ? _jsx("span", { className: "muted", children: row.larkAppId }) : null, !row.chatId && !row.larkAppId ? '—' : null] })] }));
+}
+function RunErrorSummary(props) {
+    const { row } = props;
+    if (!row.errorCode)
+        return null;
+    const message = row.errorMessage ? ` - ${shortText(row.errorMessage, 96)}` : '';
+    return (_jsxs("div", { className: "wf-run-error", children: [_jsx("span", { className: "muted error", children: row.errorCode }), message] }));
+}
+function mergeEventWindow(current, win, direction) {
+    const base = direction === 'reset' ? [] : current.events;
+    const eventIds = new Set(base.map((event) => event.eventId));
+    const fresh = win.events.filter((event) => {
+        if (eventIds.has(event.eventId))
+            return false;
+        eventIds.add(event.eventId);
+        return true;
+    });
+    const events = (direction === 'prepend' ? [...fresh, ...base] : [...base, ...fresh])
+        .sort((a, b) => eventSeqFromId(a.eventId) - eventSeqFromId(b.eventId));
+    if (direction === 'reset') {
+        return {
+            events,
+            oldestSeq: win.oldestSeq,
+            newestSeq: win.newestSeq,
+            hasOlder: win.hasOlder,
+            totalCount: win.totalCount,
+        };
+    }
+    if (direction === 'prepend') {
+        return {
+            events,
+            oldestSeq: win.oldestSeq ?? current.oldestSeq,
+            newestSeq: current.newestSeq,
+            hasOlder: win.hasOlder,
+            totalCount: win.totalCount,
+        };
+    }
+    return {
+        events,
+        oldestSeq: current.oldestSeq ?? win.oldestSeq,
+        newestSeq: win.newestSeq ?? current.newestSeq,
+        hasOlder: current.hasOlder,
+        totalCount: win.totalCount,
+    };
+}
+function LegacyWorkflowDetailPage(props) {
+    const tr = useT();
+    const [snapshot, setSnapshot] = useState(null);
+    const snapshotRef = useRef(null);
+    const [eventState, setEventState] = useState(EMPTY_EVENT_STATE);
+    const eventStateRef = useRef(EMPTY_EVENT_STATE);
+    const [detailError, setDetailError] = useState(null);
+    const [cancelStatus, setCancelStatus] = useState(null);
+    const [canceling, setCanceling] = useState(false);
+    const [loadingFailed, setLoadingFailed] = useState(false);
+    const [loadingOlder, setLoadingOlder] = useState(false);
+    const [focusAttemptId, setFocusAttemptId] = useState(props.focusAttemptId);
+    const [approvalComments, setApprovalComments] = useState(() => new Map());
+    const [approvalStatuses, setApprovalStatuses] = useState(() => new Map());
+    const [resolvingWaits, setResolvingWaits] = useState(() => new Set());
+    const [resumeSessions, setResumeSessions] = useState(() => new Map());
+    const [resumePending, setResumePending] = useState(() => new Set());
+    const [resumeErrors, setResumeErrors] = useState(() => new Map());
+    const [openBlocks, setOpenBlocks] = useState(() => new Set());
+    const scrollTopsRef = useRef(new Map());
+    const disposedRef = useRef(false);
+    const inflightRef = useRef(false);
+    const applyEventWindow = useCallback((win, direction) => {
+        const next = mergeEventWindow(eventStateRef.current, win, direction);
+        eventStateRef.current = next;
+        setEventState(next);
+    }, []);
+    const setSnapshotBoth = useCallback((next) => {
+        snapshotRef.current = next;
+        setSnapshot(next);
+    }, []);
+    const poll = useCallback(async (options = {}) => {
+        if (disposedRef.current || inflightRef.current)
+            return;
+        if (!options.allowHidden && isDocumentHidden())
+            return;
+        inflightRef.current = true;
+        try {
+            const nextSnapshot = await fetchLegacyWorkflowSnapshot(props.runId);
+            if (disposedRef.current)
+                return;
+            setSnapshotBoth(nextSnapshot);
+            const currentEvents = eventStateRef.current;
+            if (currentEvents.newestSeq !== null) {
+                const win = await fetchLegacyWorkflowEvents(props.runId, new URLSearchParams({ afterSeq: String(currentEvents.newestSeq), limit: '200' }));
+                if (!disposedRef.current)
+                    applyEventWindow(win, 'append');
+            }
+            else {
+                const win = await fetchLegacyWorkflowEvents(props.runId, new URLSearchParams({ tail: '1' }));
+                if (!disposedRef.current)
+                    applyEventWindow(win, 'reset');
+            }
+            if (!disposedRef.current) {
+                setDetailError(null);
+                setLoadingFailed(false);
+            }
+        }
+        catch (err) {
+            if (!disposedRef.current)
+                setDetailError(errMessage(err));
+        }
+        finally {
+            inflightRef.current = false;
+        }
+    }, [applyEventWindow, props.runId, setSnapshotBoth]);
+    const initialLoad = useCallback(async () => {
+        const nextSnapshot = await fetchLegacyWorkflowSnapshot(props.runId);
+        if (disposedRef.current)
+            return;
+        setSnapshotBoth(nextSnapshot);
+        const win = await fetchLegacyWorkflowEvents(props.runId, new URLSearchParams({ tail: '100' }));
+        if (disposedRef.current)
+            return;
+        applyEventWindow(win, 'reset');
+    }, [applyEventWindow, props.runId, setSnapshotBoth]);
+    useEffect(() => {
+        disposedRef.current = false;
+        inflightRef.current = false;
+        snapshotRef.current = null;
+        eventStateRef.current = EMPTY_EVENT_STATE;
+        let timer = null;
+        function scheduleNext() {
+            if (timer !== null)
+                window.clearTimeout(timer);
+            if (snapshotRef.current && isTerminalWorkflowStatus(snapshotRef.current.run.status)) {
+                timer = null;
+                return;
+            }
+            timer = window.setTimeout(async () => {
+                await poll();
+                if (!disposedRef.current)
+                    scheduleNext();
+            }, LEGACY_WORKFLOW_DETAIL_POLL_MS);
+        }
+        function onVisibility() {
+            if (document.hidden)
+                return;
+            void poll({ allowHidden: true }).then(() => {
+                if (!disposedRef.current && timer === null)
+                    scheduleNext();
+            });
+        }
+        document.addEventListener('visibilitychange', onVisibility);
+        void initialLoad()
+            .then(() => {
+            if (disposedRef.current)
+                return;
+            setDetailError(null);
+            setLoadingFailed(false);
+            scheduleNext();
+        })
+            .catch((err) => {
+            if (disposedRef.current)
+                return;
+            setDetailError(errMessage(err));
+            setLoadingFailed(true);
+        });
+        return () => {
+            disposedRef.current = true;
+            if (timer !== null)
+                window.clearTimeout(timer);
+            document.removeEventListener('visibilitychange', onVisibility);
+        };
+    }, [initialLoad, poll]);
+    useEffect(() => {
+        if (snapshot && isTerminalWorkflowStatus(snapshot.run.status))
+            setCancelStatus(null);
+    }, [snapshot]);
+    const loadOlderEvents = useCallback(async () => {
+        const current = eventStateRef.current;
+        if (current.oldestSeq === null || !current.hasOlder || loadingOlder)
+            return;
+        setLoadingOlder(true);
+        try {
+            const win = await fetchLegacyWorkflowEvents(props.runId, new URLSearchParams({ beforeSeq: String(current.oldestSeq), limit: '100' }));
+            if (!disposedRef.current) {
+                applyEventWindow(win, 'prepend');
+                setDetailError(null);
+            }
+        }
+        catch (err) {
+            if (!disposedRef.current)
+                setDetailError(errMessage(err));
+        }
+        finally {
+            if (!disposedRef.current)
+                setLoadingOlder(false);
+        }
+    }, [applyEventWindow, loadingOlder, props.runId]);
+    const cancelRun = useCallback(async () => {
+        const current = snapshotRef.current;
+        if (!current || isTerminalWorkflowStatus(current.run.status) || canceling)
+            return;
+        if (!current.chatBinding?.larkAppId) {
+            setDetailError(tr('workflow.detail.cancelUnavailable', { runId: props.runId }));
+            return;
+        }
+        const dangling = danglingSummary(current);
+        const message = tr('workflow.detail.cancelConfirm', { runId: props.runId, ...dangling });
+        if (!window.confirm(message))
+            return;
+        setCanceling(true);
+        try {
+            const body = await cancelLegacyWorkflowRun(props.runId);
+            setCancelStatus(body.pending ? tr('workflow.detail.cancelPending') : null);
+            setDetailError(null);
+            await poll({ allowHidden: true });
+        }
+        catch (err) {
+            setDetailError(errMessage(err));
+        }
+        finally {
+            setCanceling(false);
+        }
+    }, [canceling, poll, props.runId, tr]);
+    const resolveHumanGate = useCallback(async (attemptId, action) => {
+        if (resolvingWaits.has(attemptId))
+            return;
+        setResolvingWaits((prev) => new Set(prev).add(attemptId));
+        setApprovalStatuses((prev) => {
+            const next = new Map(prev);
+            next.delete(attemptId);
+            return next;
+        });
+        try {
+            const comment = approvalComments.get(attemptId)?.trim() || undefined;
+            const body = await resolveLegacyWorkflowWait(props.runId, action, comment);
+            const label = action === 'approve' ? tr('workflow.detail.approved') : tr('workflow.detail.rejected');
+            const text = body.alreadyTerminal
+                ? tr('workflow.detail.alreadyTerminal', { label })
+                : body.pending
+                    ? tr('workflow.detail.workflowContinue', { label })
+                    : tr('workflow.detail.workflowRefreshing', { label });
+            setApprovalStatuses((prev) => new Map(prev).set(attemptId, { kind: 'ok', text }));
+            setDetailError(null);
+            await poll({ allowHidden: true });
+        }
+        catch (err) {
+            const message = errMessage(err);
+            setApprovalStatuses((prev) => new Map(prev).set(attemptId, { kind: 'error', text: message }));
+            setDetailError(message);
+        }
+        finally {
+            setResolvingWaits((prev) => {
+                const next = new Set(prev);
+                next.delete(attemptId);
+                return next;
+            });
+        }
+    }, [approvalComments, poll, props.runId, resolvingWaits, tr]);
+    const startResumeSession = useCallback(async (attemptId, activityId) => {
+        if (resumePending.has(attemptId))
+            return;
+        setResumePending((prev) => new Set(prev).add(attemptId));
+        setResumeErrors((prev) => {
+            const next = new Map(prev);
+            next.delete(attemptId);
+            return next;
+        });
+        try {
+            const session = await startLegacyWorkflowResumeSession(props.runId, activityId, attemptId);
+            setResumeSessions((prev) => new Map(prev).set(attemptId, session));
+        }
+        catch (err) {
+            setResumeErrors((prev) => new Map(prev).set(attemptId, errMessage(err)));
+        }
+        finally {
+            setResumePending((prev) => {
+                const next = new Set(prev);
+                next.delete(attemptId);
+                return next;
+            });
+        }
+    }, [props.runId, resumePending]);
+    const endResumeSession = useCallback(async (attemptId, activityId) => {
+        if (resumePending.has(attemptId))
+            return;
+        setResumePending((prev) => new Set(prev).add(attemptId));
+        setResumeErrors((prev) => {
+            const next = new Map(prev);
+            next.delete(attemptId);
+            return next;
+        });
+        try {
+            await endLegacyWorkflowResumeSession(props.runId, activityId, attemptId);
+            setResumeSessions((prev) => {
+                const next = new Map(prev);
+                next.delete(attemptId);
+                return next;
+            });
+        }
+        catch (err) {
+            setResumeErrors((prev) => new Map(prev).set(attemptId, errMessage(err)));
+        }
+        finally {
+            setResumePending((prev) => {
+                const next = new Set(prev);
+                next.delete(attemptId);
+                return next;
+            });
+        }
+    }, [props.runId, resumePending]);
+    const blockState = useMemo(() => ({
+        openBlocks,
+        scrollTops: scrollTopsRef.current,
+        setBlockOpen: (key, open) => {
+            setOpenBlocks((prev) => {
+                const next = new Set(prev);
+                if (open)
+                    next.add(key);
+                else
+                    next.delete(key);
+                return next;
+            });
+        },
+        // Ref, not state: scrolling an IO preview shouldn't setState → re-render the whole detail
+        // page on every scroll tick. The value is only read imperatively to restore preRef.scrollTop.
+        setBlockScrollTop: (key, top) => {
+            scrollTopsRef.current.set(key, top);
+        },
+    }), [openBlocks]);
+    const approvalState = useMemo(() => ({
+        comments: approvalComments,
+        statuses: approvalStatuses,
+        resolving: resolvingWaits,
+    }), [approvalComments, approvalStatuses, resolvingWaits]);
+    const resumeState = useMemo(() => ({
+        sessions: resumeSessions,
+        pending: resumePending,
+        errors: resumeErrors,
+    }), [resumeErrors, resumePending, resumeSessions]);
+    const run = snapshot?.run;
+    const isTerminal = run ? isTerminalWorkflowStatus(run.status) : false;
+    const canCancelInDashboard = !!snapshot?.chatBinding?.larkAppId;
+    const cancelLabel = canCancelInDashboard ? tr('workflow.detail.cancel') : tr('workflow.detail.cliCancelOnly');
+    const cancelTitle = canCancelInDashboard
+        ? tr('workflow.detail.cancelTitle')
+        : tr('workflow.detail.cliCancelTitle', { runId: props.runId });
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "page-heading wf-detail-head", children: [_jsxs("div", { children: [_jsx("p", { className: "eyebrow", children: tr('nav.workflows') }), _jsx("h1", { children: _jsx("code", { children: props.runId }) }), _jsx("p", { className: "muted", children: snapshot ? (_jsxs(_Fragment, { children: [run?.workflowId ?? '?', " \u00B7 ", _jsx(StatusBadge, { status: run?.status ?? 'unknown' }), " \u00B7 lastSeq ", snapshot.lastSeq] })) : loadingFailed ? tr('workflow.detail.loadFailed') : tr('workflow.detail.loading') })] }), _jsxs("div", { className: "page-heading-actions", children: [_jsx("span", { className: "toolbar-status", children: snapshot ? tr('workflow.detail.refreshed', { time: new Date().toLocaleTimeString() }) : '' }), _jsx("button", { type: "button", className: "contrast", hidden: !snapshot || isTerminal, disabled: canceling || !canCancelInDashboard, title: cancelTitle, onClick: () => void cancelRun(), children: cancelLabel }), _jsx("a", { className: "btn-link", href: "#/legacy-workflow", children: tr('workflow.detail.back') }), _jsx(WorkflowVersionSwitch, { active: "legacy" })] })] }), detailError ? _jsx("section", { className: "hint-warn", children: detailError }) : null, cancelStatus ? _jsx("section", { className: "hint-ok", children: cancelStatus }) : null, !snapshot && !loadingFailed && !detailError ? _jsx(LoadingState, { label: tr('workflow.detail.loading') }) : null, snapshot ? (_jsxs(_Fragment, { children: [_jsx(SummaryGrid, { snapshot: snapshot }), _jsx(DanglingPanel, { snapshot: snapshot }), _jsx(ParallelPanel, { snapshot: snapshot, events: eventState.events }), _jsx(NodeActivityPanel, { snapshot: snapshot }), _jsx(NodeIOPanel, { runId: props.runId, snapshot: snapshot, approval: approvalState, resume: resumeState, blockState: blockState, focusAttemptId: focusAttemptId, onCommentChange: (attemptId, value) => {
+                            setApprovalComments((prev) => new Map(prev).set(attemptId, value));
+                        }, onResolve: resolveHumanGate, onResumeStart: startResumeSession, onResumeEnd: endResumeSession, onFocusConsumed: () => setFocusAttemptId(undefined) }), _jsx(TimelinePanel, { events: eventState.events, totalCount: eventState.totalCount, hasOlder: eventState.hasOlder, loadingOlder: loadingOlder, onLoadOlder: loadOlderEvents })] })) : null] }));
+}
+function SummaryGrid(props) {
+    const tr = useT();
+    const snap = props.snapshot;
+    const run = snap.run;
+    const items = [
+        { label: tr('workflow.summary.workflow'), value: run.workflowId ?? '?' },
+        { label: tr('workflow.summary.status'), value: _jsx(StatusBadge, { status: run.status }) },
+        { label: tr('workflow.summary.lastSeq'), value: snap.lastSeq },
+        { label: tr('workflow.summary.updated'), value: new Date(snap.updatedAt).toLocaleString() },
+        { label: tr('workflow.summary.revision'), value: short(run.revisionId) },
+        { label: tr('workflow.summary.initiator'), value: run.initiator ?? '-' },
+    ];
+    if (run.failedNodeId)
+        items.push({ label: tr('workflow.summary.failedNode'), value: run.failedNodeId });
+    if (run.cancelOriginEventId)
+        items.push({ label: tr('workflow.summary.cancelOrigin'), value: run.cancelOriginEventId });
+    if (snap.chatBinding) {
+        items.push({ label: tr('workflow.summary.chat'), value: _jsx("code", { children: snap.chatBinding.chatId }) });
+        items.push({ label: tr('workflow.summary.app'), value: _jsx("code", { children: snap.chatBinding.larkAppId }) });
+    }
+    return (_jsx("section", { className: "wf-summary-grid", children: items.map((item) => (_jsxs("div", { className: "wf-summary-item", children: [_jsx("span", { children: item.label }), _jsx("strong", { children: item.value })] }, item.label))) }));
+}
+function DanglingPanel(props) {
+    const tr = useT();
+    const d = props.snapshot.dangling;
+    const groups = [
+        [tr('workflow.dangling.activities'), d.activities],
+        [tr('workflow.dangling.effects'), d.effectAttempted],
+        [tr('workflow.dangling.waits'), d.waits],
+        [tr('workflow.dangling.cancels'), d.cancels],
+    ];
+    const total = new Set(groups.flatMap(([, items]) => items)).size;
+    return (_jsxs("section", { className: `wf-panel wf-dangling-panel${total > 0 ? ' has' : ''}`, children: [_jsxs("div", { className: "wf-panel-title", children: [_jsx("h3", { children: tr('workflow.detail.dangling') }), total > 0 ? _jsx("span", { className: "wf-dangling has", children: total }) : null] }), total === 0 ? (_jsx("div", { className: "muted", children: tr('workflow.detail.noDangling') })) : (_jsx("div", { className: "wf-dangling-grid", children: groups.map(([label, items]) => (_jsxs("div", { children: [_jsx("strong", { children: label }), items.length === 0 ? (_jsx("div", { className: "muted", children: tr('workflow.detail.none') })) : (_jsx("ul", { children: items.map((item) => _jsx("li", { children: _jsx("code", { children: item }) }, item)) }))] }, label))) }))] }));
+}
+function ParallelPanel(props) {
+    const tr = useT();
+    const items = useMemo(() => buildAttemptTimeline(props.events, props.snapshot), [props.events, props.snapshot]);
+    const now = Date.now();
+    if (items.length === 0) {
+        return (_jsxs("section", { className: "wf-panel", children: [_jsxs("div", { className: "wf-panel-title", children: [_jsx("h3", { children: tr('workflow.detail.parallel') }), _jsx("span", { className: "muted" })] }), _jsx("div", { className: "empty", children: tr('workflow.detail.noParallelData') })] }));
+    }
+    const start = Math.min(...items.map((item) => item.startedAt));
+    const end = Math.max(...items.map((item) => item.endedAt ?? now), start + 1000);
+    const duration = Math.max(1, end - start);
+    const running = items.filter((item) => !item.endedAt && (item.status === 'running' || item.status === 'effectAttempting')).length;
+    const meta = tr('workflow.detail.parallelMeta', {
+        count: items.length,
+        max: maxConcurrency(items, now),
+        running,
+    });
+    return (_jsxs("section", { className: "wf-panel", children: [_jsxs("div", { className: "wf-panel-title", children: [_jsx("h3", { children: tr('workflow.detail.parallel') }), _jsx("span", { className: "muted", children: meta })] }), _jsxs("div", { children: [_jsxs("div", { className: "wf-parallel-axis", children: [_jsx("span", { title: new Date(start).toISOString(), children: formatClock(start) }), _jsx("span", { title: new Date(end).toISOString(), children: formatClock(end) })] }), _jsx("div", { className: "wf-parallel-list", children: [...items]
+                            .sort((a, b) => a.startedAt - b.startedAt || a.activityId.localeCompare(b.activityId))
+                            .map((item) => (_jsx(ParallelRow, { item: item, start: start, duration: duration, now: now }, item.attemptId))) })] })] }));
+}
+function ParallelRow(props) {
+    const tr = useT();
+    const { item } = props;
+    const end = item.endedAt ?? props.now;
+    const left = clamp(((item.startedAt - props.start) / props.duration) * 100, 0, 100);
+    const width = clamp(((Math.max(end, item.startedAt + 1) - item.startedAt) / props.duration) * 100, 0.7, 100 - left);
+    const label = item.nodeId ?? item.activityId;
+    const attempt = item.attemptNumber !== undefined ? `#${item.attemptNumber}` : short(item.attemptId);
+    const title = [
+        `${label} ${item.status}`,
+        `${new Date(item.startedAt).toISOString()} -> ${item.endedAt ? new Date(item.endedAt).toISOString() : tr('workflow.detail.parallelNow')}`,
+        item.endType ? `end: ${item.endType}` : undefined,
+    ].filter(Boolean).join('\n');
+    return (_jsxs("div", { className: "wf-parallel-row", children: [_jsxs("div", { className: "wf-parallel-label", children: [_jsx("code", { children: label }), _jsxs("span", { className: "muted", children: [item.activityId, " \u00B7 ", attempt] })] }), _jsx("div", { className: "wf-parallel-track", children: _jsx("div", { className: `wf-parallel-bar wf-parallel-${statusClassToken(item.status)}`, style: { left: `${left.toFixed(3)}%`, width: `${width.toFixed(3)}%` }, title: title, children: _jsx("span", { children: statusLabel(item.status) }) }) })] }));
+}
+function NodeActivityPanel(props) {
+    const tr = useT();
+    const rows = useMemo(() => buildNodeActivityRows(props.snapshot), [props.snapshot]);
+    return (_jsxs("section", { className: "wf-panel", children: [_jsx("div", { className: "wf-panel-title", children: _jsx("h3", { children: tr('workflow.detail.nodes') }) }), _jsx("div", { className: "wf-table-scroll", children: _jsxs("table", { children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: tr('workflow.detail.node') }), _jsx("th", { children: tr('workflow.detail.nodeStatus') }), _jsx("th", { children: tr('workflow.detail.activity') }), _jsx("th", { children: tr('workflow.detail.activityStatus') }), _jsx("th", { children: tr('workflow.detail.attempts') }), _jsx("th", { children: tr('workflow.detail.current') }), _jsx("th", { children: tr('workflow.detail.detail') })] }) }), _jsx("tbody", { children: rows.length > 0 ? rows.map((row) => (_jsx(NodeActivityRow, { ...row }, `${row.node?.nodeId ?? 'activity'}:${row.activity?.activityId ?? 'idle'}`))) : (_jsx("tr", { children: _jsx("td", { colSpan: 7, className: "empty", children: tr('workflow.detail.noNodes') }) })) })] }) })] }));
+}
+function buildNodeActivityRows(snap) {
+    const byId = new Map(snap.activities.map((activity) => [activity.activityId, activity]));
+    const used = new Set();
+    const rows = [];
+    for (const node of snap.nodes) {
+        const activity = (node.activityId ? byId.get(node.activityId) : undefined) ??
+            snap.activities.find((candidate) => candidate.ownerNodeId === node.nodeId);
+        if (activity)
+            used.add(activity.activityId);
+        rows.push({ node, activity });
+    }
+    for (const activity of snap.activities) {
+        if (!used.has(activity.activityId))
+            rows.push({ activity });
+    }
+    return rows;
+}
+function NodeActivityRow(props) {
+    const tr = useT();
+    const latest = latestAttempt(props.activity);
+    return (_jsxs("tr", { children: [_jsx("td", { children: props.node ? _jsx("code", { children: props.node.nodeId }) : _jsx("span", { className: "muted", children: "-" }) }), _jsx("td", { children: props.node ? _jsx(StatusBadge, { status: props.node.status }) : _jsx("span", { className: "muted", children: "-" }) }), _jsx("td", { children: props.activity ? _jsx("code", { children: props.activity.activityId }) : _jsx("span", { className: "muted", children: "-" }) }), _jsx("td", { children: props.activity ? _jsx(StatusBadge, { status: props.activity.status }) : _jsx("span", { className: "muted", children: "-" }) }), _jsx("td", { children: props.activity?.attempts.length ?? 0 }), _jsx("td", { children: latest ? _jsx("code", { children: latest.attemptId }) : _jsx("span", { className: "muted", children: "-" }) }), _jsx("td", { children: latest ? _jsx(AttemptDetail, { attempt: latest }) : _jsx("span", { className: "muted", children: tr('workflow.detail.idle') }) })] }));
+}
+function AttemptDetail(props) {
+    const tr = useT();
+    const parts = [];
+    const attempt = props.attempt;
+    if (attempt.effectAttempted) {
+        parts.push(_jsxs(Fragment, { children: [tr('workflow.detail.effect'), " ", attempt.effectAttempted.provider] }, "effect"));
+    }
+    if (attempt.wait) {
+        const resolution = attempt.wait.resolution
+            ? `${attempt.wait.resolution.kind}${attempt.wait.resolution.resolution ? ':' + attempt.wait.resolution.resolution : ''}`
+            : tr('workflow.detail.open');
+        parts.push(_jsxs(Fragment, { children: [tr('workflow.detail.wait'), " ", attempt.wait.waitKind, " ", resolution] }, "wait"));
+        if (attempt.wait.deadlineAt !== undefined) {
+            parts.push(_jsxs(Fragment, { children: [tr('workflow.detail.deadline'), " ", formatClock(attempt.wait.deadlineAt)] }, "deadline"));
+        }
+    }
+    if (attempt.error) {
+        const tag = `${attempt.error.errorCode}${attempt.error.errorClass ? ` · ${attempt.error.errorClass}` : ''}`;
+        parts.push(_jsx("span", { className: "muted error", children: tag }, "error-tag"));
+        if (attempt.error.errorMessage) {
+            parts.push(_jsx("span", { className: "error wf-error-msg", children: attempt.error.errorMessage }, "error-message"));
+        }
+    }
+    if (attempt.output)
+        parts.push(_jsxs(Fragment, { children: [tr('workflow.detail.output'), " ", short(attempt.output.outputHash)] }, "output"));
+    if (attempt.runningMs !== undefined)
+        parts.push(_jsxs(Fragment, { children: [attempt.runningMs, "ms"] }, "running"));
+    if (parts.length === 0)
+        return _jsx("span", { className: "muted", children: "-" });
+    return (_jsx(_Fragment, { children: parts.map((part, index) => (_jsxs(Fragment, { children: [index > 0 ? _jsx("br", {}) : null, part] }, index))) }));
+}
+function NodeIOPanel(props) {
+    const tr = useT();
+    const descriptors = useMemo(() => buildCardDescriptors(props.snapshot), [props.snapshot]);
+    return (_jsxs("section", { className: "wf-panel", children: [_jsx("div", { className: "wf-panel-title", children: _jsx("h3", { children: tr('workflow.detail.nodeIO') }) }), _jsx("div", { className: "wf-io-list", children: descriptors.length > 0 ? descriptors.map((desc) => (_jsx(AttemptIOCard, { desc: desc, ...props }, desc.key))) : (_jsx("div", { className: "empty", children: tr('workflow.detail.noNodeIO') })) })] }));
+}
+function AttemptIOCard(props) {
+    const tr = useT();
+    const cardRef = useRef(null);
+    const attempt = latestAttempt(props.desc.activity);
+    const title = props.desc.node?.nodeId ?? props.desc.activity?.ownerNodeId ?? props.desc.activity?.activityId ?? 'unknown';
+    const keyPrefix = attempt?.attemptId ?? props.desc.activity?.activityId ?? props.desc.node?.nodeId ?? 'unknown';
+    const focusMatch = !!attempt && attempt.attemptId === props.focusAttemptId;
+    const terminalSurface = computeTerminalSurface({
+        runId: props.runId,
+        activity: props.desc.activity,
+        attempt,
+        terminal: props.desc.io?.terminal,
+        resumeSession: attempt ? props.resume.sessions.get(attempt.attemptId) : undefined,
+    });
+    const terminalBlockKey = terminalSurface
+        ? ioBlockKey(keyPrefix, terminalSurfaceLabel(terminalSurface.kind))
+        : null;
+    const scrolledRef = useRef(false);
+    useEffect(() => {
+        if (!focusMatch) {
+            scrolledRef.current = false;
+            return;
+        }
+        // Scroll the focused card into view once as soon as it exists — don't wait for the terminal
+        // sidecar (it may arrive a detail-poll later, or never for a terminal-less attempt).
+        if (!scrolledRef.current) {
+            scrolledRef.current = true;
+            cardRef.current?.scrollIntoView({ block: 'center' });
+        }
+        // Expand the terminal block + consume the deep-link focus once the surface is available.
+        if (terminalSurface && terminalBlockKey) {
+            props.blockState.setBlockOpen(terminalBlockKey, true);
+            props.onFocusConsumed();
+        }
+    }, [focusMatch, props, terminalBlockKey, terminalSurface]);
+    return (_jsxs("article", { ref: cardRef, className: `wf-io-card${focusMatch ? ' is-focused' : ''}`, "data-wf-card-key": props.desc.key, "data-wf-attempt-card": attempt?.attemptId, children: [_jsxs("div", { className: "wf-io-card-head", children: [_jsxs("header", { children: [_jsxs("div", { children: [_jsx("strong", { children: _jsx("code", { children: title }) }), _jsx("span", { className: "muted", children: props.desc.activity ? props.desc.activity.activityId : tr('workflow.detail.notDispatched') })] }), _jsxs("div", { children: [props.desc.node ? _jsx(StatusBadge, { status: props.desc.node.status }) : null, props.desc.node && props.desc.activity ? ' ' : null, props.desc.activity ? _jsx(StatusBadge, { status: props.desc.activity.status }) : null] })] }), _jsx("div", { className: "wf-io-meta", children: attempt ? _jsxs(_Fragment, { children: [tr('workflow.detail.attempt'), " ", _jsx("code", { children: attempt.attemptId })] }) : tr('workflow.detail.noAttempt') }), _jsx(ApprovalControls, { attempt: attempt, approval: props.approval, onCommentChange: props.onCommentChange, onResolve: props.onResolve })] }), _jsx("div", { className: "wf-io-terminal-slot", children: terminalSurface && props.desc.io?.terminal ? (_jsx(TerminalBlock, { runId: props.runId, keyPrefix: keyPrefix, attempt: attempt, activity: props.desc.activity, terminal: props.desc.io.terminal, surface: terminalSurface, resume: props.resume, blockState: props.blockState, onResumeStart: props.onResumeStart, onResumeEnd: props.onResumeEnd })) : null }), _jsxs("div", { className: "wf-io-grid", children: [_jsx(PreviewBlock, { keyPrefix: keyPrefix, label: tr('workflow.detail.authoredInput'), preview: props.desc.io?.input, blockState: props.blockState }), _jsx(PreviewBlock, { keyPrefix: keyPrefix, label: tr('workflow.detail.resolvedInput'), preview: props.desc.io?.resolvedInput, blockState: props.blockState }), _jsx(PreviewBlock, { keyPrefix: keyPrefix, label: tr('workflow.detail.output'), preview: props.desc.io?.output, blockState: props.blockState }), _jsx(PreviewBlock, { keyPrefix: keyPrefix, label: tr('workflow.detail.executionLog'), preview: props.desc.io?.log, blockState: props.blockState }), props.desc.io?.waitPrompt ? (_jsx(PreviewBlock, { keyPrefix: keyPrefix, label: tr('workflow.detail.waitPrompt'), preview: props.desc.io.waitPrompt, blockState: props.blockState })) : null] })] }));
+}
+function ApprovalControls(props) {
+    const tr = useT();
+    const attempt = props.attempt;
+    if (!isOpenHumanGateAttempt(attempt))
+        return null;
+    const comment = props.approval.comments.get(attempt.attemptId) ?? '';
+    const resolving = props.approval.resolving.has(attempt.attemptId);
+    const status = props.approval.statuses.get(attempt.attemptId);
+    return (_jsxs("div", { className: "wf-approval-box", "data-wf-approval": attempt.attemptId, children: [_jsxs("label", { children: [_jsx("span", { children: tr('workflow.detail.approvalComment') }), _jsx("textarea", { className: "wf-approval-comment", rows: 2, value: comment, placeholder: tr('workflow.detail.optionalComment'), disabled: resolving, onChange: (event) => props.onCommentChange(attempt.attemptId, event.currentTarget.value) })] }), _jsxs("div", { className: "wf-approval-actions", children: [_jsx("button", { type: "button", className: "primary", disabled: resolving, onClick: () => void props.onResolve(attempt.attemptId, 'approve'), children: tr('workflow.detail.approve') }), _jsx("button", { type: "button", disabled: resolving, onClick: () => void props.onResolve(attempt.attemptId, 'reject'), children: tr('workflow.detail.reject') }), resolving ? _jsx("span", { className: "muted", children: tr('workflow.detail.submitting') }) : null] }), status ? (_jsx("div", { className: `${status.kind === 'error' ? 'hint-warn' : 'hint-ok'} wf-approval-status`, children: status.text })) : null] }));
+}
+function TerminalBlock(props) {
+    const tr = useT();
+    const label = terminalSurfaceLabel(props.surface.kind);
+    const key = ioBlockKey(props.keyPrefix, label);
+    const open = props.blockState.openBlocks.has(key);
+    const meta = terminalMetaParts(props.attempt, props.terminal).join(' · ');
+    return (_jsxs("details", { className: "wf-io-block wf-terminal-block", "data-io-key": key, open: open, onToggle: (event) => props.blockState.setBlockOpen(key, event.currentTarget.open), children: [_jsxs("summary", { children: [label, " ", _jsx("span", { className: "muted", children: meta })] }), _jsxs("div", { className: "wf-terminal-actions", children: [_jsx("a", { className: "btn-link", href: props.surface.url, target: "_blank", rel: "noreferrer", children: terminalOpenInTabLabel(props.surface.kind) }), props.surface.kind === 'replay' || props.surface.kind === 'resume' ? (_jsx("a", { className: "btn-link", href: props.surface.downloadUrl, download: true, children: tr('workflow.detail.downloadFullLog') })) : null, _jsx(ResumeAction, { ...props })] }), props.attempt && props.resume.errors.has(props.attempt.attemptId) ? (_jsx("div", { className: "hint-warn wf-resume-status", children: props.resume.errors.get(props.attempt.attemptId) })) : null, _jsx("iframe", { className: "wf-terminal-frame", src: props.surface.url, title: label, loading: "lazy" })] }));
+}
+function ResumeAction(props) {
+    const tr = useT();
+    const { activity, attempt, surface, terminal } = props;
+    if (!attempt || !activity || surface.kind === 'live')
+        return null;
+    const pending = props.resume.pending.has(attempt.attemptId);
+    if (surface.kind === 'resume') {
+        return (_jsx("button", { type: "button", className: "btn-link", disabled: pending, onClick: () => void props.onResumeEnd(attempt.attemptId, activity.activityId), children: pending ? tr('workflow.detail.resumeEnding') : tr('workflow.detail.endResumeSession') }));
+    }
+    if (!isResumeCapableCli(terminal.cliId)) {
+        return (_jsx("button", { type: "button", className: "btn-link", disabled: true, title: tr('workflow.detail.resumeUnsupportedCli', { cliId: terminal.cliId ?? '?' }), children: tr('workflow.detail.resumeSession') }));
+    }
+    if (cliRequiresNativeSessionId(terminal.cliId) && !terminal.cliSessionId) {
+        return (_jsx("button", { type: "button", className: "btn-link", disabled: true, title: tr('workflow.detail.resumeMissingCliSession'), children: tr('workflow.detail.resumeSession') }));
+    }
+    return (_jsx("button", { type: "button", className: "btn-link", disabled: pending, onClick: () => void props.onResumeStart(attempt.attemptId, activity.activityId), children: pending ? tr('workflow.detail.resumeStarting') : tr('workflow.detail.resumeSession') }));
+}
+function PreviewBlock(props) {
+    const key = ioBlockKey(props.keyPrefix, props.label);
+    const open = props.blockState.openBlocks.has(key);
+    const meta = previewMetaParts(props.preview).join(' · ');
+    return (_jsxs("details", { className: "wf-io-block", "data-io-key": key, open: open, onToggle: (event) => props.blockState.setBlockOpen(key, event.currentTarget.open), children: [_jsxs("summary", { children: [props.label, " ", _jsx("span", { className: "muted", children: meta })] }), _jsx(PreviewContent, { preview: props.preview, blockKey: key, blockState: props.blockState })] }));
+}
+function PreviewContent(props) {
+    const tr = useT();
+    const preRef = useRef(null);
+    const body = previewBody(props.preview);
+    useEffect(() => {
+        const top = props.blockState.scrollTops.get(props.blockKey);
+        if (top !== undefined && preRef.current)
+            preRef.current.scrollTop = top;
+    });
+    if (!props.preview)
+        return _jsx("div", { className: "muted wf-io-empty", children: tr('workflow.detail.noData') });
+    return (_jsxs(_Fragment, { children: [props.preview.error ? _jsx("div", { className: "muted error", children: props.preview.error }) : null, body ? (_jsx("pre", { ref: preRef, className: "wf-io-pre", onScroll: (event) => props.blockState.setBlockScrollTop(props.blockKey, event.currentTarget.scrollTop), children: body })) : (_jsx("div", { className: "muted wf-io-empty", children: tr('workflow.detail.noPreview') }))] }));
+}
+function TimelinePanel(props) {
+    const tr = useT();
+    const scrollRef = useRef(null);
+    const scrollTopRef = useRef(0);
+    useEffect(() => {
+        if (scrollRef.current)
+            scrollRef.current.scrollTop = scrollTopRef.current;
+    }, [props.events]);
+    return (_jsxs("section", { className: "wf-panel", children: [_jsxs("div", { className: "wf-panel-title", children: [_jsx("h3", { children: tr('workflow.detail.timeline') }), _jsx("button", { type: "button", hidden: !props.hasOlder, disabled: props.loadingOlder, onClick: () => void props.onLoadOlder(), children: tr('workflow.detail.loadOlder') })] }), _jsx("div", { ref: scrollRef, className: "wf-table-scroll wf-timeline-scroll", onScroll: (event) => { scrollTopRef.current = event.currentTarget.scrollTop; }, children: _jsxs("table", { children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: tr('workflow.detail.seq') }), _jsx("th", { children: tr('workflow.detail.event') }), _jsx("th", { children: tr('workflow.detail.actor') }), _jsx("th", { children: tr('workflow.detail.node') }), _jsx("th", { children: tr('workflow.detail.activity') }), _jsx("th", { children: tr('workflow.detail.error') }), _jsx("th", { children: tr('workflow.detail.time') })] }) }), _jsx("tbody", { children: props.events.length > 0 ? props.events.map((event) => (_jsx(EventRow, { event: event }, event.eventId))) : (_jsx("tr", { children: _jsx("td", { colSpan: 7, className: "empty", children: tr('workflow.detail.noEvents') }) })) })] }) }), _jsx("div", { className: "muted", children: tr('workflow.detail.eventsLoaded', { loaded: props.events.length, total: props.totalCount }) })] }));
+}
+function EventRow(props) {
+    const ctx = extractEventContext(props.event.payload);
+    return (_jsxs("tr", { children: [_jsx("td", { children: eventSeqFromId(props.event.eventId) }), _jsx("td", { children: _jsx("code", { children: props.event.type }) }), _jsx("td", { children: props.event.actor }), _jsx("td", { children: ctx.nodeId ? _jsx("code", { children: ctx.nodeId }) : '-' }), _jsx("td", { children: ctx.activityId ? _jsx("code", { children: ctx.activityId }) : '-' }), _jsx("td", { children: ctx.errorCode ? _jsx("span", { className: "muted error", children: ctx.errorCode }) : '-' }), _jsx("td", { title: new Date(props.event.timestamp).toISOString(), children: formatClock(props.event.timestamp) })] }));
+}
+function LegacyWorkflowPage() {
+    useT();
+    const route = parseLegacyWorkflowHash(location.hash);
+    return (_jsx("section", { className: "page workflows-page legacy-workflow-page", children: route.kind === 'detail'
+            ? _jsx(LegacyWorkflowDetailPage, { runId: route.runId, focusAttemptId: route.focusAttemptId })
+            : _jsx(LegacyWorkflowListPage, {}) }));
+}
+export function renderLegacyWorkflowPage(root) {
+    return mountReactPage(root, _jsx(LegacyWorkflowPage, {}));
+}
+//# sourceMappingURL=legacy-workflow-page.js.map