CI checksPro
The checks on a commit, failures first, each against how long it usually takes. Rows open to annotations and the live log, and a failure turns Ask agent to fix into the agent's fix attempt in place.
On this page
ProA failing unit test on an agent branch. Ask agent to fix runs the fix in place: steps stream in, the commit lands, the check re-runs and passes.
Installation
Usage
import { CiChecks } from "@/components/ui/chatcn/pro/ci-checks"
<CiChecks checks={checks} commit={{ sha, branch }} onAskFix={askAgentToFix} onRerun={rerun} />Each check has a status (queued, running, passed, failed, skipped, cancelled). Pass expectedMs to draw the duration bar and the time left while running; startedAt drives the live clock. When the agent works on a failure, set the check's fix with its phase (fixing, pushed, failed), steps as they happen and the commit it pushed.
Examples
States
Fixing, a fix that failed with how to unblock it, all passed, long names read only, no checks, an error, loading and right to left.
ProFixing, a failed fix, all passed, long names read only, no checks, an error and loading.
Props
| Prop | Type | Notes |
|---|---|---|
checks | CiCheck[] | name, workflow, status, startedAt, durationMs, expectedMs, required, logs, summary, annotations, fix |
commit | { sha, branch? } | Shown in the header |
expanded, defaultExpanded, onExpandedChange | string[] | Open checks |
onAskFix | (id) => void | Ask agent to fix on failed checks, and Try again on a failed fix |
onRerun, onRerunFailed | (id) => void, () => void | Per check, and every failure from the header |
onAnnotationSelect | (path, line) => void | Makes annotation locations links |
loading, error, onRetry | Error says how to fix it | |
disabled | boolean | Read only: no fix or re-run actions |
logHeight | number | string | Default 240 |
Keyboard
| Key | Action |
|---|---|
ArrowUp ArrowDown Home End | Move between checks |
Enter Space | Open or close the check's log |
Tab | To Ask agent to fix and Re-run on the row |
Accessibility
- Every status has its own glyph and is read out in words. The summary strip is decorative; the counts under it say the same in text.
- The headline is a polite live region, so a check finishing or failing is announced once, not per log line.
- Fix steps read as Done, Now and Next. A failed fix is an alert that says how to unblock it.
Motion
- Rows open with a 200 ms height and fade. The running duration bar fills once a second, linear, like a clock.
- A fix attempt rises 4 px over 180 ms when it starts. Reduced motion drops the travel and the height change.