jiang
617ba4d87c
Derive the gem-blue palette with OKLCH tonal and complementary-color rules while preserving acrylic opacity, blur and surface hierarchy. Darker focus tokens exposed stacked field rings, fallback outlines and persistent basemap selection rings. Keep fallback focus styles in the base layer and use one themed field boundary or inset card stroke. Preserve keyboard focus, invalid states and native input semantics. Add browser regression coverage for pointer and keyboard focus, all basemap presentations, narrow layouts and rendered contrast. Validation in an isolated checkout: pnpm lint, pnpm typecheck, pnpm test (393 tests), focused browser suites and pnpm build.
34 lines
2.5 KiB
TypeScript
34 lines
2.5 KiB
TypeScript
import { ShieldCheck } from "lucide-react";
|
|
import type { OperationalTask, OperationalTaskDecision } from "../api/operational-task-client";
|
|
import { AccessRequestCard, HumanActionCard } from "./agent-execution-plan-panel";
|
|
|
|
type TaskConversationReviewProps = {
|
|
task: OperationalTask;
|
|
onAccessDecision: (requestId: string, version: number, decision: "approved" | "rejected", scopes: string[]) => Promise<unknown>;
|
|
onActionDecision: (actionId: string, version: number, decision: OperationalTaskDecision, comment?: string) => Promise<unknown>;
|
|
onActionExecute: (actionId: string, version: number) => Promise<unknown>;
|
|
onDraftUpdate: (actionId: string, version: number, payload: Record<string, unknown>) => Promise<unknown>;
|
|
onConfirmDispatch: (actionId: string, version: number) => Promise<unknown>;
|
|
onActionReconcile: (actionId: string, version: number) => Promise<unknown>;
|
|
onRefresh: () => void;
|
|
};
|
|
|
|
export function TaskConversationReview({ task, onAccessDecision, onActionDecision, onActionExecute,
|
|
onDraftUpdate, onConfirmDispatch, onActionReconcile, onRefresh }: TaskConversationReviewProps) {
|
|
const pendingAccess = task.access_requests.filter((request) => request.status === "pending");
|
|
const pendingActions = task.actions.filter((action) => action.approval_status === "pending"
|
|
|| action.approval_status === "approved" && ["not_submitted", "submitted", "unknown"].includes(action.execution_status));
|
|
if (pendingAccess.length === 0 && pendingActions.length === 0) return null;
|
|
return <section aria-label="当前任务审核" className="surface-reading space-y-2 rounded-xl border border-[var(--surface-border)]/80 p-3">
|
|
<div className="flex items-center gap-1.5 text-xs font-semibold text-slate-800"><ShieldCheck size={14} aria-hidden="true" />当前任务审核 · {task.title}</div>
|
|
{pendingAccess.map((request) => <AccessRequestCard key={request.access_request_id} request={request}
|
|
nodeTitle={task.latest_plan?.plan.nodes.find((node) => node.id === request.node_id)?.title}
|
|
canDecide={task.permissions.can_decide_access}
|
|
onDecision={(requestId, version, decision, scopes) => onAccessDecision(requestId, version, decision, scopes)}
|
|
onRefresh={onRefresh} />)}
|
|
{pendingActions.map((action) => <HumanActionCard key={action.action_id} task={task} action={action}
|
|
onDecision={onActionDecision} onExecute={onActionExecute} onDraftUpdate={onDraftUpdate}
|
|
onConfirmDispatch={onConfirmDispatch} onReconcile={onActionReconcile} onRefresh={onRefresh} />)}
|
|
</section>;
|
|
}
|