(CODUX-221) Create shared CI status presentation

[numnx]

🧩 Task: Create shared CI status presentation

Automated task PR opened by Code UX for T02.

📋 Summary

Sprint: Sprint 221 · Clarify QA follow-ups and CI status · Task: T02

Clarify QA change requests and CI progress consistently across Sprint, Task, and Live cards by projecting complete QA follow-up metadata, deriving durable CI workflow states from existing execution evidence, and presenting accessible, responsive badges with end-to-end regression coverage and synchronized documentation.

🤖 Model & Provider

Provider	Codex CLI
Model	gpt-5.6-sol

⏱️ Timing

Started	2026-07-13 18:58:59 UTC
Finished	2026-07-13 19:13:29 UTC
Duration	14m 30s

📊 Token Usage

Metric	Value
Input tokens	187,724
Cached input tokens	6,257,408
Output tokens	28,564
Total tokens	6,473,696
Invocations	1
Tool calls	60
Active time	13m 57s

Included usage estimate (subscription/local login): $4.92

✅ QA Review

⏳ QA review runs after this PR is opened. Check the task card in the dashboard for the outcome once it lands.

📝 Full Task Prompt

## Objective
Create a shared CI presentation model and badge that represent pull-request, checks, and merge progress with GitHub-like pending, running, success, and failure states.

## Scope
- Create `dashboard/src/v2/lib/ci-status-presentation.ts`
- Create `dashboard/src/v2/components/ui/CiStatusBadge.tsx`
- Create `tests/dashboard/v2/lib/ci-status-presentation.test.ts`
- Create `tests/dashboard/v2/components/ui/CiStatusBadge.test.tsx`
- Verify compatibility with `dashboard/src/v2/components/live/GitCIStatusPanel.tsx`
- Consume `ExecutionRuntimeEventSummary`, `ExecutionAttentionItemSummary`, and merge-indicator contracts from `src/contracts/app-types.ts`

## Implementation Requirements
1. Add pure task and sprint derivation functions that consume `ci_gate_status`, `main_merge_gate_status`, active `ci_fix_required` attention items, and merge-indicator fallback data without making Git host or API requests.
2. Normalize the evidence into pull-request, checks, and merge steps whose states are pending, in progress, successful, or failed; select the newest event per entity before aggregation and apply failure-before-progress-before-success precedence across current entities.
3. Treat active matching CI attention as an unresolved failure, clear stale event failures when newer evidence supersedes them after attention resolution, and return no badge when evidence is absent or unrelated.
4. Distinguish actual CI-check failure from review blockers, merge conflicts, missing pull requests, and other non-CI intervention states.
5. Build `CiStatusBadge` with visible labels, accessible names, semantic icons, a red `XCircle` failure treatment, reduced-motion-safe progress animation, responsive sizing, and a keyboard-accessible details view of all workflow steps.
6. Add focused tests for task and sprint scoping, feature and main merge events, stale-event replacement, active-attention precedence, unknown payloads, failure styling, keyboard access, and reduced-motion behavior.

## Constraints
- Do not introduce a new CI database schema, polling loop, request endpoint, or per-card GitHub lookup.
- Keep derivation deterministic and idempotent so reconnects and persisted snapshot replay produce the same state.
- Reuse Lucide icons and existing Tailwind design tokens; do not add dependencies or alter unrelated `GitCIStatusPanel` behavior.
- Do not infer success from missing data or display a CI failure for review-only blockers.
- Do not edit page-specific card components or dashboard documentation owned by later tasks.

## Verification
- Run `pnpm exec vitest run tests/dashboard/v2/lib/ci-status-presentation.test.ts tests/dashboard/v2/components/ui/CiStatusBadge.test.tsx`.
- Run `pnpm run lint`, `pnpm run test:dashboard`, and `pnpm run build`.
- Confirm pending and running steps remain non-red, failed checks display a visible and screen-reader-identifiable red X, and unrelated events produce no badge.

🌿 Branch Info

Base: feature/CODUX-221-clarify-qa-follow-ups-and-ci-status
Head: task/feature-codux-22-t02-codex-1bb33e32-mrjl5yt6

---

🤖 Generated by Code UX