Hugging Face's logo

Spaces:
GaryLeckey
/
aureon-os
Running

App Files Community
aureon-os / frontend /src /components /generated /AureonCodingOrganismConsole.tsx
GaryLeckey's picture
GaryLeckey
Deploy Aureon OS (deploy/selfhost stack: nginx edge + fusion API x2 + console + HNC organ + redis + postgres; paper mode) (part 18)
f568a4f verified
Raw History Blame Contribute Delete
122 kB
import { useEffect, useState, type ChangeEvent } from "react";
import { BrainCircuit, CheckCircle2, Code2, FileText, MessageSquare, MousePointer2, Radio, RefreshCw, Send, ShieldCheck, TestTube2, Upload } from "lucide-react";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { ScrollArea } from "@/components/ui/scroll-area";
import { Textarea } from "@/components/ui/textarea";
import { marketStatusPort } from "@/config/serviceEndpoints";
import {
AUREON_EVOLUTION_RUNTIME_PATCH_SUMMARY,
AUREON_EVOLUTION_RUNTIME_PATCHES,
aureonEvolutionActivePatchCount,
} from "@/components/generated/aureonEvolutionRuntimePatches";
type JsonMap = Record<string, any>;
type ChatMessage = {
role: "user" | "assistant";
text: string;
ts?: string;
source?: string;
model?: string;
latency_ms?: number;
response_quality?: { score?: number; passed?: boolean; compiler_applied?: boolean; snags?: string[] };
weaver?: { policy?: string; shards?: Array<{ name?: string; ok?: boolean; latency_ms?: number }> };
dynamic_filter?: {
filter_mode?: string;
lane?: string;
task_family?: string;
source_packets?: Array<{ title?: string; source_path?: string; confidence?: number }>;
hnc_auris_report?: JsonMap;
handover_ready?: boolean;
};
};
type ArtifactItem = {
url: string;
path?: string;
kind: "image" | "video" | "file";
title: string;
};
const HUB_BASE = "http://127.0.0.1:13002";
const LIVE_REFRESH_FALLBACK_MS = 1000;
const FULL_ORGANISM_COMMAND = `.\\AUREON_PRODUCTION_LIVE.cmd -WaitForRefresh -MarketStatusPort ${marketStatusPort}`;
const TERMINAL_PROMPT_COMMAND =
"Invoke-RestMethod http://127.0.0.1:13002/api/coding/prompt -Method Post -ContentType \"application/json\" -Body $body";
async function fetchJson(url: string): Promise<JsonMap> {
try {
const response = await fetch(url, { cache: "no-store" });
if (!response.ok) return {};
return await response.json();
} catch {
return {};
}
}
function hasPayload(value: unknown): value is JsonMap {
return Boolean(value) && typeof value === "object" && !Array.isArray(value) && Object.keys(value as JsonMap).length > 0;
}
function summaryNumber(value: unknown, key: string): number {
if (!hasPayload(value)) return 0;
const summary = hasPayload(value.summary) ? value.summary : {};
const number = Number(summary[key] || 0);
return Number.isFinite(number) ? number : 0;
}
function fmt(value: unknown): string {
const number = Number(value || 0);
return Number.isFinite(number) ? number.toLocaleString() : String(value || "0");
}
function compactEvidence(stage: JsonMap): string {
const evidence = stage.evidence || {};
const parts: string[] = [];
if (evidence.intent) parts.push(`intent ${evidence.intent}`);
if (evidence.tool_used) parts.push(`tool ${evidence.tool_used}`);
if (evidence.plan_status) parts.push(`plan ${evidence.plan_status}`);
if (evidence.proposal_status) parts.push(`proposal ${evidence.proposal_status}`);
if (typeof evidence.vm_tool_count !== "undefined") parts.push(`VM tools ${evidence.vm_tool_count}`);
if (Array.isArray(evidence.commands)) parts.push(`${evidence.commands.length} command(s)`);
if (Array.isArray(evidence.published_files)) parts.push(`${evidence.published_files.length} file(s) published`);
if (evidence.validation?.confidence) parts.push(`confidence ${Math.round(Number(evidence.validation.confidence) * 100)}%`);
return parts.join(" | ") || "evidence attached";
}
function normalizePublicUrl(value: unknown): string {
const raw = String(value || "").trim();
if (!raw) return "";
if (/^https?:\/\//i.test(raw)) return raw;
if (raw.startsWith("/")) return raw;
const publicIndex = raw.replace(/\\/g, "/").indexOf("frontend/public/");
if (publicIndex >= 0) {
return `/${raw.replace(/\\/g, "/").slice(publicIndex + "frontend/public/".length)}`;
}
return raw.startsWith("aureon_") ? `/${raw}` : raw;
}
function artifactKind(url: string): ArtifactItem["kind"] {
const lower = url.toLowerCase();
if (/\.(svg|png|jpe?g|gif|webp)(?:$|\?)/.test(lower)) return "image";
if (/\.(mp4|webm|mov)(?:$|\?)/.test(lower)) return "video";
return "file";
}
function collectArtifacts(status: JsonMap): ArtifactItem[] {
const found: ArtifactItem[] = [];
const push = (urlValue: unknown, pathValue: unknown, titleValue: unknown) => {
const url = normalizePublicUrl(urlValue);
if (!url || found.some((item) => item.url === url)) return;
found.push({
url,
path: String(pathValue || ""),
kind: artifactKind(url),
title: String(titleValue || "Aureon artifact"),
});
};
const steps = status.goal_route?.plan?.steps;
if (Array.isArray(steps)) {
steps.forEach((step: JsonMap) => {
const result = step.execution_result || step.result?.result || step.result || {};
push(result.public_url, result.asset_path || result.artifact_path, step.title || step.intent);
push(result.preview_url, result.preview_path, step.title || step.intent);
});
}
push(status.public_url, status.asset_path || status.artifact_path, status.subject || status.status);
push(status.where?.public_url, status.where?.asset_path, status.what?.subject || "Aureon artifact");
push(status.artifact_manifest?.public_url, status.artifact_manifest?.asset_path, status.task_family || "Capability forge artifact");
push(status.artifact_manifest?.preview_url, status.artifact_manifest?.preview_path, status.task_family || "Capability forge preview");
push(status.capability_forge?.artifact_manifest?.public_url, status.capability_forge?.artifact_manifest?.asset_path, status.capability_forge?.task_family || "Capability forge artifact");
push(status.capability_forge?.artifact_manifest?.preview_url, status.capability_forge?.artifact_manifest?.preview_path, status.capability_forge?.task_family || "Capability forge preview");
const complexCases = status.complex_build_stress_audit?.cases;
if (Array.isArray(complexCases)) {
complexCases.forEach((stressCase: JsonMap) => {
const manifest = stressCase.quality_report?.artifact_manifest || {};
const title = stressCase.id || stressCase.actual_artifacts?.kind || "Complex stress artifact";
push(manifest.preview_url || stressCase.actual_artifacts?.url, manifest.preview_path || stressCase.actual_artifacts?.path, title);
push(manifest.public_url || stressCase.actual_artifacts?.url, manifest.asset_path || stressCase.actual_artifacts?.path, title);
});
}
return found;
}
export function AureonCodingOrganismConsole() {
const [status, setStatus] = useState<JsonMap>({});
const [prompt, setPrompt] = useState("Connect Aureon coding systems, inspect the repo, propose the smallest safe patch, and run focused tests.");
const [runTests, setRunTests] = useState(true);
const [includeDesktop, setIncludeDesktop] = useState(true);
const [busy, setBusy] = useState(false);
const [error, setError] = useState("");
const [loadedFileName, setLoadedFileName] = useState("");
const [scopeAnswers, setScopeAnswers] = useState<Record<string, string>>({});
const [phiStatus, setPhiStatus] = useState<JsonMap>({});
const [chatInput, setChatInput] = useState("What can you see in the coding cockpit right now?");
const [chatMessages, setChatMessages] = useState<ChatMessage[]>([]);
const [chatBusy, setChatBusy] = useState(false);
const [chatError, setChatError] = useState("");
const [ollamaStatus, setOllamaStatus] = useState<JsonMap>({});
const [localApprovalState, setLocalApprovalState] = useState("");
const enrichWithForgeState = async (payload: JsonMap): Promise<JsonMap> => {
const forgeState = await fetchJson("/aureon_capability_forge.json");
const qualityState = await fetchJson("/aureon_artifact_quality_report.json");
const creativeGuardianState = await fetchJson("/aureon_agent_creative_process_guardian.json");
const ollamaCognitiveState = await fetchJson("/aureon_ollama_cognitive_bridge.json");
const dynamicFilterState = await fetchJson("/aureon_dynamic_prompt_filter.json");
const stressAuditState = await fetchJson("/aureon_capability_stress_audit.json");
const complexStressState = await fetchJson("/aureon_complex_build_stress_audit.json");
const codingCapabilityState = await fetchJson("/aureon_coding_capability_unblocker.json");
const selfFixState = await fetchJson("/aureon_autonomous_self_fix_director.json");
const selfRunState = await fetchJson("/aureon_autonomous_self_run_loop.json");
const liveSelfRunState = await fetchJson(`${HUB_BASE}/api/autonomous-self-run/status`);
const publicJobsState = await fetchJson("/aureon_autonomous_job_executor.json");
const liveJobsState = await fetchJson(`${HUB_BASE}/api/autonomous-jobs/status`);
const evolutionQueueCertificationState = await fetchJson("/aureon_evolution_queue_autonomous_certification.json");
const workOrderExecutionState = await fetchJson("/aureon_frontend_work_order_execution.json");
const runtimePatchRegistryState = await fetchJson("/aureon_frontend_runtime_patch_registry.json");
const next = { ...payload };
if (hasPayload(forgeState) && !hasPayload(next.capability_forge)) {
next.capability_forge = forgeState;
}
if (hasPayload(qualityState) && !hasPayload(next.artifact_quality_report)) {
next.artifact_quality_report = qualityState;
}
if (hasPayload(creativeGuardianState) && !hasPayload(next.creative_process_guardian)) {
next.creative_process_guardian = creativeGuardianState;
}
if (hasPayload(ollamaCognitiveState) && !hasPayload(next.ollama_cognitive_bridge)) {
next.ollama_cognitive_bridge = ollamaCognitiveState;
}
if (hasPayload(dynamicFilterState) && !hasPayload(next.dynamic_prompt_filter)) {
next.dynamic_prompt_filter = dynamicFilterState;
}
if (hasPayload(stressAuditState) && !hasPayload(next.capability_stress_audit)) {
next.capability_stress_audit = stressAuditState;
}
if (hasPayload(complexStressState) && !hasPayload(next.complex_build_stress_audit)) {
next.complex_build_stress_audit = complexStressState;
}
if (hasPayload(codingCapabilityState) && !hasPayload(next.coding_capability_unblocker)) {
next.coding_capability_unblocker = codingCapabilityState;
}
if (hasPayload(selfFixState) && !hasPayload(next.autonomous_self_fix_director)) {
next.autonomous_self_fix_director = selfFixState;
}
if (hasPayload(liveSelfRunState) && summaryNumber(liveSelfRunState, "latest_task_count") > 0) {
next.autonomous_self_run_loop = liveSelfRunState;
} else if (
hasPayload(selfRunState) &&
(!hasPayload(next.autonomous_self_run_loop) ||
summaryNumber(selfRunState, "latest_task_count") > summaryNumber(next.autonomous_self_run_loop, "latest_task_count"))
) {
next.autonomous_self_run_loop = selfRunState;
}
if (hasPayload(liveJobsState)) {
next.autonomous_job_executor = liveJobsState;
} else if (hasPayload(publicJobsState) && !hasPayload(next.autonomous_job_executor)) {
next.autonomous_job_executor = publicJobsState;
}
if (
hasPayload(evolutionQueueCertificationState) &&
(!hasPayload(next.evolution_queue_autonomous_certification) ||
summaryNumber(evolutionQueueCertificationState, "processed_count") >
summaryNumber(next.evolution_queue_autonomous_certification, "processed_count"))
) {
next.evolution_queue_autonomous_certification = evolutionQueueCertificationState;
}
if (
hasPayload(workOrderExecutionState) &&
(!hasPayload(next.frontend_work_order_execution) ||
summaryNumber(workOrderExecutionState, "executed_count") > summaryNumber(next.frontend_work_order_execution, "executed_count"))
) {
next.frontend_work_order_execution = workOrderExecutionState;
}
if (
hasPayload(runtimePatchRegistryState) &&
(!hasPayload(next.frontend_runtime_patch_registry) ||
summaryNumber(runtimePatchRegistryState, "active_patch_count") >
summaryNumber(next.frontend_runtime_patch_registry, "active_patch_count"))
) {
next.frontend_runtime_patch_registry = runtimePatchRegistryState;
}
return next;
};
const refresh = async () => {
const hubState = await fetchJson(`${HUB_BASE}/api/coding/status`);
if (Object.keys(hubState).length) {
setStatus(await enrichWithForgeState(hubState.last_run || hubState));
return;
}
const publicState = await fetchJson("/aureon_coding_organism_bridge.json");
setStatus(await enrichWithForgeState(publicState));
};
const refreshPhiBridge = async () => {
const payload = await fetchJson(`${HUB_BASE}/api/phi-bridge/status`);
if (!Object.keys(payload).length) return;
setPhiStatus(payload);
if (hasPayload(payload.ollama_cognitive_bridge)) {
setOllamaStatus(payload.ollama_cognitive_bridge);
}
const recent = payload.chat?.recent;
if (Array.isArray(recent) && recent.length) {
setChatMessages((current) =>
current.length
? current
: recent
.filter((item: JsonMap) => item.role === "user" || item.role === "assistant")
.map((item: JsonMap) => ({
role: item.role,
text: String(item.text || ""),
ts: item.ts,
source: item.source,
model: item.model,
latency_ms: item.latency_ms,
weaver: item.weaver,
dynamic_filter: item.dynamic_filter,
}))
);
}
};
const refreshOllamaBridge = async () => {
const livePayload = await fetchJson(`${HUB_BASE}/api/ollama-cognitive/status`);
if (Object.keys(livePayload).length) {
setOllamaStatus(livePayload);
return;
}
const publicPayload = await fetchJson("/aureon_ollama_cognitive_bridge.json");
if (Object.keys(publicPayload).length) {
setOllamaStatus(publicPayload);
}
};
useEffect(() => {
refresh();
refreshPhiBridge();
refreshOllamaBridge();
const timer = window.setInterval(() => {
refresh();
refreshPhiBridge();
refreshOllamaBridge();
}, LIVE_REFRESH_FALLBACK_MS);
return () => window.clearInterval(timer);
}, []);
const submitPrompt = async (extraBody: JsonMap = {}) => {
setBusy(true);
setError("");
try {
const response = await fetch(`${HUB_BASE}/api/coding/prompt`, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ prompt, run_tests: runTests, include_desktop: includeDesktop, ...extraBody }),
});
const payload = await response.json();
if (!response.ok) {
throw new Error(payload.error || "coding prompt failed");
}
setStatus(payload);
} catch (err) {
setError(err instanceof Error ? err.message : String(err));
} finally {
setBusy(false);
}
};
const sendPhiChat = async () => {
const message = chatInput.trim();
if (!message || chatBusy) return;
setChatBusy(true);
setChatError("");
setChatInput("");
setChatMessages((current) => [
...current.slice(-18),
{ role: "user", text: message, ts: new Date().toISOString() },
]);
try {
const response = await fetch(`${HUB_BASE}/api/phi-bridge/chat`, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
message,
context: {
coding: {
status: status.status,
scope_status: summary.scope_status,
route_clean: summary.goal_route_clean,
tests_ok: summary.tests_ok,
ready_to_run: summary.ready_to_run,
blocking_snags: summary.blocking_snag_count || 0,
goal: status.what?.goal || prompt.slice(0, 240),
},
dashboard: {
panel: "AureonCodingOrganismConsole",
endpoint: `${HUB_BASE}/api/phi-bridge/chat`,
},
},
}),
});
const payload = await response.json();
if (!response.ok) {
throw new Error(payload.error || "phi bridge chat failed");
}
setChatMessages((current) => [
...current.slice(-19),
{
role: "assistant",
text: String(payload.reply || "No reply published."),
ts: payload.generated_at,
source: payload.reply_source,
model: payload.model,
latency_ms: payload.latency_ms,
response_quality: payload.response_quality
? {
score: Number(payload.response_quality.score || 0),
passed: Boolean(payload.response_quality.passed),
compiler_applied: Boolean(payload.response_quality.compiler_applied),
snags: Array.isArray(payload.response_quality.snags)
? payload.response_quality.snags.map((item: unknown) => String(item))
: [],
}
: undefined,
dynamic_filter: payload.dynamic_prompt_filter
? {
filter_mode: payload.dynamic_prompt_filter.filter_mode,
lane: payload.dynamic_prompt_filter.lane,
task_family: payload.dynamic_prompt_filter.task_family,
source_packets: Array.isArray(payload.dynamic_prompt_filter.source_packets)
? payload.dynamic_prompt_filter.source_packets.map((packet: JsonMap) => ({
title: String(packet.title || ""),
source_path: String(packet.source_path || ""),
confidence: Number(packet.confidence || 0),
}))
: [],
hnc_auris_report: payload.dynamic_prompt_filter.hnc_auris_report || {},
handover_ready: Boolean(payload.dynamic_prompt_filter.handover_ready),
}
: undefined,
weaver: payload.weaver_trace
? {
policy: payload.weaver_trace.policy,
shards: Array.isArray(payload.weaver_trace.shards)
? payload.weaver_trace.shards.map((shard: JsonMap) => ({
name: String(shard.name || ""),
ok: Boolean(shard.ok),
latency_ms: Number(shard.latency_ms || 0),
}))
: [],
}
: undefined,
},
]);
await refreshPhiBridge();
await refresh();
} catch (err) {
setChatError(err instanceof Error ? err.message : String(err));
} finally {
setChatBusy(false);
}
};
const reloadPhiVoiceWorker = async () => {
setChatError("");
try {
const response = await fetch(`${HUB_BASE}/api/phi-bridge/reload`, { method: "POST" });
const payload = await response.json();
if (!response.ok) {
throw new Error(payload.error || "phi voice reload failed");
}
if (hasPayload(payload.ollama_cognitive_bridge)) {
setOllamaStatus(payload.ollama_cognitive_bridge);
}
await refreshPhiBridge();
} catch (err) {
setChatError(err instanceof Error ? err.message : String(err));
}
};
const approveScope = async () => {
await submitPrompt({
scope_approved: true,
scope_answers: scopeAnswers,
base_job_id: status.client_job?.job_id || "",
});
};
const sendFullCodingJob = async () => {
await submitPrompt({
scope_approved: true,
scope_answers: {
goal: prompt,
deliverables: "Repo changes or reports, code proposal, focused tests, proof checklist, snagging result, and client handover.",
target_system: "Aureon repository, coding organism bridge, generated console evidence, and target files named by the prompt.",
constraints: "Preserve live trading, payment, filing, credential, and destructive OS boundaries. Do not expose secrets.",
acceptance: "Goal route is clean, focused tests pass or are explicitly skipped, HNC/Auris proof is recorded, and blocking snags are zero.",
...scopeAnswers,
},
base_job_id: status.client_job?.job_id || "",
});
};
const loadPromptFile = async (event: ChangeEvent<HTMLInputElement>) => {
const file = event.target.files?.[0];
if (!file) return;
const text = await file.text();
setLoadedFileName(file.name);
setPrompt(
`Aureon must ingest ${file.name}, marry up what Codex can do with Aureon, write bridge work orders, test itself, and publish a completion report.\n\n` +
`Source document uploaded through the coding organism UI:\n\n${text}`
);
event.target.value = "";
};
const summary = status.summary || {};
const route = status.goal_route || {};
const plan = route.plan || {};
const safeCode = status.safe_code_status || {};
const tests = status.tests || {};
const desktop = status.desktop_run_flow || {};
const desktopController = desktop.local_desktop_controller || {};
const productAudit = status.finished_product_audit || {};
const clientJob = status.client_job || {};
const capabilityForge = status.capability_forge || clientJob.capability_forge || {};
const qualityReport = status.artifact_quality_report || clientJob.artifact_quality_report || capabilityForge.artifact_quality_report || {};
const stressAudit = status.capability_stress_audit || {};
const stressSummary = stressAudit.summary || {};
const stressCases = Array.isArray(stressAudit.cases) ? stressAudit.cases : [];
const complexStress = status.complex_build_stress_audit || {};
const complexSummary = complexStress.summary || {};
const complexCases = Array.isArray(complexStress.cases) ? complexStress.cases : [];
const selfFix = status.autonomous_self_fix_director || {};
const selfFixSummary = selfFix.summary || {};
const selfFixSwot = selfFix.swot || {};
const selfFixBacklog = Array.isArray(selfFix.repair_backlog) ? selfFix.repair_backlog : [];
const selfFixSelectedRepairs = Array.isArray(selfFix.selected_repairs) ? selfFix.selected_repairs : [];
const selfFixPatchEvidence = Array.isArray(selfFix.patch_apply_evidence) ? selfFix.patch_apply_evidence : [];
const selfFixSnags = Array.isArray(selfFix.snags) ? selfFix.snags : [];
const selfFixCodexAudit = selfFix.codex_audit_state || {};
const selfRun = status.autonomous_self_run_loop || {};
const selfRunSummary = selfRun.summary || {};
const selfRunHeartbeat = selfRun.heartbeat || {};
const selfRunCycles = Array.isArray(selfRun.cycles) ? selfRun.cycles : [];
const selfRunLatest = selfRunCycles.length ? selfRunCycles[selfRunCycles.length - 1] : {};
const selfRunTasks = Array.isArray(selfRunLatest.tasks) ? selfRunLatest.tasks : [];
const selfRunWorkOrders = Array.isArray(selfRun.autonomous_work_orders) ? selfRun.autonomous_work_orders : [];
const selfRunHardHolds = Array.isArray(selfRun.hard_boundary_holds) ? selfRun.hard_boundary_holds : [];
const autonomousJobs = status.autonomous_job_executor || {};
const autonomousJobsSummary = autonomousJobs.summary || {};
const autonomousJobList = Array.isArray(autonomousJobs.jobs)
? autonomousJobs.jobs
: Array.isArray(autonomousJobs.recent_jobs)
? autonomousJobs.recent_jobs
: [];
const autonomousActiveJob = autonomousJobs.active_job || autonomousJobs.current_job || {};
const autonomousRecentJobs = autonomousJobList.slice(-5).reverse();
const autonomousProof = Array.isArray(autonomousActiveJob.proof_checklist) ? autonomousActiveJob.proof_checklist : [];
const evolutionQueueCertification = status.evolution_queue_autonomous_certification || {};
const evolutionQueueCertificationSummary = evolutionQueueCertification.summary || {};
const evolutionQueueCertificationCases = Array.isArray(evolutionQueueCertification.cases)
? evolutionQueueCertification.cases
: Array.isArray(evolutionQueueCertification.sample_cases)
? evolutionQueueCertification.sample_cases
: [];
const workOrderExecution = status.frontend_work_order_execution || {};
const workOrderExecutionSummary = workOrderExecution.summary || {};
const workOrderMovement = workOrderExecution.queue_movement || {};
const workOrderValidation = workOrderExecution.validation_summary || {};
const runtimePatchRegistry = status.frontend_runtime_patch_registry || workOrderExecution.runtime_patch_registry || {};
const runtimePatchSummary = runtimePatchRegistry.summary || {};
const runtimePatches = Array.isArray(runtimePatchRegistry.patches) ? runtimePatchRegistry.patches : [];
const materializedPatchCount = AUREON_EVOLUTION_RUNTIME_PATCHES.length;
const materializedActivePatchCount = aureonEvolutionActivePatchCount();
const codingCapability = status.coding_capability_unblocker || clientJob.coding_capability_unblocker || {};
const codingCapabilitySummary = codingCapability.summary || {};
const codingGates = Array.isArray(codingCapability.autonomous_gates) ? codingCapability.autonomous_gates : [];
const codingWorkOrders = Array.isArray(codingCapability.autonomous_work_orders) ? codingCapability.autonomous_work_orders : [];
const sourceRoutes = Array.isArray(codingCapability.source_discovery_routes) ? codingCapability.source_discovery_routes : [];
const creativeGuardian = status.creative_process_guardian || clientJob.creative_process_guardian || {};
const creativeSummary = creativeGuardian.summary || {};
const creativeMind = creativeGuardian.organism_mind_contract || {};
const creativeSources = Array.isArray(creativeMind.source_contracts) ? creativeMind.source_contracts : [];
const creativeLoop = Array.isArray(creativeGuardian.creative_process_loop) ? creativeGuardian.creative_process_loop : [];
const creativeRoleMap = Array.isArray(creativeGuardian.agent_creative_process_map) ? creativeGuardian.agent_creative_process_map : [];
const creativeSnags = Array.isArray(creativeGuardian.snagging_list) ? creativeGuardian.snagging_list : [];
const qualityChecks = Array.isArray(qualityReport.checks) ? qualityReport.checks : [];
const qualitySnags = Array.isArray(qualityReport.snags) ? qualityReport.snags : [];
const adaptiveSkill = (capabilityForge.adaptive_skill_evidence || capabilityForge.adaptive_skill_report?.adaptive_skill || {}) as JsonMap;
const fullStackSystem = capabilityForge.full_stack_system_report || {};
const fullStackManifest = fullStackSystem.artifact_manifest || {};
const fullStackValidation = fullStackSystem.validation || {};
const fullStackFlow = Array.isArray(fullStackSystem.agent_build_flow) ? fullStackSystem.agent_build_flow : [];
const approvalState = localApprovalState || capabilityForge.approval_state?.state || clientJob.approval_state?.state || qualityReport.approval_state?.state || "waiting_for_forge";
const scopeOfWorks = clientJob.scope_of_works || {};
const clientQuestions = Array.isArray(clientJob.client_questions) ? clientJob.client_questions : [];
const agentTeam = Array.isArray(clientJob.agent_team) ? clientJob.agent_team : [];
const phaseTimers = Array.isArray(clientJob.phase_timers) ? clientJob.phase_timers : [];
const proofChecklist = Array.isArray(clientJob.proof_checklist) ? clientJob.proof_checklist : productAudit.proof_checklist || [];
const snaggingList = Array.isArray(clientJob.snagging_list) ? clientJob.snagging_list : productAudit.snagging_list || [];
const handoverStatus = clientJob.handover_status || productAudit.handover_status || {};
const finalHandoverVisible = Boolean(handoverStatus.client_visible_product || productAudit.ready_to_run);
const journal = status.work_journal || {};
const journalStages = Array.isArray(journal.stages) ? journal.stages : [];
const steps = Array.isArray(plan.steps) ? plan.steps : [];
const systemActive = Boolean(route.ok || summary.goal_engine_routed || status.status);
const hubActive = status.status !== "coding_organism_waiting_for_prompt" && !error;
const fullCodingReady = Boolean(summary.goal_route_clean && summary.tests_ok && summary.ready_to_run && !summary.blocking_snag_count);
const phiBridge = phiStatus.phi_bridge || {};
const phiCadence = phiBridge.cadence || {};
const phiReady = Boolean(phiStatus.ok);
const ollamaBridge = phiStatus.ollama_cognitive_bridge || status.ollama_cognitive_bridge || ollamaStatus || {};
const ollamaSummary = ollamaBridge.summary || {};
const ollamaModel = ollamaSummary.resolved_model || ollamaBridge.model_resolution?.resolved_model || ollamaBridge.model_resolution?.configured_model || "model waiting";
const ollamaChecks = Array.isArray(ollamaBridge.proof_checklist) ? ollamaBridge.proof_checklist : [];
const ollamaFlow = Array.isArray(ollamaBridge.handshake_flow) ? ollamaBridge.handshake_flow : [];
const ollamaActions = Array.isArray(ollamaBridge.next_actions) ? ollamaBridge.next_actions : [];
const liveRefreshMs = Number(phiStatus.refresh_interval_ms || LIVE_REFRESH_FALLBACK_MS);
const lastAssistant = [...chatMessages].reverse().find((item) => item.role === "assistant");
const dynamicFilterState = (lastAssistant?.dynamic_filter || phiStatus.dynamic_prompt_filter || status.dynamic_prompt_filter || {}) as JsonMap;
const dynamicSourcePackets = Array.isArray(dynamicFilterState.source_packets) ? dynamicFilterState.source_packets : [];
const dynamicHncAuris = dynamicFilterState.hnc_auris_report || {};
const dynamicAuris = dynamicHncAuris.auris_voice_filter || {};
const dynamicFilterReady = Boolean(dynamicFilterState.filter_mode || dynamicFilterState.lane || dynamicSourcePackets.length);
const artifactItems = collectArtifacts(status);
return (
<Card className="mb-5 bg-card/80">
<CardHeader className="pb-3">
<CardTitle className="flex items-center gap-2 text-base">
<Code2 className="h-4 w-4 text-primary" />
Aureon Coding Organism
</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
<div className="flex flex-wrap gap-2">
<Badge variant={status.ok ? "success" : "warning"}>{status.status || "waiting for prompt"}</Badge>
<Badge variant="outline">updated {status.generated_at ? new Date(status.generated_at).toLocaleTimeString() : "pending"}</Badge>
<Badge variant={summary.goal_engine_routed ? "success" : "warning"}>goal route {summary.goal_engine_routed ? "live" : "pending"}</Badge>
<Badge variant={summary.scope_locked ? "success" : "warning"}>scope {String(summary.scope_status || "waiting").replace(/_/g, " ")}</Badge>
<Badge variant={summary.safe_code_proposal_created ? "success" : "outline"}>code queue {summary.safe_code_proposal_created ? "written" : "waiting"}</Badge>
<Badge variant={summary.tests_ok ? "success" : summary.tests_requested ? "warning" : "outline"}>tests {summary.tests_requested ? (summary.tests_ok ? "passed" : "attention") : "off"}</Badge>
<Badge variant={summary.ready_to_run ? "success" : "warning"}>product {String(summary.finished_product_status || "audit pending").replace(/_/g, " ")}</Badge>
<Badge variant={summary.blocking_snag_count ? "warning" : "success"}>snags {summary.blocking_snag_count || 0}</Badge>
<Badge variant={summary.desktop_handoff_created ? "success" : "outline"}>desktop handoff {summary.desktop_handoff_created ? "ready" : "off"}</Badge>
<Badge variant={summary.artifact_quality_passed ? "success" : summary.artifact_quality_gate_present ? "warning" : "outline"}>
quality {summary.artifact_quality_gate_present ? `${Math.round(Number(summary.artifact_quality_score || 0) * 100)}%` : "waiting"}
</Badge>
<Badge variant={summary.creative_process_guardian_ok || creativeGuardian.ok ? "success" : creativeGuardian.schema_version ? "warning" : "outline"}>
mind guard {summary.creative_process_guardian_ok || creativeGuardian.ok ? "passed" : creativeGuardian.schema_version ? "attention" : "waiting"}
</Badge>
<Badge variant={codingCapability.ok ? "success" : codingCapability.schema_version ? "warning" : "outline"}>
coding gates {codingCapabilitySummary.ready_gate_count || 0}/{codingCapabilitySummary.gate_count || 0}
</Badge>
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="mb-3 flex flex-wrap items-start justify-between gap-2">
<div>
<div className="text-sm font-medium text-primary">Human Coding Cockpit</div>
<div className="mt-1 text-xs text-primary/75">
Start the full organism in PowerShell, then use this panel as the human prompt terminal while Aureon scopes, recruits, builds, tests, snags, and hands over.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={systemActive ? "success" : "warning"}>system {systemActive ? "active" : "waiting"}</Badge>
<Badge variant={hubActive ? "success" : "warning"}>hub {hubActive ? "reachable" : "checking"}</Badge>
<Badge variant={fullCodingReady ? "success" : "warning"}>handover {fullCodingReady ? "ready" : "gated"}</Badge>
</div>
</div>
<div className="grid gap-2 text-xs md:grid-cols-3">
<div>
<div className="uppercase text-primary/70">Full organism terminal</div>
<div className="mt-1 font-mono text-primary">{FULL_ORGANISM_COMMAND}</div>
</div>
<div>
<div className="uppercase text-primary/70">Local coding endpoint</div>
<div className="mt-1 font-mono text-primary">{HUB_BASE}/api/coding/prompt</div>
</div>
<div>
<div className="uppercase text-primary/70">PowerShell prompt call</div>
<div className="mt-1 font-mono text-primary">{TERMINAL_PROMPT_COMMAND}</div>
</div>
</div>
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div className="flex items-start gap-2">
<MessageSquare className="mt-0.5 h-4 w-4 text-primary" />
<div>
<div className="text-sm font-medium text-primary">Aureon Phi Live Chat</div>
<div className="mt-1 text-xs text-primary/75">
Local organism chat through Phi Bridge, ThoughtBus, and the in-house voice adapter.
</div>
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={phiReady ? "success" : "warning"}>phi {phiReady ? "connected" : "checking"}</Badge>
<Badge variant="outline">
<Radio className="mr-1 h-3 w-3" />
{Number(phiCadence.frequency_hz || 0).toFixed(2)}Hz
</Badge>
<Badge variant="outline">
<RefreshCw className="mr-1 h-3 w-3" />
{fmt(liveRefreshMs)}ms
</Badge>
<Badge variant={lastAssistant?.source === "local_llm" || lastAssistant?.source === "ollama_cognitive_hybrid" || lastAssistant?.source === "ollama_cognitive_weaver" ? "success" : "outline"}>
{lastAssistant?.source || phiStatus.chat?.adapter_model || "voice lane"}
</Badge>
<Badge variant={dynamicFilterReady ? "success" : "outline"}>
filter {dynamicFilterState.filter_mode || "waiting"}
</Badge>
<Badge variant={dynamicSourcePackets.length ? "success" : "outline"}>
{dynamicSourcePackets.length || 0} source packets
</Badge>
</div>
</div>
<ScrollArea className="mt-3 h-[180px] rounded-md border border-primary/20 bg-background/25 p-3 pr-4">
<div className="space-y-2">
{chatMessages.map((message, index) => (
<div
key={`${message.ts || index}-${message.role}`}
className={`rounded-md border px-3 py-2 text-xs ${
message.role === "assistant"
? "border-primary/30 bg-primary/10 text-primary"
: "border-primary/25 bg-primary/10 text-primary"
}`}
>
<div className="mb-1 flex items-center justify-between gap-2 text-[10px] uppercase opacity-75">
<span>{message.role === "assistant" ? "Aureon" : "Operator"}</span>
<span>{message.latency_ms ? `${fmt(message.latency_ms)}ms` : message.source || ""}</span>
</div>
<div className="whitespace-pre-wrap leading-relaxed">{message.text}</div>
{message.weaver?.shards?.length ? (
<div className="mt-2 flex flex-wrap gap-1 text-[10px] text-primary/70">
{message.weaver.shards.map((shard) => (
<Badge key={`${message.ts}-${shard.name}`} variant={shard.ok ? "success" : "warning"}>
{String(shard.name || "shard").replace(/_/g, " ")}
</Badge>
))}
</div>
) : null}
{message.dynamic_filter ? (
<div className="mt-2 flex flex-wrap gap-1 text-[10px] text-primary/70">
<Badge variant="outline">{message.dynamic_filter.lane || "chat"}</Badge>
<Badge variant="outline">{message.dynamic_filter.task_family || "conversation"}</Badge>
{(message.dynamic_filter.source_packets || []).slice(0, 3).map((packet) => (
<Badge key={`${message.ts}-${packet.source_path}`} variant="outline">
{packet.title || packet.source_path || "source"}
</Badge>
))}
</div>
) : null}
{message.response_quality ? (
<div className="mt-2 flex flex-wrap gap-1 text-[10px] text-primary/70">
<Badge variant={message.response_quality.passed ? "success" : "warning"}>
quality {Math.round(Number(message.response_quality.score || 0) * 100)}%
</Badge>
{message.response_quality.compiler_applied ? <Badge variant="outline">operator compiled</Badge> : null}
{(message.response_quality.snags || []).slice(0, 2).map((snag) => (
<Badge key={`${message.ts}-${snag}`} variant="warning">
{snag.replace(/_/g, " ")}
</Badge>
))}
</div>
) : null}
</div>
))}
{!chatMessages.length ? (
<div className="rounded-md border border-primary/20 bg-background/20 p-3 text-xs text-primary/75">
The chat lane is waiting for your first live message.
</div>
) : null}
</div>
</ScrollArea>
<div className="mt-3 grid gap-2 md:grid-cols-4">
<Mini label="Prompt Filter" value={dynamicFilterState.filter_mode || "waiting"} />
<Mini label="Lane" value={dynamicFilterState.lane || "chat"} />
<Mini label="Packets" value={dynamicSourcePackets.length || 0} />
<Mini label="Auris" value={dynamicAuris.accepted === false ? "hold" : dynamicAuris.accepted ? "pass" : "pending"} />
</div>
{dynamicSourcePackets.length ? (
<div className="mt-2 flex flex-wrap gap-1 text-[10px] text-primary/75">
{dynamicSourcePackets.slice(0, 4).map((packet: JsonMap) => (
<Badge key={packet.source_path || packet.title} variant="outline">
{packet.title || packet.source_path}
</Badge>
))}
</div>
) : null}
<div className="mt-3 grid gap-2 md:grid-cols-[1fr_auto]">
<Textarea
data-testid="phi-chat-input"
aria-label="Phi chat message"
value={chatInput}
onChange={(event) => setChatInput(event.target.value)}
onKeyDown={(event) => {
if ((event.ctrlKey || event.metaKey) && event.key === "Enter") {
event.preventDefault();
sendPhiChat();
}
}}
className="min-h-[72px] bg-background/60 text-xs"
/>
<Button
data-testid="phi-chat-submit"
type="button"
className="md:self-end"
size="sm"
onClick={sendPhiChat}
disabled={chatBusy || !chatInput.trim()}
>
<Send className="mr-2 h-4 w-4" />
Talk To Aureon
</Button>
</div>
{chatError ? <div className="mt-2 rounded-md border border-destructive/30 bg-destructive/10 p-2 text-xs text-destructive">{chatError}</div> : null}
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div className="flex items-start gap-2">
<BrainCircuit className="mt-0.5 h-4 w-4 text-primary" />
<div>
<div className="text-sm font-medium text-primary">Ollama Cognitive Handshake</div>
<div className="mt-1 text-xs text-primary/75">
Ollama acts as the local language worker while Aureon's metacognitive, HNC/Auris, role, and ThoughtBus evidence keep the answer grounded.
</div>
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={ollamaSummary.ollama_reachable ? "success" : "warning"}>
Ollama {ollamaSummary.ollama_reachable ? "reachable" : "offline"}
</Badge>
<Badge variant={ollamaBridge.ok ? "success" : "warning"}>
{ollamaBridge.status || "handshake waiting"}
</Badge>
<Badge variant={ollamaSummary.hnc_auris_ready ? "success" : "warning"}>
HNC/Auris {ollamaSummary.hnc_auris_ready ? "ready" : "held"}
</Badge>
<Badge variant={ollamaSummary.metacognitive_ready ? "success" : "warning"}>
cognition {ollamaSummary.metacognitive_ready ? "ready" : "held"}
</Badge>
<Button size="sm" variant="outline" onClick={reloadPhiVoiceWorker}>
<RefreshCw className="mr-2 h-4 w-4" />
Reload Voice Worker
</Button>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Model" value={ollamaModel} />
<Mini label="Installed" value={ollamaSummary.installed_model_count || 0} />
<Mini label="Running" value={ollamaSummary.running_model_count || 0} />
<Mini label="Sources" value={ollamaBridge.cognitive_readiness?.cognitive_source_count || 0} />
<Mini label="Blockers" value={ollamaSummary.blocking_check_count || 0} />
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-3">
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Handshake Proof</div>
<div className="space-y-1">
{ollamaChecks.slice(0, 8).map((check: JsonMap) => (
<div key={check.id} className="flex items-center justify-between gap-2 rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px]">
<span>{check.label || check.id}</span>
<Badge variant={check.ok ? "success" : check.blocking ? "warning" : "outline"}>{check.ok ? "pass" : "hold"}</Badge>
</div>
))}
{!ollamaChecks.length ? <div className="text-xs text-primary/70">Ollama proof appears after the bridge report or live hub endpoint responds.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Agent-Like Flow</div>
<div className="space-y-1">
{ollamaFlow.slice(0, 5).map((step: JsonMap) => (
<div key={step.step} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px]">
<div className="font-medium">{String(step.step || "").replace(/_/g, " ")}</div>
<div className="mt-1 text-primary/70">{step.owner}</div>
</div>
))}
{!ollamaFlow.length ? <div className="text-xs text-primary/70">Handshake flow is waiting for the Ollama cognitive bridge report.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Setup / Repair Actions</div>
<div className="space-y-1">
{ollamaActions.slice(0, 4).map((action: JsonMap) => (
<div key={action.id} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px]">
<div className="font-medium">{action.action || action.id}</div>
{action.powershell ? <div className="mt-1 font-mono text-primary/70">{action.powershell}</div> : null}
</div>
))}
{!ollamaActions.length ? <div className="text-xs text-primary/70">No repair actions are currently published.</div> : null}
</div>
</div>
</div>
</div>
<div className="grid gap-2 md:grid-cols-6">
<Stat icon={BrainCircuit} label="plan steps" value={plan.step_count || summary.target_file_count || 0} />
<Stat icon={ShieldCheck} label="pending proposals" value={safeCode.pending_count || summary.pending_code_proposal_count || 0} />
<Stat icon={Code2} label="target files" value={summary.target_file_count || 0} />
<Stat icon={TestTube2} label="test commands" value={tests.command_count || 0} />
<Stat icon={MousePointer2} label="VM tools" value={summary.remote_vm_tool_count || 0} />
<Stat icon={CheckCircle2} label="route ok" value={route.ok ? "yes" : "no"} />
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-primary">Autonomous Self-Run Loop</div>
<div className="mt-1 text-xs text-primary/75">
The coding organism wakes its gates, creative process, stress certification, and self-fix director without waiting for Codex when work stays inside safe local authority.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={selfRunSummary.loop_active ? "success" : selfRun.schema_version ? "warning" : "outline"}>
{selfRun.status || "self-run waiting"}
</Badge>
<Badge variant={selfRunSummary.handover_ready ? "success" : selfRun.schema_version ? "warning" : "outline"}>
autonomous {selfRunSummary.loop_active ? "active" : "held"}
</Badge>
<Badge variant={Number(selfRunSummary.hard_boundary_hold_count || 0) ? "warning" : "success"}>
hard holds {selfRunSummary.hard_boundary_hold_count || 0}
</Badge>
<Badge variant="outline">cycles {selfRunSummary.cycle_count || 0}</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Tasks" value={`${selfRunSummary.latest_task_ok_count || 0}/${selfRunSummary.latest_task_count || 0}`} />
<Mini label="Critical failures" value={selfRunSummary.critical_failure_count || 0} />
<Mini label="Soft failures" value={selfRunSummary.soft_failure_count || 0} />
<Mini label="Work orders" value={selfRunSummary.autonomous_work_order_count || 0} />
<Mini label="Heartbeat" value={selfRunHeartbeat.status || selfRunSummary.heartbeat_status || "waiting"} />
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-3">
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Latest Cycle Tasks</div>
<div className="space-y-1">
{selfRunTasks.slice(0, 6).map((task: JsonMap) => (
<div key={task.id} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(task.title || task.id).replace(/_/g, " ")}</span>
<Badge variant={task.ok ? "success" : task.critical ? "warning" : "outline"}>{task.status || "waiting"}</Badge>
</div>
<div className="mt-1 text-primary/70">
{task.authority || "safe local"} | {task.duration_ms || 0}ms
</div>
</div>
))}
{!selfRunTasks.length ? <div className="text-xs text-primary/70">Run the self-run loop to publish autonomous cycle evidence.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Autonomous Next Work</div>
<div className="space-y-1">
{selfRunWorkOrders.slice(0, 5).map((order: JsonMap) => (
<div key={order.id} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(order.title || order.id).replace(/_/g, " ")}</span>
<Badge variant={order.autonomous ? "success" : "warning"}>{order.priority || "P1"}</Badge>
</div>
<div className="mt-1 text-primary/70">{order.next_action}</div>
</div>
))}
{!selfRunWorkOrders.length ? <div className="text-xs text-primary/70">No autonomous repair work is waiting in the latest cycle.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Authority Boundary</div>
<div className="space-y-1">
{selfRunHeartbeat.status ? (
<div className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="font-medium">heartbeat {selfRunHeartbeat.status}</div>
<div className="mt-1">
due {selfRunHeartbeat.next_cycle_due_seconds ?? 0}s | stale after {selfRunHeartbeat.stale_after_seconds ?? 0}s
</div>
</div>
) : null}
{selfRunHardHolds.slice(0, 5).map((hold: JsonMap) => (
<div key={hold.id} className="rounded border border-warning/30 bg-warning/10 px-2 py-1 text-[11px] text-warning">
<div className="font-medium">{String(hold.id || "manual hold").replace(/_/g, " ")}</div>
<div className="mt-1">{hold.reason}</div>
</div>
))}
{!selfRunHardHolds.length ? (
<div className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
No hard boundary is holding the safe local coding lane.
</div>
) : null}
</div>
</div>
</div>
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-primary">Autonomous Job Executor</div>
<div className="mt-1 text-xs text-primary/75">
Every human coding, UI, media, or tool prompt becomes a durable job that can be claimed, built, tested, repaired, and handed over when proof passes.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={autonomousJobs.ok ? "success" : autonomousJobs.schema_version ? "warning" : "outline"}>
{autonomousJobs.status || "jobs waiting"}
</Badge>
<Badge variant={Number(autonomousJobsSummary.queue_depth || 0) ? "warning" : "outline"}>
Queue depth {autonomousJobsSummary.queue_depth || 0}
</Badge>
<Badge variant={autonomousActiveJob.state === "handover_ready" ? "success" : autonomousActiveJob.state ? "warning" : "outline"}>
active {autonomousActiveJob.state || "none"}
</Badge>
<Badge variant="outline">handover {autonomousJobsSummary.handover_ready_count || 0}</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Jobs" value={autonomousJobsSummary.job_count || autonomousJobList.length || 0} />
<Mini label="Queue depth" value={autonomousJobsSummary.queue_depth || 0} />
<Mini label="Active" value={autonomousJobsSummary.active_job_count || (autonomousActiveJob.job_id ? 1 : 0)} />
<Mini label="Manual holds" value={autonomousJobsSummary.manual_hold_count || 0} />
<Mini label="Failed budget" value={autonomousJobsSummary.failed_after_budget_count || 0} />
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-3">
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Active Job</div>
{autonomousActiveJob.job_id ? (
<div className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{autonomousActiveJob.job_id}</span>
<Badge variant={autonomousActiveJob.handover_ready ? "success" : "warning"}>{autonomousActiveJob.state || "active"}</Badge>
</div>
<div className="mt-1 text-primary/70">{String(autonomousActiveJob.prompt || "").slice(0, 140)}</div>
<div className="mt-1 text-primary/70">
phase {autonomousActiveJob.phase || "waiting"} | attempts {autonomousActiveJob.attempts || 0}/{autonomousActiveJob.attempt_budget || 0}
</div>
{autonomousActiveJob.handover?.public_url ? (
<a className="mt-2 block text-primary underline" href={String(autonomousActiveJob.handover.public_url)}>
Open handover artifact
</a>
) : null}
</div>
) : (
<div className="text-xs text-primary/70">No active job is currently claimed by the worker.</div>
)}
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Proof Checklist</div>
<div className="space-y-1">
{autonomousProof.slice(0, 6).map((check: JsonMap) => (
<div key={check.id} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(check.id || "proof").replace(/_/g, " ")}</span>
<Badge variant={check.ok ? "success" : "warning"}>{check.ok ? "pass" : "hold"}</Badge>
</div>
<div className="mt-1 text-primary/70">{check.evidence || "waiting for proof"}</div>
</div>
))}
{!autonomousProof.length ? <div className="text-xs text-primary/70">Proof appears after a job reaches the build and test phases.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Recent Jobs</div>
<div className="space-y-1">
{autonomousRecentJobs.map((job: JsonMap) => (
<div key={job.job_id} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{job.job_id}</span>
<Badge variant={job.state === "handover_ready" ? "success" : job.state === "held_manual_boundary" ? "warning" : "outline"}>{job.state || "waiting"}</Badge>
</div>
<div className="mt-1 text-primary/70">{String(job.prompt || "").slice(0, 110)}</div>
</div>
))}
{!autonomousRecentJobs.length ? <div className="text-xs text-primary/70">Submit a cockpit prompt to create the first durable autonomous job.</div> : null}
</div>
</div>
</div>
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-primary">Evolution Queue 584 Certification</div>
<div className="mt-1 text-xs text-primary/75">
The real throughput test: Aureon reads every frontend evolution work order, assigns a safe autonomous outcome, proves the data contract, and records true boundaries without stopping the coding lane.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={evolutionQueueCertification.ok ? "success" : evolutionQueueCertification.schema_version ? "warning" : "outline"}>
{evolutionQueueCertification.status || "certification waiting"}
</Badge>
<Badge variant={Number(evolutionQueueCertificationSummary.fake_pass_count || 0) ? "warning" : "success"}>
certification counter {evolutionQueueCertificationSummary.fake_pass_count || 0}
</Badge>
<Badge variant="outline">
processed {evolutionQueueCertificationSummary.processed_count || 0}/{evolutionQueueCertificationSummary.queue_count || 0}
</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Throughput" value={`${evolutionQueueCertificationSummary.throughput_percent || 0}%`} />
<Mini label="Autonomous outcomes" value={evolutionQueueCertificationSummary.safe_autonomous_outcome_count || 0} />
<Mini label="Read-only adapters" value={evolutionQueueCertificationSummary.read_only_adapter_count || 0} />
<Mini label="Blocker cards" value={evolutionQueueCertificationSummary.blocker_card_count || 0} />
<Mini label="Boundary visible" value={evolutionQueueCertificationSummary.manual_boundary_visible_count || 0} />
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-3">
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Outcome Buckets</div>
<div className="space-y-1">
{Object.entries(evolutionQueueCertificationSummary.outcome_buckets || {}).map(([bucket, count]) => (
<div key={bucket} className="flex items-center justify-between rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<span className="font-medium">{bucket.replace(/_/g, " ")}</span>
<Badge variant="outline">{String(count)}</Badge>
</div>
))}
{!Object.keys(evolutionQueueCertificationSummary.outcome_buckets || {}).length ? (
<div className="text-xs text-primary/70">Run the evolution queue certification to publish all 584 outcomes.</div>
) : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3 lg:col-span-2">
<div className="mb-2 text-xs font-medium text-primary">Sample Work Order Proof</div>
<div className="grid gap-2 md:grid-cols-2">
{evolutionQueueCertificationCases.slice(0, 6).map((item: JsonMap) => (
<div key={item.id} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(item.id || "work order").replace(/_/g, " ")}</span>
<Badge variant={item.ok ? "success" : "warning"}>{item.autonomous_outcome || "waiting"}</Badge>
</div>
<div className="mt-1 text-primary/70">
{item.target_screen || "screen"} | {item.handover_state?.state || "handover waiting"}
</div>
<div className="mt-1 text-primary/60">{String(item.source_path || "").slice(0, 120)}</div>
</div>
))}
{!evolutionQueueCertificationCases.length ? (
<div className="text-xs text-primary/70">No certified queue cases are published yet.</div>
) : null}
</div>
</div>
</div>
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-primary">Live Queue Runtime Patches</div>
<div className="mt-1 text-xs text-primary/75">
Shows the queue moving into validated runtime patch records: each completed work order has validation proof and an active read-only patch entry.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={workOrderExecution.status ? "success" : "outline"}>{workOrderExecution.status || "execution waiting"}</Badge>
<Badge variant={Number(workOrderExecutionSummary.remaining_queue_count || 0) ? "warning" : "success"}>
remaining queue {workOrderExecutionSummary.remaining_queue_count ?? workOrderMovement.remaining_queue_count ?? 0}
</Badge>
<Badge variant={Number(workOrderExecutionSummary.failed_validation_count || 0) ? "warning" : "success"}>
validation failures {workOrderExecutionSummary.failed_validation_count || workOrderValidation.failed_validation_count || 0}
</Badge>
<Badge variant="outline">code materialized {materializedPatchCount}</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Moved from queue" value={workOrderExecutionSummary.moved_from_queue_count || workOrderMovement.moved_from_queue_count || 0} />
<Mini label="Completed validated" value={workOrderMovement.completed_validated_count || workOrderExecutionSummary.validated_count || 0} />
<Mini label="Active runtime patches" value={runtimePatchSummary.active_patch_count || workOrderExecutionSummary.runtime_patch_count || 0} />
<Mini label="Patch registry" value={runtimePatchRegistry.status || workOrderExecutionSummary.runtime_patch_status || "waiting"} />
<Mini label="Queue drained" value={workOrderMovement.queue_drained ? "yes" : "no"} />
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-3">
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Queue Movement</div>
<div className="space-y-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between rounded border border-primary/20 bg-background/20 px-2 py-1">
<span>source queue</span>
<Badge variant="outline">{workOrderMovement.source_queue_count || workOrderExecutionSummary.source_queue_count || 0}</Badge>
</div>
<div className="flex items-center justify-between rounded border border-primary/20 bg-background/20 px-2 py-1">
<span>moved from queue</span>
<Badge variant="outline">{workOrderMovement.moved_from_queue_count || workOrderExecutionSummary.moved_from_queue_count || 0}</Badge>
</div>
<div className="flex items-center justify-between rounded border border-primary/20 bg-background/20 px-2 py-1">
<span>remaining queue</span>
<Badge variant={Number(workOrderMovement.remaining_queue_count || 0) ? "warning" : "outline"}>{workOrderMovement.remaining_queue_count ?? workOrderExecutionSummary.remaining_queue_count ?? 0}</Badge>
</div>
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Materialized Repo Code</div>
<div className="space-y-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between rounded border border-primary/20 bg-background/20 px-2 py-1">
<span>generated TS patches</span>
<Badge variant="outline">{materializedPatchCount}</Badge>
</div>
<div className="flex items-center justify-between rounded border border-primary/20 bg-background/20 px-2 py-1">
<span>active in code</span>
<Badge variant="outline">{materializedActivePatchCount}</Badge>
</div>
<div className="flex items-center justify-between rounded border border-primary/20 bg-background/20 px-2 py-1">
<span>module status</span>
<Badge variant="outline">{AUREON_EVOLUTION_RUNTIME_PATCH_SUMMARY.status}</Badge>
</div>
<div className="font-mono text-primary/65">
frontend/src/components/generated/aureonEvolutionRuntimePatches.ts
</div>
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3 lg:col-span-2">
<div className="mb-2 text-xs font-medium text-primary">Active Runtime Patches</div>
<div className="grid gap-2 md:grid-cols-2">
{runtimePatches.slice(0, 6).map((patch: JsonMap) => (
<div key={patch.patch_id} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px] text-primary/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(patch.patch_type || "patch").replace(/_/g, " ")}</span>
<Badge variant={patch.active ? "success" : "warning"}>{patch.status || "waiting"}</Badge>
</div>
<div className="mt-1 text-primary/70">{patch.target_screen || "screen"} | {String(patch.source_path || "").slice(0, 110)}</div>
</div>
))}
{!runtimePatches.length ? <div className="text-xs text-primary/70">Run work-order execution to activate runtime patch records.</div> : null}
</div>
</div>
</div>
</div>
<div className="rounded-md border border-success/30 bg-success/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-success">Autonomous Coding Capability Gates</div>
<div className="mt-1 text-xs text-success/75">
Missing skills, tools, dependencies, tests, and source knowledge become autonomous gates; live trading, payments, filings, credentials, and destructive OS actions remain manual holds.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={codingCapability.ok ? "success" : codingCapability.schema_version ? "warning" : "outline"}>
{codingCapability.status || "unblocker waiting"}
</Badge>
<Badge variant="outline">gates {codingCapabilitySummary.ready_gate_count || 0}/{codingCapabilitySummary.gate_count || 0}</Badge>
<Badge variant={Number(codingCapabilitySummary.converted_coding_blocker_count || 0) ? "success" : "outline"}>
converted {codingCapabilitySummary.converted_coding_blocker_count || 0}
</Badge>
<Badge variant={Number(codingCapabilitySummary.manual_authority_hold_count || 0) ? "warning" : "outline"}>
manual holds {codingCapabilitySummary.manual_authority_hold_count || 0}
</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Work orders" value={codingCapabilitySummary.work_order_count || 0} />
<Mini label="Source packets" value={codingCapabilitySummary.source_packet_count || 0} />
<Mini label="Research routes" value={codingCapabilitySummary.external_research_routes_ready || sourceRoutes.length || 0} />
<Mini label="Gate repairs" value={codingCapabilitySummary.gate_repair_count || 0} />
<Mini label="Policy" value={codingCapability.provider_policy || "local first"} />
</div>
<div className="mt-3 grid gap-2 lg:grid-cols-3">
<div className="rounded-md border border-success/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-success">System Gates</div>
<div className="space-y-1">
{codingGates.slice(0, 9).map((gate: JsonMap) => (
<div key={gate.id} className="rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px]">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{gate.title || gate.id}</span>
<Badge variant={gate.open ? "success" : "warning"}>{gate.status || "waiting"}</Badge>
</div>
<div className="mt-1 text-success/70">{gate.next_action}</div>
</div>
))}
{!codingGates.length ? <div className="text-xs text-success/70">Run the unblocker to publish coding autonomy gates.</div> : null}
</div>
</div>
<div className="rounded-md border border-success/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-success">Source Discovery</div>
<div className="space-y-1">
{sourceRoutes.slice(0, 4).map((routeItem: JsonMap) => (
<div key={routeItem.id} className="rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px]">
<div className="font-medium">{routeItem.name || routeItem.id}</div>
<div className="mt-1 text-success/70">{String(routeItem.mode || "").replace(/_/g, " ")}</div>
</div>
))}
{!sourceRoutes.length ? <div className="text-xs text-success/70">Source routes are waiting for the unblocker report.</div> : null}
</div>
</div>
<div className="rounded-md border border-success/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-success">Autonomous Work Orders</div>
<div className="space-y-1">
{codingWorkOrders.slice(0, 5).map((workOrder: JsonMap) => (
<div key={workOrder.id} className="rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px]">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(workOrder.id || "").replace(/_/g, " ")}</span>
<Badge variant="outline">{workOrder.priority || "P60"}</Badge>
</div>
<div className="mt-1 text-success/70">{workOrder.acceptance}</div>
</div>
))}
{!codingWorkOrders.length ? <div className="text-xs text-success/70">No unblocker work orders are published yet.</div> : null}
</div>
</div>
</div>
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-primary">Local Capability Forge</div>
<div className="mt-1 text-xs text-primary/75">
Aureon classifies the job, recruits a local crew, keeps external providers reference-only, and blocks handover until quality proof passes.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={capabilityForge.handover_ready || qualityReport.handover_ready ? "success" : "warning"}>
{capabilityForge.status || qualityReport.status || "forge waiting"}
</Badge>
<Badge variant="outline">{capabilityForge.task_family || qualityReport.task_family || "task pending"}</Badge>
<Badge variant={qualityReport.handover_ready ? "success" : qualityReport.schema_version ? "warning" : "outline"}>
score {qualityReport.schema_version ? `${Math.round(Number(qualityReport.score || 0) * 100)}%` : "waiting"}
</Badge>
<Badge variant={approvalState === "approved" ? "success" : approvalState === "rejected" ? "destructive" : "outline"}>
{String(approvalState).replace(/_/g, " ")}
</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-4">
<Mini label="Provider" value={capabilityForge.provider_policy || qualityReport.provider_policy || "local only"} />
<Mini label="Crew" value={(capabilityForge.recruited_crew || []).length || 0} />
<Mini label="Tools" value={(capabilityForge.local_tools_used || []).length || 0} />
<Mini label="Snags" value={qualitySnags.length} />
</div>
{adaptiveSkill.name ? (
<div className="mt-3 rounded-md border border-primary/25 bg-background/25 p-3 text-xs text-primary/80">
<span className="font-medium text-primary">Adaptive skill:</span> {adaptiveSkill.name}
{adaptiveSkill.skill_contract ? <span> - {adaptiveSkill.skill_contract}</span> : null}
</div>
) : null}
{fullStackSystem.status ? (
<div className="mt-3 rounded-md border border-primary/25 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-primary">Full-Stack Agent Build</div>
<div className="mt-1 text-xs text-primary/75">
Agents generated backend, frontend, data contract, tests, and runbook as a local full-stack system.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={fullStackSystem.ok ? "success" : "warning"}>{fullStackSystem.status}</Badge>
<Badge variant={fullStackValidation.status === "contract_validated" ? "success" : "warning"}>
{fullStackValidation.status || "validation waiting"}
</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-4">
<Mini label="Backend" value={fullStackManifest.backend_path ? "written" : "waiting"} />
<Mini label="Frontend" value={fullStackManifest.frontend_path ? "written" : "waiting"} />
<Mini label="Tests" value={fullStackManifest.test_path ? "written" : "waiting"} />
<Mini label="CRUD proof" value={fullStackValidation.crud_ok ? "pass" : "waiting"} />
</div>
<div className="mt-3 grid gap-2 lg:grid-cols-2">
<div className="rounded border border-primary/20 bg-background/20 p-2 text-[11px] text-primary/80">
<div className="mb-1 font-medium text-primary">Agent Flow</div>
{fullStackFlow.slice(0, 6).map((step: string) => (
<div key={step} className="py-0.5">{step}</div>
))}
</div>
<div className="rounded border border-primary/20 bg-background/20 p-2 text-[11px] text-primary/80">
<div className="mb-1 font-medium text-primary">Generated System Paths</div>
<div className="truncate font-mono">{fullStackManifest.frontend_path || "frontend waiting"}</div>
<div className="truncate font-mono">{fullStackManifest.backend_path || "backend waiting"}</div>
<div className="truncate font-mono">{fullStackManifest.test_path || "tests waiting"}</div>
{fullStackManifest.public_url ? (
<a href={normalizePublicUrl(fullStackManifest.public_url)} target="_blank" rel="noreferrer" className="mt-2 inline-flex font-medium text-primary underline underline-offset-2">
Open full-stack preview
</a>
) : null}
</div>
</div>
</div>
) : null}
<div className="mt-3 grid gap-3 lg:grid-cols-2">
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Quality Checks</div>
<div className="space-y-1">
{qualityChecks.slice(0, 7).map((check: JsonMap) => (
<div key={check.id} className="flex items-center justify-between gap-2 rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px]">
<span>{check.label || check.id}</span>
<Badge variant={check.ok ? "success" : check.blocking ? "warning" : "outline"}>{check.ok ? "pass" : "hold"}</Badge>
</div>
))}
{!qualityChecks.length ? <div className="text-xs text-primary/70">Quality proof appears after Aureon produces an artifact or forge report.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Client Approval Controls</div>
<div className="text-xs text-primary/75">
These controls record the human review decision after Aureon has produced local proof.
</div>
<div className="mt-3 flex flex-wrap gap-2">
<Button size="sm" variant="outline" onClick={() => setLocalApprovalState("approved")} disabled={!qualityReport.schema_version}>
Approve
</Button>
<Button size="sm" variant="outline" onClick={() => setLocalApprovalState("revision_requested")} disabled={!qualityReport.schema_version}>
Request Revision
</Button>
<Button size="sm" variant="outline" onClick={() => setLocalApprovalState("rejected")} disabled={!qualityReport.schema_version}>
Reject
</Button>
</div>
{qualitySnags.length ? (
<div className="mt-3 space-y-1">
{qualitySnags.slice(0, 4).map((snag: JsonMap) => (
<div key={snag.id} className="rounded border border-warning/30 bg-warning/10 px-2 py-1 text-[11px] text-warning">
{snag.title || snag.id}
</div>
))}
</div>
) : null}
</div>
</div>
</div>
<div className="rounded-md border border-warning/30 bg-warning/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-warning">Capability Stress Audit</div>
<div className="mt-1 text-xs text-warning/75">
Aureon stress-tests task families, detects fake passes, and separates proven handovers from correctly held work.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={stressAudit.ok ? "success" : stressAudit.schema_version ? "warning" : "outline"}>
{stressAudit.status || "audit waiting"}
</Badge>
<Badge variant={Number(stressSummary.fake_pass_count || 0) ? "warning" : "success"}>
certification counter {stressSummary.fake_pass_count || 0}
</Badge>
<Badge variant="outline">cases {stressSummary.passed_count || 0}/{stressSummary.case_count || 0}</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-4">
<Mini label="Proven now" value={(stressAudit.capability_scope?.proven_now || []).length || 0} />
<Mini label="Held correctly" value={(stressAudit.capability_scope?.correctly_blocked || []).length || 0} />
<Mini label="Needs repair" value={(stressAudit.capability_scope?.needs_repair || []).length || 0} />
<Mini label="Legacy findings" value={stressSummary.legacy_finding_count || 0} />
</div>
<div className="mt-3 grid gap-2 lg:grid-cols-2">
{stressCases.slice(0, 4).map((item: JsonMap) => (
<div key={item.id} className="rounded-md border border-warning/25 bg-background/25 p-2 text-xs text-warning/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium text-warning">{String(item.id || "case").replace(/_/g, " ")}</span>
<Badge variant={item.ok ? "success" : "warning"}>{item.actual_handover ? "handover" : "held"}</Badge>
</div>
<div className="mt-1 text-warning/70">
{item.artifact_kind || "artifact pending"} | score {Math.round(Number(item.quality_score || 0) * 100)}%
</div>
</div>
))}
{!stressCases.length ? <div className="text-xs text-warning/70">Run the stress audit to publish capability scope evidence.</div> : null}
</div>
</div>
<div className="rounded-md border border-destructive/30 bg-destructive/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-destructive">Complex Build Stress Certification</div>
<div className="mt-1 text-xs text-destructive/75">
Mixed-mode certification for broad client jobs: sandbox builds, live repo probes, safe auto-repairs, fake-pass detection, and handover gates.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={complexStress.ok ? "success" : complexStress.schema_version ? "warning" : "outline"}>
{complexStress.status || "certification waiting"}
</Badge>
<Badge variant={Number(complexSummary.fake_pass_count || 0) ? "warning" : "success"}>
certification counter {complexSummary.fake_pass_count || 0}
</Badge>
<Badge variant="outline">cases {complexSummary.passed_count || 0}/{complexSummary.case_count || 0}</Badge>
<Badge variant={Number(complexSummary.repair_attempt_count || 0) ? "warning" : "outline"}>
repairs {complexSummary.repair_attempt_count || 0}
</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Handover ready" value={complexSummary.handover_ready_count || 0} />
<Mini label="Correctly held" value={complexSummary.correctly_held_count || 0} />
<Mini label="Sandbox" value={complexSummary.sandbox_case_count || 0} />
<Mini label="Live repo" value={complexSummary.live_repo_case_count || 0} />
<Mini label="Needs repair" value={(complexStress.capability_scope?.needs_repair || []).length || 0} />
</div>
<div className="mt-3 grid gap-2 lg:grid-cols-2">
{complexCases.slice(0, 10).map((item: JsonMap) => {
const artifactUrl = normalizePublicUrl(item.quality_report?.artifact_manifest?.preview_url || item.actual_artifacts?.url || "");
return (
<div key={item.id} className="rounded-md border border-destructive/25 bg-background/25 p-2 text-xs text-destructive/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium text-destructive">{String(item.id || "case").replace(/_/g, " ")}</span>
<Badge variant={item.ok ? "success" : "warning"}>{item.handover_state?.state || "waiting"}</Badge>
</div>
<div className="mt-1 text-destructive/70">
{item.actual_artifacts?.kind || "artifact pending"} | repairs {(item.repair_attempts || []).length || 0}
</div>
{artifactUrl ? (
<a href={artifactUrl} target="_blank" rel="noreferrer" className="mt-2 inline-flex text-[11px] font-medium text-destructive underline underline-offset-2">
Open preview
</a>
) : null}
</div>
);
})}
{!complexCases.length ? <div className="text-xs text-destructive/70">Run complex build certification to publish broad build/workload evidence.</div> : null}
</div>
</div>
<div className="rounded-md border border-success/30 bg-success/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-success">Aureon Self-Fix SWOT</div>
<div className="mt-1 text-xs text-success/75">
Aureon audits its own coding evidence, selects repair work, applies safe local patches autonomously, reruns tests, and records Codex/user audit as evidence.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={selfFix.handover_ready ? "success" : selfFix.schema_version ? "warning" : "outline"}>
{selfFix.status || "self-fix waiting"}
</Badge>
<Badge variant={selfFixCodexAudit.state === "failed" ? "destructive" : selfFixCodexAudit.state ? "success" : "outline"}>
audit {selfFixCodexAudit.state || "waiting"}
</Badge>
<Badge variant={Number(selfFixSummary.blocking_snag_count || 0) ? "warning" : "success"}>
snags {selfFixSummary.blocking_snag_count || 0}
</Badge>
<Badge variant="outline">repairs {selfFixSummary.selected_repair_count || 0}</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Backlog" value={selfFixSummary.repair_backlog_count || selfFixBacklog.length || 0} />
<Mini label="Selected" value={selfFixSummary.selected_repair_count || selfFixSelectedRepairs.length || 0} />
<Mini label="Patch candidates" value={selfFixSummary.patch_candidate_count || 0} />
<Mini label="Applied patches" value={selfFixSummary.patch_applied_count || 0} />
<Mini label="Tests" value={selfFix.test_evidence?.status || "waiting"} />
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-4">
{(["strengths", "weaknesses", "opportunities", "threats"] as const).map((bucket) => {
const items = Array.isArray(selfFixSwot[bucket]) ? selfFixSwot[bucket] : [];
return (
<div key={bucket} className="rounded-md border border-success/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium capitalize text-success">{bucket}</div>
<div className="space-y-1">
{items.slice(0, 4).map((item: JsonMap) => (
<div key={item.id || item.text} className="rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px] text-success/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(item.id || bucket).replace(/_/g, " ")}</span>
<Badge variant={item.present === false ? "outline" : bucket === "threats" || bucket === "weaknesses" ? "warning" : "success"}>
{item.present === false ? "missing" : "seen"}
</Badge>
</div>
<div className="mt-1 text-success/70">{item.text}</div>
</div>
))}
{!items.length ? <div className="text-xs text-success/70">Waiting for self-fix director evidence.</div> : null}
</div>
</div>
);
})}
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-3">
<div className="rounded-md border border-success/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-success">Selected Repairs</div>
<div className="space-y-1">
{selfFixSelectedRepairs.slice(0, 5).map((repair: JsonMap) => (
<div key={repair.id} className="rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px] text-success/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{String(repair.title || repair.id).replace(/_/g, " ")}</span>
<Badge variant="outline">{repair.priority || "P1"}</Badge>
</div>
<div className="mt-1 text-success/70">{repair.acceptance}</div>
</div>
))}
{!selfFixSelectedRepairs.length ? <div className="text-xs text-success/70">No selected self-fix repairs are published yet.</div> : null}
</div>
</div>
<div className="rounded-md border border-success/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-success">Patch Apply Evidence</div>
<div className="space-y-1">
{selfFixPatchEvidence.slice(0, 5).map((patch: JsonMap) => (
<div key={patch.proposal_id || patch.blocked_reason} className="rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px] text-success/80">
<div className="flex items-center justify-between gap-2">
<span className="font-medium">{patch.proposal_id || "proposal"}</span>
<Badge variant={patch.status === "applied" ? "success" : patch.applied ? "warning" : "outline"}>
{patch.status || "waiting"}
</Badge>
</div>
<div className="mt-1 text-success/70">
{(patch.target_files || []).slice(0, 2).join(", ") || patch.blocked_reason || "no patch target"}
</div>
</div>
))}
{!selfFixPatchEvidence.length ? <div className="text-xs text-success/70">No guarded patch has been attempted in the latest self-fix report.</div> : null}
</div>
</div>
<div className="rounded-md border border-success/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-success">Audit Verdict</div>
<div className="space-y-2 text-xs text-success/80">
<div className="rounded border border-success/20 bg-background/20 px-2 py-1">
Audit record: {selfFixCodexAudit.state || "waiting"}
</div>
<div className="rounded border border-success/20 bg-background/20 px-2 py-1">
Autonomous handover: {selfFix.handover_ready ? "ready" : "held"}
</div>
<div className="rounded border border-success/20 bg-background/20 px-2 py-1">
Test evidence: {selfFix.test_evidence?.status || "waiting"}
</div>
</div>
{selfFixSnags.length ? (
<div className="mt-3 space-y-1">
{selfFixSnags.slice(0, 4).map((snag: JsonMap) => (
<div key={snag.id} className="rounded border border-warning/30 bg-warning/10 px-2 py-1 text-[11px] text-warning">
{snag.title || snag.id}
</div>
))}
</div>
) : null}
</div>
</div>
</div>
<div className="rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-primary">Metacognitive Creative Process Guardian</div>
<div className="mt-1 text-xs text-primary/75">
Every agent role must sense Aureon's metacognitive, sensory, HNC/Auris, and sentient-style evidence before declaring who, what, where, when, how, and act.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={creativeGuardian.ok ? "success" : creativeGuardian.schema_version ? "warning" : "outline"}>
{creativeGuardian.status || "guardian waiting"}
</Badge>
<Badge variant={creativeSummary.hnc_auris_ready ? "success" : "warning"}>
HNC/Auris {creativeSummary.hnc_auris_ready ? "ready" : "held"}
</Badge>
<Badge variant={creativeSummary.who_what_where_when_how_act_ready ? "success" : "warning"}>
roles {creativeSummary.creative_process_ready_role_count || 0}/{creativeSummary.role_count || 0}
</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-5">
<Mini label="Metacognitive" value={creativeSummary.metacognitive_ready ? "ready" : "waiting"} />
<Mini label="Sensory" value={creativeSummary.sensory_ready ? "ready" : "waiting"} />
<Mini label="Sentient-style" value={creativeSummary.sentient_style_ready ? "ready" : "waiting"} />
<Mini label="Repo surfaces" value={creativeSummary.repo_agent_surface_count || 0} />
<Mini label="Snags" value={creativeSummary.blocking_snag_count || 0} />
</div>
<div className="mt-3 grid gap-3 lg:grid-cols-3">
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Mind Sources</div>
<div className="space-y-1">
{creativeSources.slice(0, 6).map((source: JsonMap) => (
<div key={source.name} className="flex items-center justify-between gap-2 rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px]">
<span>{String(source.name || "").replace(/_/g, " ")}</span>
<Badge variant={source.present && !source.stale ? "success" : source.present ? "warning" : "outline"}>
{source.present ? (source.stale ? "stale" : "present") : "missing"}
</Badge>
</div>
))}
{!creativeSources.length ? <div className="text-xs text-primary/70">Mind source evidence appears after the guardian runs.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Creative Loop</div>
<div className="space-y-1">
{creativeLoop.slice(0, 6).map((step: JsonMap) => (
<div key={step.step} className="rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px]">
<div className="font-medium">{String(step.step || "").replace(/_/g, " ")}</div>
<div className="mt-1 text-primary/70">{step.owner}</div>
</div>
))}
{!creativeLoop.length ? <div className="text-xs text-primary/70">The creative loop is waiting for guardian evidence.</div> : null}
</div>
</div>
<div className="rounded-md border border-primary/25 bg-background/25 p-3">
<div className="mb-2 text-xs font-medium text-primary">Role Process Sample</div>
<div className="space-y-1">
{creativeRoleMap.slice(0, 6).map((role: JsonMap) => (
<div key={role.role_id || role.title} className="flex items-center justify-between gap-2 rounded border border-primary/20 bg-background/20 px-2 py-1 text-[11px]">
<span>{role.title || role.role_id}</span>
<Badge variant={role.status === "creative_process_ready" ? "success" : "warning"}>
{role.status === "creative_process_ready" ? "ready" : "hold"}
</Badge>
</div>
))}
{!creativeRoleMap.length ? <div className="text-xs text-primary/70">Role contracts appear after the agent company registry is loaded.</div> : null}
</div>
{creativeSnags.filter((snag: JsonMap) => snag.severity === "blocking").length ? (
<div className="mt-3 rounded border border-warning/30 bg-warning/10 px-2 py-1 text-[11px] text-warning">
{creativeSnags.filter((snag: JsonMap) => snag.severity === "blocking").length} blocking creative-process snag(s)
</div>
) : null}
</div>
</div>
</div>
<div className="rounded-md border border-warning/30 bg-warning/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-3">
<div>
<div className="text-sm font-medium text-warning">Scope Of Works</div>
<div className="mt-1 text-xs text-warning/75">
Aureon treats each prompt as a client job: scope first, team handoff second, HNC/Auris drift proof, then snagging before client handover.
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={clientJob.scope_locked ? "success" : "warning"}>
{String(clientJob.scope_status || "waiting_for_prompt").replace(/_/g, " ")}
</Badge>
<Badge variant="outline">questions {clientQuestions.length}</Badge>
<Badge variant={finalHandoverVisible ? "success" : "warning"}>
handover {finalHandoverVisible ? "visible" : "held"}
</Badge>
</div>
</div>
<div className="mt-3 grid gap-2 md:grid-cols-2">
<Mini label="Goal" value={scopeOfWorks.goal || "waiting"} />
<Mini label="Deliverables" value={scopeOfWorks.deliverables || "waiting"} />
<Mini label="Target" value={scopeOfWorks.target_system || "waiting"} />
<Mini label="Acceptance" value={scopeOfWorks.acceptance || "waiting"} />
</div>
{clientQuestions.length ? (
<div className="mt-3 space-y-2">
{clientQuestions.map((question: JsonMap) => (
<div key={question.id} className="rounded-md border border-warning/30 bg-background/30 p-3">
<div className="text-xs font-medium text-warning">{question.question}</div>
<div className="mt-1 text-[11px] text-warning/70">{question.why_needed}</div>
<Textarea
value={scopeAnswers[question.id] || ""}
onChange={(event) =>
setScopeAnswers((current) => ({ ...current, [question.id]: event.target.value }))
}
className="mt-2 min-h-[64px] bg-background/60 text-xs"
placeholder="Client answer for this scope item"
/>
</div>
))}
<Button size="sm" onClick={approveScope} disabled={busy}>
<Send className="mr-2 h-4 w-4" />
Approve Scope And Send To Team
</Button>
</div>
) : null}
<div className="mt-3 grid gap-2 lg:grid-cols-3">
<div className="rounded-md border border-border/30 bg-background/25 p-3">
<div className="text-xs font-medium">Agent Team</div>
<div className="mt-2 space-y-1">
{agentTeam.slice(0, 6).map((agent: JsonMap) => (
<div key={`${agent.role}-${agent.phase}`} className="flex items-center justify-between gap-2 text-[11px]">
<span>{agent.role}</span>
<Badge variant={agent.status === "active" ? "success" : "outline"}>{String(agent.status || "waiting").replace(/_/g, " ")}</Badge>
</div>
))}
{!agentTeam.length ? <div className="text-xs text-muted-foreground">Team appears after first client job intake.</div> : null}
</div>
</div>
<div className="rounded-md border border-border/30 bg-background/25 p-3">
<div className="text-xs font-medium">Phase Timers</div>
<div className="mt-2 space-y-1">
{phaseTimers.slice(0, 7).map((phase: JsonMap) => (
<div key={phase.phase} className="flex items-center justify-between gap-2 text-[11px]">
<span>{String(phase.phase || "").replace(/_/g, " ")}</span>
<Badge variant={phase.status === "completed" ? "success" : phase.status === "waiting_client" ? "warning" : "outline"}>
{String(phase.status || "pending").replace(/_/g, " ")}
</Badge>
</div>
))}
{!phaseTimers.length ? <div className="text-xs text-muted-foreground">Timers start when a prompt enters the client lane.</div> : null}
</div>
</div>
<div className="rounded-md border border-border/30 bg-background/25 p-3">
<div className="text-xs font-medium">Handover Gate</div>
<div className="mt-2 text-xs text-muted-foreground">
{handoverStatus.reason || "Finished products stay hidden until proof and snagging are clear."}
</div>
<div className="mt-2 grid grid-cols-2 gap-2">
<Mini label="Proof" value={`${proofChecklist.filter((item: JsonMap) => item.ok).length}/${proofChecklist.length || 0}`} />
<Mini label="Snags" value={snaggingList.filter((item: JsonMap) => item.severity === "blocking").length} />
</div>
</div>
</div>
</div>
<div className="rounded-md border border-primary/30 bg-primary/5 p-3">
<div className="flex flex-wrap items-center justify-between gap-2">
<div className="flex items-center gap-2">
<FileText className="h-4 w-4 text-primary" />
<div>
<div className="text-sm font-medium">Work Journal: Prompt To Finished Files</div>
<div className="text-xs text-muted-foreground">
Aureon shows every stage it went through, with evidence and verification.
</div>
</div>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant={journal.status === "complete" ? "success" : "warning"}>
{journal.status || "waiting"}
</Badge>
<Badge variant="outline">{journal.completed_count || 0}/{journal.stage_count || 0} stages</Badge>
<Badge variant={journal.attention_count ? "warning" : "outline"}>
attention {journal.attention_count || 0}
</Badge>
</div>
</div>
<ScrollArea className="mt-3 h-[300px] pr-3">
<div className="space-y-2">
{journalStages.map((stage: JsonMap, index: number) => (
<div key={stage.id || stage.title || index} className="rounded-md border border-border/40 bg-background/50 p-3">
<div className="flex flex-wrap items-start justify-between gap-2">
<div className="min-w-0">
<div className="flex items-center gap-2">
<span className="flex h-6 w-6 items-center justify-center rounded-full border border-primary/40 bg-primary/10 text-[11px] font-semibold">
{index + 1}
</span>
<div className="text-sm font-medium">{stage.title || stage.id}</div>
</div>
<div className="mt-2 text-xs text-muted-foreground">{stage.summary || "No summary published."}</div>
<div className="mt-2 font-mono text-[11px] text-muted-foreground">{compactEvidence(stage)}</div>
</div>
<Badge variant={stage.ok ? "success" : "warning"}>{String(stage.status || "pending").replace(/_/g, " ")}</Badge>
</div>
{Array.isArray(stage.evidence?.published_files) && stage.evidence.published_files.length ? (
<div className="mt-2 flex flex-wrap gap-1">
{stage.evidence.published_files.slice(0, 4).map((file: string) => (
<Badge key={file} variant="outline" className="max-w-full truncate font-mono text-[10px]">
{file}
</Badge>
))}
</div>
) : null}
{Array.isArray(stage.evidence?.commands) && stage.evidence.commands.length ? (
<div className="mt-2 space-y-1">
{stage.evidence.commands.slice(0, 2).map((command: JsonMap, commandIndex: number) => (
<div key={`${stage.id}-command-${commandIndex}`} className="rounded border border-border/30 bg-muted/20 px-2 py-1 font-mono text-[10px] text-muted-foreground">
{command.ok ? "PASS" : "ATTN"} {command.command}
</div>
))}
</div>
) : null}
</div>
))}
{!journalStages.length ? (
<div className="rounded-md border border-border/40 bg-muted/10 p-4 text-sm text-muted-foreground">
No work journal has been published yet. Send a prompt to Aureon to produce one.
</div>
) : null}
</div>
</ScrollArea>
</div>
{artifactItems.length ? (
<div className="rounded-md border border-success/30 bg-success/10 p-3">
<div className="mb-3 flex flex-wrap items-center justify-between gap-2">
<div className="text-sm font-medium text-success">Finished Artifacts</div>
<Badge variant="success">{artifactItems.length} visible</Badge>
</div>
<div className="grid gap-3 lg:grid-cols-2">
{artifactItems.map((artifact) => (
<div key={artifact.url} className="rounded-md border border-success/25 bg-background/30 p-3">
<div className="mb-2 flex flex-wrap items-center justify-between gap-2">
<div className="text-xs font-medium text-success">{artifact.title}</div>
<a
href={artifact.url}
target="_blank"
rel="noreferrer"
className="rounded-md border border-success/40 px-2 py-1 text-[11px] text-success hover:bg-success/10"
>
Open Artifact
</a>
</div>
{artifact.kind === "image" ? (
<img src={artifact.url} alt={artifact.title} className="max-h-[320px] w-full rounded border border-success/20 bg-white object-contain" />
) : artifact.kind === "video" ? (
<video src={artifact.url} className="max-h-[320px] w-full rounded border border-success/20 bg-black" controls />
) : (
<div className="rounded border border-success/20 bg-muted/20 p-3 font-mono text-[11px] text-muted-foreground">{artifact.url}</div>
)}
<div className="mt-2 truncate font-mono text-[10px] text-success/70">{artifact.path || artifact.url}</div>
</div>
))}
</div>
</div>
) : null}
<div className="grid gap-3 lg:grid-cols-[1fr_0.8fr]">
<div className="space-y-2">
<Textarea
value={prompt}
onChange={(event) => setPrompt(event.target.value)}
className="min-h-[130px] font-mono text-xs"
/>
<div className="flex flex-wrap items-center justify-between gap-2">
<label className="flex items-center gap-2 text-xs text-muted-foreground">
<input
type="checkbox"
checked={runTests}
onChange={(event) => setRunTests(event.target.checked)}
className="h-4 w-4"
/>
Run focused coding tests
</label>
<label className="flex items-center gap-2 text-xs text-muted-foreground">
<input
type="checkbox"
checked={includeDesktop}
onChange={(event) => setIncludeDesktop(event.target.checked)}
className="h-4 w-4"
/>
Prepare desktop/run handoff
</label>
<div className="flex gap-2">
<label className="inline-flex cursor-pointer items-center rounded-md border border-input bg-background px-3 py-2 text-xs font-medium hover:bg-accent hover:text-accent-foreground">
<Upload className="mr-2 h-4 w-4" />
{loadedFileName ? loadedFileName : "Load MD"}
<input type="file" accept=".md,.txt" className="hidden" onChange={loadPromptFile} />
</label>
<Button size="sm" variant="outline" onClick={refresh} disabled={busy}>
Refresh
</Button>
<Button size="sm" variant="outline" onClick={sendFullCodingJob} disabled={busy || !prompt.trim()}>
Full Coding Job
</Button>
<Button size="sm" onClick={() => submitPrompt()} disabled={busy || !prompt.trim()}>
<Send className="mr-2 h-4 w-4" />
Send To Aureon
</Button>
</div>
</div>
{error ? <div className="rounded-md border border-destructive/30 bg-destructive/10 p-2 text-xs text-destructive">{error}</div> : null}
</div>
<div className="space-y-2 rounded-md border border-border/40 bg-muted/10 p-3">
<div className="text-sm font-medium">Who What Where When How Act</div>
{["who", "what", "where", "when", "how", "act"].map((key) => (
<div key={key} className="rounded-md border border-border/30 bg-background/20 px-3 py-2">
<div className="text-[10px] uppercase text-muted-foreground">{key}</div>
<div className="mt-1 truncate font-mono text-[11px]">{JSON.stringify(status[key] || {})}</div>
</div>
))}
</div>
</div>
<div className="grid gap-3 lg:grid-cols-2">
<div className="space-y-2 rounded-md border border-success/30 bg-success/10 p-3">
<div className="flex flex-wrap items-center justify-between gap-2">
<div className="text-sm font-medium text-success">Finished Product Audit</div>
<Badge variant={finalHandoverVisible ? "success" : "warning"}>
{finalHandoverVisible ? "ready for client" : "handover held"}
</Badge>
</div>
{finalHandoverVisible ? (
(productAudit.stages || []).slice(0, 8).map((stage: JsonMap) => (
<div key={stage.stage} className="flex items-center justify-between rounded-md border border-success/20 bg-background/30 px-3 py-2 text-xs">
<span>{String(stage.stage || "").replace(/_/g, " ")}</span>
<span className={stage.ok ? "text-success" : "text-warning"}>{stage.ok ? "pass" : "attention"}</span>
</div>
))
) : (
<div className="rounded-md border border-warning/30 bg-warning/10 p-3 text-xs text-warning">
Final handover is hidden until scope, route, proof, and snagging gates pass.
</div>
)}
<div className="grid gap-2 sm:grid-cols-2">
<div className="space-y-1">
<div className="text-[11px] uppercase text-success/70">Proof checklist</div>
{proofChecklist.slice(0, 6).map((item: JsonMap) => (
<div key={item.id} className="flex items-center justify-between rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px]">
<span>{item.label}</span>
<span className={item.ok ? "text-success" : "text-warning"}>{item.ok ? "pass" : "hold"}</span>
</div>
))}
</div>
<div className="space-y-1">
<div className="text-[11px] uppercase text-success/70">Snagging list</div>
{snaggingList.slice(0, 6).map((snag: JsonMap) => (
<div key={snag.id} className="rounded border border-success/20 bg-background/20 px-2 py-1 text-[11px]">
<div className="flex items-center justify-between gap-2">
<span>{snag.title}</span>
<span className={snag.severity === "blocking" ? "text-warning" : "text-success"}>{snag.status}</span>
</div>
</div>
))}
</div>
</div>
</div>
<div className="space-y-2 rounded-md border border-primary/30 bg-primary/10 p-3">
<div className="flex flex-wrap items-center justify-between gap-2">
<div className="text-sm font-medium text-primary">Desktop And Remote Run Handoff</div>
<Badge variant={desktopController.emergency_stopped ? "destructive" : "outline"}>
{desktopController.dry_run === false ? "live" : "dry run"}
</Badge>
</div>
<div className="grid gap-2 sm:grid-cols-3">
<Mini label="Armed" value={desktopController.armed ? "yes" : "no"} />
<Mini label="Pending" value={(desktopController.pending_actions || []).length} />
<Mini label="VM tools" value={desktop.remote_vm_control?.tool_count || 0} />
</div>
<div className="text-xs text-primary/75">
{desktop.safety?.desktop_default || "Desktop control is dry-run unless the operator arms it."}
</div>
</div>
</div>
<ScrollArea className="h-[220px] pr-3">
<div className="space-y-2">
{steps.map((step: JsonMap) => (
<div key={step.step_id || step.title} className="rounded-md border border-border/40 bg-muted/10 p-3">
<div className="flex flex-wrap items-start justify-between gap-2">
<div>
<div className="text-sm font-medium">{step.title || step.intent}</div>
<div className="mt-1 font-mono text-[11px] text-muted-foreground">{step.intent}</div>
</div>
<Badge variant={step.status === "completed" ? "success" : "outline"}>{step.status || "pending"}</Badge>
</div>
</div>
))}
{!steps.length ? (
<div className="rounded-md border border-border/40 bg-muted/10 p-4 text-sm text-muted-foreground">
No coding route has been published yet.
</div>
) : null}
</div>
</ScrollArea>
</CardContent>
</Card>
);
}
function Stat({ icon: Icon, label, value }: { icon: any; label: string; value: unknown }) {
return (
<div className="rounded-md border border-border/40 bg-muted/10 p-3">
<div className="flex items-center gap-2 text-[11px] uppercase text-muted-foreground">
<Icon className="h-3.5 w-3.5" />
{label}
</div>
<div className="mt-1 text-lg font-semibold">{typeof value === "number" ? fmt(value) : String(value || "0")}</div>
</div>
);
}
function Mini({ label, value }: { label: string; value: unknown }) {
return (
<div className="rounded-md border border-border/30 bg-background/20 px-3 py-2 text-xs">
<div className="text-[10px] uppercase text-muted-foreground">{label}</div>
<div className="mt-1 font-semibold">{typeof value === "number" ? fmt(value) : String(value || "0")}</div>
</div>
);
}