create-principles-disciple 1.146.3 → 1.146.6

package/console/dist/ui/pages/failed-tasks/FailedTasksPage.js

@@ -1,421 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * FailedTasksPage — Pipeline observability page showing failed or
- * needs_human_review tasks, grouped by taskKind.
- *
- * Part of the PD feedback-pipeline observability spec (Task 10).
- * Gated by the `failed_tasks_observability` feature flag. When the flag is
- * disabled, the backend returns 403 and this page shows a "disabled" state
- * with guidance on how to enable the flag.
- *
- * Each row exposes a "Create Feedback Draft" button that deep-links into the
- * Report Problem page with the task/pain context pre-filled.
- *
- * Governance Recovery Actions v1: when the `failed_task_recovery_console`
- * feature flag is enabled, each row also exposes a "Resume Evolution" button.
- * Recovery is an Owner governance action (never auto-triggered on load): it
- * always goes through an explicit confirmation dialog before POSTing
- * /api/v1/failed-tasks/:id/recover. The success state means "Recovery
- * Accepted" — the task is pending again; execution is asynchronous.
- *
- * PRI-747 F22 / PRI-749: each row can be expanded into its detail — the full
- * task record plus run history — fetched lazily from the pre-existing
- * GET /api/v1/failed-tasks/:id endpoint (server route +
- * SqliteTaskStore.getFailedTaskDetail already existed; the UI simply never
- * consumed them).
- *
- * Runtime Contract (rc-*):
- * - rc-1: API response is treated as `unknown` and validated before use
- * - rc-2: no `as` type assertions — runtime type guards only
- * - rc-5: `Object.hasOwn()` for untrusted object keys
- * - rc-9: every error/disabled path surfaces a reason + next action
- */
-import { useState, useEffect, useCallback, useRef, Fragment } from "react";
-import { useNavigate, useSearchParams } from "react-router-dom";
-import { useTranslation } from "react-i18next";
-import { toast } from "sonner";
-import { PageShell } from "../../components/layout/page-shell.js";
-import { PageLoading } from "../../components/layout/page-loading.js";
-import { Badge } from "../../components/ui/badge.js";
-import { Card, CardContent, CardHeader, CardTitle } from "../../components/ui/card.js";
-import { Button } from "../../components/ui/button.js";
-import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, } from "../../components/ui/alert-dialog.js";
-import { ShinyText } from "../../components/ui/shiny-text.js";
-import { formatDate } from "../../utils/format-date.js";
-import i18n from "../../i18n/index.js";
-import { recoverFailedTask, fetchConfigSummary, fetchFailedTaskDetail, request } from "../../api.js";
-// Same component set the former utils/format.js rendered, now served by the
-// defensive single-owner formatter: an invalid date string returns the raw
-// input instead of Intl throwing RangeError mid-render (review round of
-// PRI-747 F22 — utils/format.js was retired with this migration).
-const DATETIME_FORMAT_OPTS = {
-    year: "numeric",
-    month: "2-digit",
-    day: "2-digit",
-    hour: "2-digit",
-    minute: "2-digit",
-};
-function formatDateTime(iso) {
-    return formatDate(iso, i18n.language, DATETIME_FORMAT_OPTS);
-}
-// ── Runtime validators (rc-1, rc-2, rc-5) ───────────────────────────────────
-//
-// The API response is `unknown` until these guards run. No `as` casts.
-function isObject(v) {
-    return typeof v === "object" && v !== null && !Array.isArray(v);
-}
-function isString(v) {
-    return typeof v === "string";
-}
-function isNumber(v) {
-    return typeof v === "number" && !Number.isNaN(v);
-}
-function readString(v, key) {
-    if (!Object.hasOwn(v, key))
-        return null;
-    return isString(v[key]) ? v[key] : null;
-}
-function readNullableString(v, key) {
-    if (!Object.hasOwn(v, key))
-        return null;
-    const val = v[key];
-    if (val === null)
-        return null;
-    return isString(val) ? val : null;
-}
-function readNumber(v, key) {
-    if (!Object.hasOwn(v, key))
-        return null;
-    return isNumber(v[key]) ? v[key] : null;
-}
-function validateTask(v) {
-    if (!isObject(v))
-        return null;
-    const taskId = readString(v, "taskId");
-    const taskKind = readString(v, "taskKind");
-    const status = readString(v, "status");
-    const attemptCount = readNumber(v, "attemptCount");
-    const maxAttempts = readNumber(v, "maxAttempts");
-    const createdAt = readString(v, "createdAt");
-    // Required fields — fail loud when missing or wrong type (rc-3)
-    if (taskId === null ||
-        taskKind === null ||
-        status === null ||
-        attemptCount === null ||
-        maxAttempts === null ||
-        createdAt === null) {
-        return null;
-    }
-    const painId = readNullableString(v, "painId");
-    const lastError = readNullableString(v, "lastError");
-    const lastAttemptAt = readNullableString(v, "lastAttemptAt");
-    const ownerDecisionRequired = Object.hasOwn(v, "ownerDecisionRequired")
-        ? v.ownerDecisionRequired === true
-        : undefined;
-    return {
-        taskId,
-        taskKind,
-        painId,
-        status,
-        lastError,
-        attemptCount,
-        maxAttempts,
-        createdAt,
-        lastAttemptAt,
-        ...(ownerDecisionRequired !== undefined ? { ownerDecisionRequired } : {}),
-    };
-}
-function validateFailedTasksData(v) {
-    if (!isObject(v))
-        return null;
-    if (!Object.hasOwn(v, "tasks"))
-        return null;
-    const tasksRaw = v.tasks;
-    if (!Array.isArray(tasksRaw))
-        return null;
-    const tasks = [];
-    for (const item of tasksRaw) {
-        const task = validateTask(item);
-        if (task === null)
-            return null;
-        tasks.push(task);
-    }
-    const total = readNumber(v, "total");
-    if (total === null)
-        return null;
-    const nextAction = readNullableString(v, "nextAction");
-    // PRI-955 (F11): optional pipeline health block — an invalid block is
-    // omitted (never fails the whole payload), the page then renders nothing.
-    let pipeline;
-    if (Object.hasOwn(v, "pipeline") && isObject(v.pipeline)) {
-        const p = v.pipeline;
-        const status = readString(p, "status");
-        const note = readString(p, "note");
-        if (status === "healthy" || status === "backlogged" || status === "stalled" || status === "disabled" || status === "unknown") {
-            if (note !== null) {
-                pipeline = {
-                    status,
-                    pendingCount: readNumber(p, "pendingCount"),
-                    oldestPendingTaskKind: readNullableString(p, "oldestPendingTaskKind"),
-                    oldestPendingAgeMinutes: readNumber(p, "oldestPendingAgeMinutes"),
-                    lastProgressAt: readNullableString(p, "lastProgressAt"),
-                    note,
-                    nextAction: readNullableString(p, "nextAction") ?? undefined,
-                };
-            }
-        }
-    }
-    return { tasks, total, nextAction: nextAction ?? undefined, ...(pipeline ? { pipeline } : {}) };
-}
-// ── Helpers ──────────────────────────────────────────────────────────────────
-function truncateId(id) {
-    return id.length > 12 ? id.slice(0, 12) + "…" : id;
-}
-function statusToVariant(status) {
-    if (status === "failed")
-        return "destructive";
-    if (status === "needs_human_review")
-        return "amber";
-    return "default";
-}
-/** A failed task whose retry budget is spent — only a force recovery can requeue it. */
-function isAttemptBudgetExhausted(task) {
-    return task.status === "failed" && task.attemptCount >= task.maxAttempts;
-}
-function groupTasksByKind(tasks) {
-    const grouped = new Map();
-    for (const task of tasks) {
-        const existing = grouped.get(task.taskKind) ?? [];
-        existing.push(task);
-        grouped.set(task.taskKind, existing);
-    }
-    return grouped;
-}
-// ── Component ────────────────────────────────────────────────────────────────
-export function FailedTasksPage() {
-    const { t } = useTranslation();
-    const navigate = useNavigate();
-    const [searchParams] = useSearchParams();
-    // ?taskId= deep link (治理焦点「查看恢复详情」直达): initial value only —
-    // the row auto-expands once; the Owner can still collapse/switch freely.
-    const deepLinkTaskId = searchParams.get("taskId") ?? undefined;
-    const [state, setState] = useState({ status: "loading" });
-    // Governance Recovery Actions v1 — flag-gated recovery UI (fail-closed:
-    // absent/false → no recovery entry, Console stays read-only).
-    const [recoveryEnabled, setRecoveryEnabled] = useState(false);
-    const [recoverTarget, setRecoverTarget] = useState(null);
-    const [recoverLoading, setRecoverLoading] = useState(false);
-    // Exhausted targets recover with force: the dialog warns first and the
-    // action button becomes 强制恢复 (server refuses force=false for these).
-    const recoverExhausted = recoverTarget !== null && isAttemptBudgetExhausted(recoverTarget);
-    let recoverConfirmLabel = t("pages.failedTasks.recoverConfirmButton");
-    if (recoverLoading) {
-        recoverConfirmLabel = t("common.loading");
-    }
-    else if (recoverExhausted) {
-        recoverConfirmLabel = t("pages.failedTasks.recoverConfirmForceButton");
-    }
-    useEffect(() => {
-        let cancelled = false;
-        fetchConfigSummary()
-            .then((result) => {
-            if (cancelled)
-                return;
-            // Fail-closed: only an explicitly enabled flag shows the action
-            if (result.success && result.data) {
-                const flag = result.data.features.find((f) => f.id === "failed_task_recovery_console");
-                setRecoveryEnabled(flag?.enabled === true);
-            }
-        })
-            .catch(() => {
-            // rc-9: flag probe failure keeps recovery hidden (fail-closed)
-        });
-        return () => {
-            cancelled = true;
-        };
-    }, []);
-    const loadData = useCallback(async () => {
-        setState({ status: "loading" });
-        // Shared request(): same auth header and global 401 session-expiry
-        // handling as every other page (PRI-643 — a manual fetch here bypassed
-        // session-expiry routing entirely).
-        const result = await request("/api/v1/failed-tasks", undefined, validateFailedTasksData);
-        if (result.success) {
-            setState({ status: "loaded", data: result.data });
-            return;
-        }
-        // 403 = feature flag disabled — show disabled state (rc-9: surface reason)
-        if (result.status === 403) {
-            setState({ status: "disabled" });
-            return;
-        }
-        setState({ status: "error", message: result.error, nextAction: result.nextAction });
-    }, []);
-    useEffect(() => {
-        loadData();
-    }, [loadData]);
-    const handleCreateDraft = (task) => {
-        const params = new URLSearchParams({
-            source: "failed_tasks_page",
-            taskId: task.taskId,
-        });
-        if (task.painId) {
-            params.set("painId", task.painId);
-        }
-        navigate(`/report-problem?${params.toString()}`);
-    };
-    // Owner-confirmed recovery (SPEC §6.3: explicit confirmation only — this
-    // handler runs exclusively from the dialog's action button, never on load).
-    const handleRecoverConfirmed = async () => {
-        if (!recoverTarget || recoverLoading)
-            return;
-        setRecoverLoading(true);
-        try {
-            const result = await recoverFailedTask(recoverTarget.taskId, undefined, recoverExhausted);
-            if (result.success) {
-                toast.success(t("pages.failedTasks.recoverSuccess"));
-                setRecoverTarget(null);
-                await loadData();
-            }
-            else {
-                // rc-9: server-provided reason + next action accompany the failure
-                const detail = result.nextAction
-                    ? `${result.error} — ${result.nextAction}`
-                    : result.error;
-                toast.error(`${t("pages.failedTasks.recoverFailed")}: ${detail}`);
-            }
-        }
-        catch (err) {
-            toast.error(`${t("pages.failedTasks.recoverFailed")}: ${err instanceof Error ? err.message : "Network error"}`);
-        }
-        finally {
-            setRecoverLoading(false);
-        }
-    };
-    return (_jsxs(PageShell, { children: [_jsxs("div", { className: "mb-8", children: [_jsx("div", { className: "font-mono text-[11px] uppercase tracking-[0.14em] text-ink-3", children: t("pages.failedTasks.title") }), _jsx(ShinyText, { as: "h1", className: "text-[29px] font-semibold tracking-tight text-ink mt-3 mb-2", duration: 4.5, brightness: 0.5, disabled: state.status !== "loaded" || state.data.tasks.length === 0, children: t("pages.failedTasks.title") }), _jsx("p", { className: "text-ink-3 text-sm leading-relaxed max-w-[712px]", children: t("pages.failedTasks.subtitle") })] }), state.status === "loading" && (_jsx(PageLoading, { cardCount: 3, label: t("common.loading") })), state.status === "disabled" && (_jsxs("div", { className: "py-8", children: [_jsx("div", { className: "p-5 bg-panel border border-amber/20 rounded-[var(--radius-md)] text-amber text-[13px] leading-relaxed", children: t("pages.failedTasks.disabled") }), _jsx("div", { className: "mt-4", children: _jsx(Button, { variant: "outline", size: "sm", onClick: loadData, children: t("common.refresh") }) })] })), state.status === "error" && (_jsxs("div", { className: "py-8", children: [_jsxs("div", { className: "text-danger text-sm mb-2", children: [t("pages.failedTasks.error"), ": ", state.message] }), state.nextAction && (_jsx("div", { className: "text-ink-3 text-[13px] mb-3", children: state.nextAction })), _jsx(Button, { variant: "outline", size: "sm", onClick: loadData, children: t("common.refresh") })] })), state.status === "loaded" && (_jsx("div", { className: "animate-[pdFadeIn_400ms_ease-out]", children: _jsx(LoadedContent, { data: state.data, onCreateDraft: handleCreateDraft, onRecover: recoveryEnabled ? (task) => setRecoverTarget(task) : undefined, initialExpandedTaskId: deepLinkTaskId, t: t }) })), _jsx(AlertDialog, { open: recoverTarget !== null, onOpenChange: (open) => {
-                    if (!open && !recoverLoading) {
-                        setRecoverTarget(null);
-                    }
-                }, children: _jsxs(AlertDialogContent, { children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: t("pages.failedTasks.recoverConfirmTitle") }), _jsx(AlertDialogDescription, { asChild: true, children: _jsxs("div", { className: "space-y-2 text-[13px] leading-relaxed", children: [_jsxs("div", { children: [_jsxs("span", { className: "font-medium", children: [t("pages.failedTasks.recoverConfirmStatus"), ":"] }), " ", _jsx("span", { className: "font-mono", children: recoverTarget?.status ?? "—" })] }), recoverExhausted && (_jsxs(_Fragment, { children: [_jsxs("div", { children: [_jsxs("span", { className: "font-medium", children: [t("pages.failedTasks.recoverConfirmAttempts"), ":"] }), " ", _jsxs("span", { className: "font-mono", children: [recoverTarget?.attemptCount, " / ", recoverTarget?.maxAttempts] })] }), _jsx("div", { className: "text-danger", children: t("pages.failedTasks.recoverExhaustedWarning", {
-                                                            attempt: recoverTarget?.attemptCount ?? 0,
-                                                            max: recoverTarget?.maxAttempts ?? 0,
-                                                        }) })] })), _jsxs("div", { children: [_jsxs("span", { className: "font-medium", children: [t("pages.failedTasks.recoverConfirmActionLabel"), ":"] }), " ", t("pages.failedTasks.recoverConfirmActionDesc")] }), _jsxs("div", { children: [_jsxs("span", { className: "font-medium", children: [t("pages.failedTasks.recoverConfirmImpactLabel"), ":"] }), " ", recoverExhausted
-                                                        ? t("pages.failedTasks.recoverConfirmForceImpactDesc")
-                                                        : t("pages.failedTasks.recoverConfirmImpactDesc")] })] }) })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { disabled: recoverLoading, children: t("common.cancel") }), _jsx(AlertDialogAction, { disabled: recoverLoading, onClick: (event) => {
-                                        // Prevent Radix from auto-closing before the async POST
-                                        // resolves; handleRecoverConfirmed closes on success.
-                                        event.preventDefault();
-                                        void handleRecoverConfirmed();
-                                    }, children: recoverConfirmLabel })] })] }) })] }));
-}
-/** PRI-955 (F11): derived learning-queue health block — never claims health
- *  from the failed-task count alone. Facts come from the server projection. */
-function PipelineHealthCard({ pipeline, t }) {
-    const statusLabel = pipeline.status === "healthy" ? t("pages.failedTasks.pipeline.statusHealthy")
-        : pipeline.status === "backlogged" ? t("pages.failedTasks.pipeline.statusBacklogged")
-            : pipeline.status === "stalled" ? t("pages.failedTasks.pipeline.statusStalled")
-                : t("pages.failedTasks.pipeline.statusUnknown");
-    const variant = pipeline.status === "healthy" ? "default"
-        : pipeline.status === "stalled" ? "destructive"
-            : pipeline.status === "backlogged" ? "amber"
-                : "default";
-    return (_jsxs("div", { className: "p-5 bg-panel border border-line rounded-[var(--radius-md)] mb-4", children: [_jsxs("div", { className: "flex items-center gap-3 mb-2", children: [_jsx("span", { className: "text-[15px] font-semibold text-ink", children: t("pages.failedTasks.pipeline.title") }), _jsx("span", { className: `text-xs px-2 py-0.5 rounded-full border ${variant === "destructive" ? "border-red-300 text-red-700 bg-red-50"
-                            : variant === "amber" ? "border-amber-300 text-amber-700 bg-amber-50"
-                                : "border-line text-ink-3 bg-canvas"}`, children: statusLabel })] }), _jsx("p", { className: "text-ink-3 text-sm leading-relaxed", children: pipeline.note }), pipeline.nextAction && (_jsxs("p", { className: "text-ink-3 text-sm leading-relaxed mt-1", children: [t("pages.failedTasks.pipeline.nextActionPrefix"), pipeline.nextAction] }))] }));
-}
-function LoadedContent({ data, onCreateDraft, onRecover, initialExpandedTaskId, t }) {
-    const hasTasks = data.tasks.length > 0;
-    // Empty state — surface nextAction from the API (rc-9: no silent fallback).
-    // PRI-955: the empty copy no longer claims the pipeline is healthy; the
-    // derived queue-health block carries that judgment with facts.
-    if (!hasTasks) {
-        return (_jsxs("div", { className: "py-8", children: [_jsxs("div", { className: "p-5 bg-panel border border-line rounded-[var(--radius-md)]", children: [_jsx("h3", { className: "text-[17px] font-semibold text-ink mb-2", children: t("pages.failedTasks.empty") }), data.nextAction && (_jsx("p", { className: "text-ink-3 text-sm leading-relaxed", children: data.nextAction }))] }), data.pipeline && _jsx(PipelineHealthCard, { pipeline: data.pipeline, t: t })] }));
-    }
-    const grouped = groupTasksByKind(data.tasks);
-    const sortedKinds = Array.from(grouped.keys()).sort();
-    return (_jsxs(_Fragment, { children: [data.pipeline && _jsx(PipelineHealthCard, { pipeline: data.pipeline, t: t }), _jsx("div", { className: "space-y-6", children: sortedKinds.map((kind) => {
-                    const tasks = grouped.get(kind);
-                    if (!tasks || tasks.length === 0)
-                        return null;
-                    return (_jsxs(Card, { children: [_jsx(CardHeader, { children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Badge, { variant: "outline", children: t("pages.failedTasks.kind") }), _jsxs(CardTitle, { className: "text-[15px] font-mono", children: [kind, " (", tasks.length, ")"] })] }) }), _jsx(CardContent, { children: _jsx(TaskTable, { tasks: tasks, onCreateDraft: onCreateDraft, onRecover: onRecover, initialExpandedTaskId: initialExpandedTaskId, t: t }) })] }, kind));
-                }) }), _jsxs("div", { className: "mt-8 font-mono text-[11px] text-ink-4 space-y-1", children: [_jsxs("div", { children: [t("common.total"), ": ", data.total] }), data.total > data.tasks.length && (_jsx("div", { className: "text-amber/80 leading-relaxed", children: t("pages.failedTasks.partialResults")
-                            .replace("{shown}", String(data.tasks.length))
-                            .replace("{total}", String(data.total)) }))] })] }));
-}
-function TaskTable({ tasks, onCreateDraft, onRecover, initialExpandedTaskId, t }) {
-    // PRI-747 F22: one row at a time is expanded into its detail panel.
-    // ?taskId= deep link seeds the initial expansion (only when this table
-    // actually contains the task); after mount it behaves like a normal toggle.
-    const deepLinkTask = initialExpandedTaskId !== undefined
-        ? tasks.find((task) => task.taskId === initialExpandedTaskId)
-        : undefined;
-    const [expandedId, setExpandedId] = useState(deepLinkTask?.taskId ?? null);
-    const [detail, setDetail] = useState({ status: "idle" });
-    // Drop responses from a superseded expand/collapse (rc-7: only the newest
-    // request's result may become current state).
-    const detailRequestIdRef = useRef(0);
-    const deepLinkFetchedRef = useRef(false);
-    // Fetch (or refetch) one task's detail; a stale response from a superseded
-    // request is dropped (rc-7: only the newest request's result may land).
-    const requestDetail = useCallback(async (taskId) => {
-        const requestId = ++detailRequestIdRef.current;
-        setDetail({ status: "loading", taskId });
-        // Lazy fetch on expand: the list view stays cheap; the run history is
-        // only loaded when the Owner actually asks for this task's detail.
-        const result = await fetchFailedTaskDetail(taskId);
-        if (requestId !== detailRequestIdRef.current)
-            return;
-        if (result.success) {
-            setDetail({ status: "loaded", taskId, data: result.data });
-        }
-        else {
-            // rc-9: surface the server-provided reason + next action (404 = the
-            // task recovered/changed state after the list was loaded).
-            setDetail({ status: "error", taskId, message: result.error, nextAction: result.nextAction });
-        }
-    }, []);
-    // Deep link (?taskId=): fetch the linked task's detail and scroll its row
-    // into view once. The table mounts only after the task list has loaded, so
-    // the row is present at first effect run. The URL param is untrusted
-    // (rc-1): CSS.escape (unquoted attribute selector) keeps a crafted id from
-    // breaking the selector.
-    useEffect(() => {
-        if (deepLinkTask === undefined || deepLinkFetchedRef.current)
-            return;
-        deepLinkFetchedRef.current = true;
-        void requestDetail(deepLinkTask.taskId);
-        const row = document.querySelector(`[data-testid=${CSS.escape(`detail-toggle-${deepLinkTask.taskId}`)}]`);
-        row?.scrollIntoView({ block: "center" });
-    }, [deepLinkTask, requestDetail]);
-    const toggleDetail = useCallback((taskId) => {
-        if (expandedId === taskId) {
-            // Invalidate any in-flight response, then collapse.
-            detailRequestIdRef.current += 1;
-            setExpandedId(null);
-            setDetail({ status: "idle" });
-            return;
-        }
-        setExpandedId(taskId);
-        void requestDetail(taskId);
-    }, [expandedId, requestDetail]);
-    return (_jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "grid grid-cols-[auto_minmax(0,1fr)_minmax(0,1fr)_auto_minmax(0,1fr)_auto_minmax(0,1fr)_auto_auto] gap-3 pb-2 border-b border-line font-mono text-[10px] uppercase tracking-[0.08em] text-ink-4", children: [_jsx("span", { "aria-hidden": "true" }), _jsx("span", { children: t("pages.failedTasks.taskId") }), _jsx("span", { children: t("pages.failedTasks.painId") }), _jsx("span", { children: t("pages.failedTasks.status") }), _jsx("span", { children: t("pages.failedTasks.lastError") }), _jsx("span", { children: t("pages.failedTasks.attempts") }), _jsx("span", { children: t("pages.failedTasks.lastAttempt") }), _jsx("span", { "aria-hidden": "true" }), _jsx("span", { "aria-hidden": "true" })] }), tasks.map((task) => {
-                const isExpanded = expandedId === task.taskId;
-                return (_jsxs(Fragment, { children: [_jsxs("div", { className: "grid grid-cols-[auto_minmax(0,1fr)_minmax(0,1fr)_auto_minmax(0,1fr)_auto_minmax(0,1fr)_auto_auto] gap-3 py-2 items-center text-[13px] border-b border-line/50 last:border-b-0", children: [_jsx(Button, { variant: "quiet", size: "icon", className: "h-6 w-6 shrink-0 text-[12px]", onClick: () => toggleDetail(task.taskId), "aria-label": t("pages.failedTasks.detailToggle"), "aria-expanded": isExpanded, "data-testid": `detail-toggle-${task.taskId}`, children: isExpanded ? "▾" : "▸" }), _jsx("span", { className: "font-mono text-ink-2 truncate", title: task.taskId, children: truncateId(task.taskId) }), _jsx("span", { className: "font-mono text-ink-3 truncate", title: task.painId ?? "", children: task.painId ? truncateId(task.painId) : t("pages.failedTasks.noPainId") }), _jsx(Badge, { variant: statusToVariant(task.status), children: task.status }), _jsx("span", { className: "text-ink-3 truncate", title: task.lastError ?? "", children: task.lastError ?? "—" }), _jsx("span", { className: "font-mono text-ink-2 text-center", children: task.attemptCount }), _jsx("span", { className: "font-mono text-ink-3 text-[12px]", children: task.lastAttemptAt ? formatDateTime(task.lastAttemptAt) : "—" }), task.ownerDecisionRequired === true ? (_jsxs("span", { className: "whitespace-nowrap text-[12px]", children: [_jsx("span", { className: "text-amber", children: t("pages.failedTasks.awaitingOwnerDecision") }), " ", _jsx("a", { href: "#/focus", className: "text-gov underline underline-offset-2 hover:text-gov/80", "data-testid": `go-focus-${task.taskId}`, children: t("pages.failedTasks.goGovernanceFocus") })] })) : onRecover ? (_jsx(Button, { variant: "default", size: "sm", onClick: () => onRecover(task), className: "whitespace-nowrap", children: t("pages.failedTasks.recover") })) : null, _jsx(Button, { variant: "outline", size: "sm", onClick: () => onCreateDraft(task), className: "whitespace-nowrap", children: t("pages.failedTasks.createDraft") })] }), isExpanded && (_jsx("div", { className: "border border-line/60 rounded-[var(--radius-md)] bg-panel/60 p-4 mb-2", "data-testid": `detail-panel-${task.taskId}`, children: _jsx(TaskDetailPanel, { state: detail.status === "idle" ? { status: "loading", taskId: task.taskId } : detail, taskId: task.taskId, onRetry: requestDetail, t: t }) }))] }, task.taskId));
-            })] }));
-}
-function TaskDetailPanel({ state, taskId, onRetry, t }) {
-    if (state.status === "loading") {
-        return (_jsx("div", { className: "text-ink-3 text-[13px]", "data-testid": "detail-loading", children: t("common.loading") }));
-    }
-    if (state.status === "error") {
-        // rc-9: reason + next action + an explicit retry affordance
-        return (_jsxs("div", { className: "text-[13px] space-y-2", "data-testid": "detail-error", children: [_jsxs("div", { className: "text-danger", children: [t("pages.failedTasks.detailError"), ": ", state.message] }), state.nextAction && _jsx("div", { className: "text-ink-3", children: state.nextAction }), _jsx("div", { children: _jsx(Button, { variant: "outline", size: "sm", onClick: () => onRetry(taskId), children: t("common.refresh") }) })] }));
-    }
-    // The idle state only occurs if the panel renders for a task whose fetch was
-    // superseded mid-flight; treat it as loading for the row just expanded.
-    if (state.status === "idle" || state.taskId !== taskId) {
-        return (_jsx("div", { className: "text-ink-3 text-[13px]", "data-testid": "detail-loading", children: t("common.loading") }));
-    }
-    const { data } = state;
-    return (_jsxs("div", { className: "space-y-4 text-[13px]", children: [_jsxs("div", { className: "grid grid-cols-[auto_minmax(0,1fr)] gap-x-4 gap-y-1 font-mono text-[12px]", children: [_jsx("span", { className: "text-ink-4 uppercase tracking-[0.08em] self-center", children: t("pages.failedTasks.taskId") }), _jsx("span", { className: "text-ink-2 break-all", children: data.taskId }), _jsx("span", { className: "text-ink-4 uppercase tracking-[0.08em] self-center", children: t("pages.failedTasks.kind") }), _jsx("span", { className: "text-ink-2", children: data.taskKind }), _jsx("span", { className: "text-ink-4 uppercase tracking-[0.08em] self-center", children: t("pages.failedTasks.status") }), _jsx("span", { className: "text-ink-2", children: data.status }), _jsx("span", { className: "text-ink-4 uppercase tracking-[0.08em] self-center", children: t("pages.failedTasks.createdAt") }), _jsx("span", { className: "text-ink-3", children: formatDateTime(data.createdAt) }), data.updatedAt && (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-ink-4 uppercase tracking-[0.08em] self-center", children: t("pages.failedTasks.updatedAt") }), _jsx("span", { className: "text-ink-3", children: formatDateTime(data.updatedAt) })] })), _jsx("span", { className: "text-ink-4 uppercase tracking-[0.08em] self-center", children: t("pages.failedTasks.attempts") }), _jsxs("span", { className: "text-ink-2", children: [data.attemptCount, " / ", data.maxAttempts] }), _jsx("span", { className: "text-ink-4 uppercase tracking-[0.08em] self-center", children: t("pages.failedTasks.lastError") }), _jsx("span", { className: data.lastError ? "text-danger" : "text-ink-3", children: data.lastError ?? "—" })] }), _jsxs("div", { children: [_jsxs("div", { className: "font-mono text-[10px] uppercase tracking-[0.08em] text-ink-4 mb-2", children: [t("pages.failedTasks.runsTitle"), " (", data.runs.length, ")"] }), data.runs.length === 0 ? (_jsx("div", { className: "text-ink-3", children: t("pages.failedTasks.noRuns") })) : (_jsxs("div", { className: "space-y-1", children: [_jsxs("div", { className: "grid grid-cols-[auto_auto_minmax(0,1fr)_minmax(0,1fr)] gap-3 pb-1 border-b border-line/50 font-mono text-[10px] uppercase tracking-[0.08em] text-ink-4", children: [_jsx("span", { children: t("pages.failedTasks.runAttempt") }), _jsx("span", { children: t("pages.failedTasks.status") }), _jsx("span", { children: t("pages.failedTasks.runStarted") }), _jsx("span", { children: t("pages.failedTasks.runReason") })] }), data.runs.map((run) => (_jsxs("div", { className: "grid grid-cols-[auto_auto_minmax(0,1fr)_minmax(0,1fr)] gap-3 py-1 text-[12px] border-b border-line/30 last:border-b-0", title: `${t("pages.failedTasks.runEnded")}: ${run.endedAt ? formatDateTime(run.endedAt) : "—"}${run.errorCategory ? ` · ${t("pages.failedTasks.runErrorCategory")}: ${run.errorCategory}` : ""}`, children: [_jsxs("span", { className: "font-mono text-ink-2", children: ["#", run.attemptNumber] }), _jsx("span", { className: "font-mono text-ink-3", children: run.executionStatus }), _jsx("span", { className: "font-mono text-ink-3", children: formatDateTime(run.startedAt) }), _jsx("span", { className: "text-ink-3 break-words", title: run.reason ?? undefined, children: run.reason ?? (run.errorCategory ?? "—") })] }, run.runId)))] }))] })] }));
-}

package/console/dist/ui/pages/focus/ApprovalSubjectReading.d.ts

@@ -1,24 +0,0 @@
-import type { ApprovalsGroupedData } from '../../api.js';
-export declare function ApprovalSubjectReading({ principleId, approvalId, artifactId, channel, lockedReason, targetHost, onResolved, revisionReview, revisionReviewUnavailable, allowedActions, budgetNotice, promptInjection, sourceUnlinked, showPrincipleLink }: {
-    principleId: string;
-    approvalId: string;
-    artifactId: string;
-    channel: string;
-    lockedReason?: string;
-    targetHost?: 'openclaw' | 'codex' | 'workbuddy';
-    onResolved?: (message: string) => void;
-    revisionReview?: {
-        artifactId?: string;
-        artifactDigest?: string;
-        oldStatement: string;
-        newStatement: string;
-        intentFields: Record<string, string>;
-    };
-    revisionReviewUnavailable?: boolean;
-    /** Backend-assessed actions for THIS approval; absent means no per-action gate (the guarded submit still applies). */
-    allowedActions?: readonly ('approve' | 'reject' | 'edit_approval')[];
-    budgetNotice?: string;
-    promptInjection?: ApprovalsGroupedData['promptInjection'];
-    sourceUnlinked?: boolean;
-    showPrincipleLink?: boolean;
-}): import("react").JSX.Element;

package/console/dist/ui/pages/focus/ApprovalSubjectReading.js

@@ -1,133 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { Link, useLocation } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import { fetchApprovalReview, fetchOwnerDecisionView, approveApproval, rejectApproval, editApproval, fetchAllActivations } from '../../api.js';
-import { localizeApprovalWarning } from '../../utils/approval-warning-localization.js';
-import { truncateByCodePoints } from '../../utils/reading-layout.js';
-export function ApprovalSubjectReading({ principleId, approvalId, artifactId, channel, lockedReason, targetHost, onResolved, revisionReview, revisionReviewUnavailable, allowedActions, budgetNotice, promptInjection, sourceUnlinked, showPrincipleLink = true }) {
-    const { t } = useTranslation();
-    const location = useLocation();
-    const [review, setReview] = useState(null);
-    const [view, setView] = useState(null);
-    const [viewSettled, setViewSettled] = useState(false);
-    const [error, setError] = useState('');
-    const [resultText, setResultText] = useState('');
-    const [loading, setLoading] = useState(true);
-    const [busy, setBusy] = useState(false);
-    const [mode, setMode] = useState(null);
-    const [reason, setReason] = useState('');
-    const [newArtifact, setNewArtifact] = useState('');
-    const [intentReviewed, setIntentReviewed] = useState(false);
-    const [approveNote, setApproveNote] = useState('');
-    const epoch = useRef(0);
-    const read = useCallback(async () => {
-        const current = ++epoch.current;
-        setReview(null);
-        setLoading(true);
-        setIntentReviewed(false);
-        setError('');
-        const result = await fetchApprovalReview(approvalId);
-        if (current !== epoch.current)
-            return null;
-        setLoading(false);
-        if (result.success) {
-            setReview(result.data);
-            return result.data;
-        }
-        setError([result.error, result.nextAction].filter(Boolean).join(' '));
-        return null;
-    }, [approvalId]);
-    useEffect(() => {
-        setError('');
-        setResultText('');
-        setView(null);
-        setViewSettled(false);
-        setMode(null);
-        setReason('');
-        setNewArtifact('');
-        setApproveNote('');
-        let current = true;
-        void read();
-        void fetchOwnerDecisionView(principleId).then(result => { if (current) {
-            setView(result.success ? result.data : null);
-            setViewSettled(true);
-        } });
-        return () => { current = false; epoch.current++; };
-    }, [principleId, approvalId, artifactId, channel, read]);
-    const narrative = (field) => field.status === 'known' ? field.value.map(item => item.text).join('\n\n') : field.reason.ownerText;
-    const subject = view?.decisionSubjects.find(item => item.key === approvalId && item.channel === channel
-        && item.revisionArtifactId.status === 'known' && item.revisionArtifactId.value === review?.expectedReview.artifactId);
-    const materialBlocks = subject?.materialGates.find(gate => gate.actionSemantic === 'approve')?.requiredItems.filter(item => item.status !== 'satisfied') ?? [];
-    const revisionMatches = !revisionReview || (review?.expectedReview.artifactState === 'present' && review.expectedReview.artifactId === artifactId
-        && revisionReview.artifactId === review.expectedReview.artifactId && revisionReview.artifactDigest === review.expectedReview.artifactDigest);
-    const approveReady = review?.approval.status === 'pending' && subject !== undefined && review.expectedReview.artifactState === 'present' && review.material.exactBody !== null && review.material.availability === 'available' && revisionMatches && !revisionReviewUnavailable && materialBlocks.length === 0;
-    const may = (semantic) => allowedActions === undefined || allowedActions.includes(semantic);
-    async function submit(action) {
-        if (!review || busy || lockedReason || review.approval.status !== 'pending')
-            return;
-        if (!may(action === 'approve' ? 'approve' : action === 'reject' ? 'reject' : 'edit_approval'))
-            return;
-        if (action === 'approve' && (!approveReady || (revisionReview && !intentReviewed)))
-            return;
-        if (action !== 'approve' && !reason.trim())
-            return;
-        if (action === 'edit' && !newArtifact.trim())
-            return;
-        const snapshot = review;
-        const current = epoch.current;
-        setBusy(true);
-        setError('');
-        setResultText('');
-        const result = action === 'approve' ? await approveApproval(approvalId, approveNote.trim() || undefined, { expectedReview: snapshot.expectedReview, targetHost,
-            ...(revisionReview ? { intentReviewed, reviewedArtifactId: snapshot.expectedReview.artifactId } : {}) })
-            : action === 'reject' ? await rejectApproval(approvalId, reason.trim(), snapshot.expectedReview)
-                : await editApproval(approvalId, newArtifact.trim(), { reason: reason.trim(), expectedReview: snapshot.expectedReview });
-        if (current !== epoch.current)
-            return;
-        const fresh = await read();
-        setBusy(false);
-        if (!fresh) {
-            setError(t('pages.focus.workbench.resultUnknown'));
-            return;
-        }
-        if (fresh.approval.status === 'approved' || fresh.approval.status === 'rejected') {
-            const state = t(fresh.approval.status === 'approved' ? 'pages.focus.workbench.currentApproved' : 'pages.focus.workbench.currentRejected');
-            const ownOutcome = result.success && ((action === 'approve' && fresh.approval.status === 'approved') || (action === 'reject' && fresh.approval.status === 'rejected'));
-            const refused = !result.success && result.status !== undefined && result.status >= 400 && result.status < 500;
-            let message = ownOutcome ? t(fresh.approval.status === 'approved' ? 'pages.focus.workbench.approved' : 'pages.focus.workbench.rejected')
-                : refused ? t('pages.focus.workbench.refusedCurrentState', { state }) + ' ' + [result.error, result.nextAction].filter(Boolean).join(' ')
-                    : t('pages.focus.workbench.currentStateConfirmed', { state });
-            if (fresh.approval.status === 'approved' && !result.success && !refused) {
-                const activations = await fetchAllActivations(targetHost);
-                if (epoch.current !== current + 1)
-                    return;
-                const active = activations.success && activations.data.activations.some(item => item.artifactId === fresh.approval.artifactId && item.status === 'active');
-                message += ' ' + t(active ? 'pages.focus.workbench.runtimeCheckLink' : result.reason === 'activation_failed' ? 'pages.focus.workbench.activationFailed' : 'pages.focus.workbench.approvedRuntimeUnknown');
-            }
-            if (result.success && result.data.warning) {
-                const warning = localizeApprovalWarning(result.data.warning, t);
-                message += ` ${warning.title} ${warning.body ?? warning.detail}`;
-            }
-            setResultText(message);
-            onResolved?.(message);
-            return;
-        }
-        if (!result.success)
-            setError(t(result.status === undefined ? 'pages.focus.workbench.resultUnknown' : 'pages.focus.workbench.notRecorded') + ' ' + [result.error, result.nextAction].filter(Boolean).join(' '));
-        else if (action === 'edit') {
-            setResultText(t('pages.focus.workbench.replaced'));
-            setMode(null);
-            setReason('');
-            setNewArtifact('');
-            setApproveNote('');
-        }
-    }
-    const body = review?.material.exactBody;
-    const bodyText = body?.text ?? review?.material.statement ?? '';
-    return _jsxs("div", { className: "space-y-7", children: [_jsxs("section", { children: [_jsx("h3", { className: "mb-3 text-[15px] font-medium text-ink", children: t('pages.focus.workbench.why') }), sourceUnlinked && _jsx("p", { role: "alert", className: "mb-3 text-sm leading-relaxed text-amber", children: t('pages.focus.workbench.sourceUnlinked') }), _jsx("p", { className: "whitespace-pre-wrap text-[14px] leading-relaxed text-ink-2", children: view ? narrative(view.incidentSummary) : t('pages.focus.workbench.materialUnavailable') })] }), _jsxs("section", { children: [_jsx("h3", { className: "mb-3 text-[15px] font-medium text-ink", children: t('pages.focus.workbench.proposal') }), loading ? _jsx("p", { role: "status", className: "text-sm text-ink-3", children: t('pages.focus.workbench.loading') }) : _jsxs(_Fragment, { children: [bodyText ? _jsxs(_Fragment, { children: [_jsx("p", { className: "mb-2 text-[12px] text-ink-4", children: t(body?.kind === 'rule_code' ? 'pages.focus.workbench.codePreview' : 'pages.focus.workbench.textPreview') }), _jsx("p", { className: "whitespace-pre-wrap break-words text-[15px] leading-[1.85] text-ink", children: truncateByCodePoints(bodyText, 240) }), _jsxs("details", { className: "mt-4 rounded-[4px] border border-line px-4 py-3 text-[13px]", children: [_jsx("summary", { className: "cursor-pointer text-gov", children: t(body?.kind === 'rule_code' ? 'pages.focus.workbench.fullCode' : 'pages.focus.workbench.fullText') }), _jsx("div", { className: "mt-4 whitespace-pre-wrap break-words text-[15px] leading-[1.85] text-ink-2", children: bodyText })] })] }) : _jsx("p", { className: "text-sm text-amber", children: t('pages.focus.workbench.exactMaterialMissing') }), review?.material.scope.length ? _jsxs("div", { className: "mt-4", children: [_jsx("h4", { className: "text-sm font-medium text-ink", children: t('pages.focus.workbench.scope') }), _jsx("ul", { className: "mt-2 list-disc space-y-1 pl-5 text-[13px] leading-relaxed text-ink-2", children: review.material.scope.map((scope, index) => _jsx("li", { children: scope }, index)) })] }) : null, review?.material.rationale && _jsxs("details", { className: "mt-4 text-[13px] text-ink-3", children: [_jsx("summary", { className: "cursor-pointer text-gov", children: t('pages.focus.workbench.reasonAndScope') }), _jsx("p", { className: "mt-3 whitespace-pre-wrap leading-relaxed", children: review.material.rationale })] }), revisionReview && _jsxs("details", { className: "mt-4 text-[13px] leading-relaxed text-ink-2", children: [_jsx("summary", { className: "cursor-pointer text-gov", children: t('pages.focus.workbench.compare') }), _jsx("p", { className: "mt-3 whitespace-pre-wrap", children: revisionReview.oldStatement }), _jsx("p", { className: "mt-3 whitespace-pre-wrap", children: revisionReview.newStatement }), _jsx("dl", { className: "mt-3", children: Object.entries(revisionReview.intentFields).map(([key, value]) => _jsxs("div", { children: [_jsx("dt", { className: "font-medium", children: t(`pages.focus.intentField.${key}`, { defaultValue: key }) }), _jsx("dd", { children: value })] }, key)) })] })] })] }), _jsxs("section", { className: "border-t border-line pt-5", "data-testid": "approval-review-limits", children: [_jsx("h3", { className: "mb-3 text-[15px] font-medium text-ink", children: t('pages.focus.workbench.beforeDecision') }), viewSettled && !subject && _jsx("p", { className: "text-sm leading-relaxed text-amber", children: t('pages.focus.workbench.subjectUnconfirmed') }), review && _jsx("div", { className: "mb-3 text-sm leading-relaxed text-ink-2", "data-testid": "approval-exact-risks", children: review.material.risks?.length ? _jsx("ul", { className: "list-disc space-y-1 pl-5", children: review.material.risks.map((risk, index) => _jsx("li", { children: risk }, index)) }) : _jsx("p", { children: t(review.material.risks === null ? 'pages.focus.workbench.risksUnknown' : 'pages.focus.workbench.risksEmpty') }) }), materialBlocks.map(item => _jsx("p", { className: "mb-2 text-sm leading-relaxed text-amber", children: item.ownerText }, item.key)), !revisionMatches && _jsx("p", { role: "alert", className: "mb-2 text-sm text-amber", children: t('pages.focus.workbench.revisionChanged') }), revisionReviewUnavailable && _jsx("p", { role: "alert", className: "mb-2 text-sm text-amber", children: t('pages.focus.revisionReviewUnavailable') }), budgetNotice && channel === 'prompt' && _jsx("p", { role: "alert", className: "mb-2 text-sm leading-relaxed text-amber", "data-testid": `approve-queue-badge-${principleId}`, children: budgetNotice }), promptInjection && channel === 'prompt' && _jsxs("details", { className: "mb-3 text-[12px] leading-relaxed text-ink-3", "data-testid": `approve-queue-badge-scope-${principleId}`, children: [_jsx("summary", { className: "cursor-pointer text-gov", children: t('pages.focus.workbench.budgetBasis') }), _jsxs("p", { className: "mt-2", children: [promptInjection.route === 'shared_render' ? t('pages.focus.promptScopeShared') : t('pages.focus.promptScopeList', { full: promptInjection.fullRenderChars !== undefined ? t('pages.focus.promptScopeFullRender', { count: promptInjection.fullRenderChars }) : '' }), promptInjection.hostKind ? ` · ${promptInjection.hostKind}` : ''] }), _jsx("p", { className: "mt-2", children: promptInjection.budgetCapacityStatus === 'confirmed' && promptInjection.budgetContextWindowTokens !== undefined
-                                    ? promptInjection.budgetObservedAt !== undefined ? t('pages.focus.promptBudgetObservedNote', { source: t(promptInjection.budgetCapacitySource === 'pi_catalog_exact' ? 'pages.focus.budgetCapacitySourcePiCatalog' : promptInjection.budgetCapacitySource === 'operator_declared' ? 'pages.focus.budgetCapacitySourceOperatorDeclared' : 'pages.focus.budgetCapacitySourceHostWindow'), window: promptInjection.budgetContextWindowTokens, observedAt: promptInjection.budgetObservedAt })
-                                        : t('pages.focus.promptBudgetModelAwareNote', { window: promptInjection.budgetContextWindowTokens, sourceSuffix: promptInjection.budgetCapacitySource === 'operator_declared' ? t('pages.focus.budgetCapacitySourceOperatorDeclaredSuffix') : '' })
-                                    : promptInjection.budgetObservedAt !== undefined ? t('pages.focus.promptBudgetFallbackObservedNote', { reason: t(`pages.focus.budgetFallbackReason.${promptInjection.budgetFallbackReason}`, { defaultValue: promptInjection.budgetFallbackReason ?? 'unknown' }), observedAt: promptInjection.budgetObservedAt })
-                                        : t('pages.focus.promptBudgetFallbackNote', { reason: promptInjection.budgetFallbackReason ? t('pages.focus.promptBudgetFallbackReasonSuffix', { code: t(`pages.focus.budgetFallbackReason.${promptInjection.budgetFallbackReason}`, { defaultValue: promptInjection.budgetFallbackReason }) }) : '' }) })] }), review?.material.targetBehavior && _jsxs("div", { className: "mb-3 text-[14px] leading-relaxed text-ink-2", "data-testid": "approval-exact-target-behavior", children: [_jsx("h4", { className: "mb-1 font-medium", children: t('pages.focus.workbench.proposedBehavior') }), _jsx("p", { className: "whitespace-pre-wrap break-words", children: review.material.targetBehavior })] }), subject && _jsx("p", { className: "text-sm leading-relaxed text-ink-2", children: narrative(subject.decisionMaterial.consequence) }), _jsx("p", { className: "mt-2 text-[13px] leading-relaxed text-ink-3", children: t('pages.focus.workbench.scopeUnknown') }), view && _jsxs("details", { className: "mt-3 text-[13px] leading-relaxed text-ink-3", children: [_jsx("summary", { className: "cursor-pointer text-gov", children: t('pages.focus.workbench.principleLimits') }), _jsx("p", { className: "mt-3", children: view.nonApplicabilityOrUnknown.status === 'known' ? view.nonApplicabilityOrUnknown.value.map(item => item.text).join(' ') : view.nonApplicabilityOrUnknown.reason.ownerText }), _jsx("p", { className: "mt-2", children: view.risk.status === 'known' ? view.risk.value?.items.map(item => item.text).join(' ') || t('pages.principles.detail.ownerDecision.riskNotAssessed') : view.risk.reason?.ownerText }), _jsx("p", { className: "mt-2", children: view.uncertainty.status === 'known' ? view.uncertainty.value.map(item => item.text).join(' ') : view.uncertainty.reason.ownerText })] })] }), _jsxs("section", { className: "border-t border-line pt-5", children: [_jsx("h3", { className: "mb-3 text-[15px] font-medium text-ink", children: t('pages.focus.workbench.decision') }), lockedReason && _jsx("p", { role: "alert", className: "mb-3 text-[13px] leading-relaxed text-amber", children: lockedReason }), error && _jsx("p", { role: "alert", className: "mb-3 text-[13px] leading-relaxed text-amber", children: error }), resultText && _jsx("p", { role: "status", className: "mb-3 text-sm leading-relaxed text-ink", children: resultText }), !review && !loading && _jsx("button", { type: "button", className: "text-sm text-gov underline", onClick: () => { void read(); }, children: t('pages.focus.workbench.retry') }), review?.approval.status === 'pending' && _jsxs(_Fragment, { children: [_jsxs("details", { className: "mb-4 text-sm text-ink-3", children: [_jsx("summary", { className: "cursor-pointer text-gov", children: t('pages.focus.workbench.approvalNote') }), _jsxs("label", { className: "mt-3 block", children: [t('pages.focus.workbench.approvalNote'), _jsx("textarea", { value: approveNote, maxLength: 2000, onChange: event => setApproveNote(event.target.value), className: "mt-2 block w-full rounded border border-line bg-panel px-3 py-2" })] })] }), revisionReview && _jsxs("label", { className: "mb-4 block text-sm text-ink-2", children: [_jsx("input", { type: "checkbox", checked: intentReviewed, onChange: event => setIntentReviewed(event.target.checked), className: "mr-2" }), t('pages.focus.workbench.intentReviewed')] }), _jsx("p", { className: "mb-4 text-[12.5px] leading-relaxed text-ink-3", children: t(channel === 'code_tool_hook' ? 'pages.focus.workbench.ruleConsequence' : channel === 'defer_archive' ? 'pages.focus.workbench.archiveConsequence' : 'pages.focus.workbench.promptConsequence') }), _jsxs("div", { className: "flex flex-wrap gap-3", children: [_jsx("button", { type: "button", disabled: !approveReady || busy || Boolean(lockedReason) || !may('approve') || Boolean(revisionReview && !intentReviewed), "data-testid": `approve-btn-${principleId}`, onClick: () => { void submit('approve'); }, className: "rounded-[4px] border border-gov bg-gov px-4 py-2.5 text-[13px] text-paper disabled:opacity-50", children: t(channel === 'defer_archive' ? 'pages.focus.workbench.approveArchive' : 'pages.focus.workbench.approveOne') }), _jsx("button", { type: "button", disabled: busy || Boolean(lockedReason) || !may('reject'), onClick: () => setMode('reject'), className: "rounded-[4px] border border-line px-4 py-2.5 text-[13px] text-ink disabled:opacity-50", children: t('pages.focus.workbench.rejectOne') }), _jsx("button", { type: "button", "data-testid": `edit-btn-${principleId}`, disabled: busy || Boolean(lockedReason) || !may('edit_approval') || review.expectedReview.artifactState === 'missing', onClick: () => setMode('edit'), className: "text-[13px] text-gov underline disabled:opacity-50", children: t('pages.focus.workbench.replaceOne') })] }), mode && _jsxs("form", { className: "mt-4 space-y-3", onSubmit: event => { event.preventDefault(); void submit(mode); }, children: [mode === 'edit' && _jsxs("label", { className: "block text-sm text-ink-2", children: [t('pages.focus.workbench.replacementId'), _jsx("input", { value: newArtifact, onChange: event => setNewArtifact(event.target.value), className: "mt-2 block w-full rounded border border-line bg-panel px-3 py-2" })] }), _jsxs("label", { className: "block text-sm text-ink-2", children: [t('pages.focus.workbench.reason'), _jsx("textarea", { value: reason, maxLength: 2000, onChange: event => setReason(event.target.value), className: "mt-2 block w-full rounded border border-line bg-panel px-3 py-2" })] }), _jsx("button", { type: "submit", disabled: busy || !reason.trim() || (mode === 'edit' && !newArtifact.trim()), className: "rounded border border-line px-4 py-2 text-sm disabled:opacity-50", children: t('pages.focus.workbench.confirm') }), _jsx("button", { type: "button", onClick: () => setMode(null), className: "ml-3 text-sm text-ink-3", children: t('pages.focus.workbench.cancel') })] })] }), showPrincipleLink && _jsx(Link, { className: "mt-5 inline-block text-[13px] text-gov underline underline-offset-4", state: { returnTo: `/focus${location.search}` }, to: `/principles/${encodeURIComponent(principleId)}`, children: t('pages.focus.workbench.openPrinciple') }), _jsxs("details", { className: "mt-4 text-[12px] text-ink-4", children: [_jsx("summary", { className: "cursor-pointer", children: t('pages.focus.workbench.subjectDetails') }), _jsxs("dl", { className: "mt-2 break-all font-mono", children: [_jsxs("div", { children: ["approval: ", approvalId] }), _jsxs("div", { children: ["artifact: ", review?.expectedReview.artifactId ?? artifactId] }), _jsxs("div", { children: ["channel: ", review?.expectedReview.channel ?? channel] })] })] })] })] });
-}