| 1 | import { CircleCheck, CircleX, Clock3, TriangleAlert } from "lucide-react"; |
| 2 | import { useT } from "../lib/i18n"; |
| 3 | import { turnChangeText, turnCheckState, turnCheckText } from "../lib/turnResult"; |
| 4 | import type { WireCompletionSummary } from "../lib/types"; |
| 5 | |
| 6 | export function TurnResultSummary({ summary }: { summary: WireCompletionSummary }) { |
| 7 | const t = useT(); |
| 8 | const diff = summary.receipt?.diff; |
| 9 | const state = turnCheckState(summary); |
| 10 | const Icon = state.status === "passed" ? CircleCheck : state.status === "failed" ? CircleX : state.status === "running" ? Clock3 : TriangleAlert; |
| 11 | return <div className="turn-result-summary"> |
| 12 | <div className="turn-result-summary__changes"> |
| 13 | {diff && diff.coverage !== "unknown" && diff.files.length > 0 ? <> |
| 14 | <span>{t(diff.coverage === "complete" ? "completion.filesChanged" : "completion.filesCounted", { count: diff.files.length })}</span> |
| 15 | <span aria-hidden="true"> · </span><span className="turn-result-added">+{diff.added}</span>{" "}<span className="turn-result-removed">−{diff.removed}</span> |
| 16 | {diff.coverage === "partial" && <span> · {t("completion.partialStats")}</span>} |
| 17 | </> : turnChangeText(summary, t)} |
| 18 | </div> |
| 19 | <div className={`turn-result-summary__checks turn-result-summary__checks--${state.status}`} aria-busy={summary.checking || undefined}> |
| 20 | <Icon size={14} aria-hidden="true" /><span>{turnCheckText(summary, t)}</span> |
| 21 | </div> |
| 22 | {diff?.coverage === "partial" && <details className="notice-line__details"><summary>{t("notice.details")}</summary><p>{t("completion.coverageReason")}</p></details>} |
| 23 | </div>; |
| 24 | } |
| 25 |