Partial Failure Summary

Preview in your theme

status='ready' — 42 of 50 imported, 5 failed across three causes, 3 skipped. The run was not atomic, so the successes are already saved and Retry is scoped to the 2 transient failures; the 3 that need the source fixed are named rather than silently retried. Retry replaces the card with the retry run's own summary.

Import subscribers

run_2f9c41ab

Partial

42 of 50 subscribers imported — 5 failed, 3 skipped.

Partially committed — the 42 subscribers that went through are already saved; the 5 that failed changed nothing.

Succeeded4284%
Failed510%
Skipped36%

3 causes · 5 failures

2 reasons · 3 skipped

- [email protected]row-4
- [email protected]row-19
- [email protected]row-38

Retries only the failed subscribers. The 42 already saved are left alone, so nothing is written twice.

3 of the 5 failures need fixing at the source first, so they stay out of the retry.

no callback fired yet

status='ready', transactional=true — identical counts, opposite meaning. Nothing was written, so the successes read as rolled back, the headline drops the 'imported' claim, and the follow-up becomes 'Re-run all 47' instead of retrying 5. Download is intercepted by the consumer here.

Import subscribers

run_8c0be713

Rolled back

42 of 50 subscribers succeeded — 5 failed, 3 skipped.

Rolled back — the run was atomic, so the 42 subscribers that went through were undone with it. Nothing was written.

Rolled back4284%
Failed510%
Skipped36%

3 causes · 5 failures

2 reasons · 3 skipped

- [email protected]row-4
- [email protected]row-19
- [email protected]row-38

Re-runs the 42 rolled-back subscribers together with the 5 that failed — the first attempt wrote nothing, so this is not a second write. The 3 skipped subscribers stay out.

3 of the 5 failures will fail again unless they are fixed at the source: the re-run covers every subscriber, so it can only commit once they are.

no callback fired yet

status='loading' — the action has been sent and the report hasn't come back. The header keeps the action name, because that much is already known.

Import subscribers

status='empty' — the run matched nothing, so nothing was written. Not an error, and not a zero-row success table.

Import subscribers

run_5d1e77c0

Nothing ran

Nothing to report — Import subscribers matched no subscribers, so nothing was written.

Widen the selection or the filter and run it again.

status='error' — the report itself failed to load, which says nothing about the action. The panel says so instead of implying a failure, and offers a reload rather than a re-run.

Import subscribers

Report unavailable

This report didn't load

GET /v1/imports/run_2f9c41ab timed out after 10s. request-id: 7f2c-9ad1

That is this panel failing, not the action — Import subscribers may well have finished. Check the run before starting it again.

Loading preview…

"use client"

import * as React from "react"
import { ChevronRight, CircleAlert, CircleCheck, Download, RotateCcw, Undo2 } from "lucide-react"

import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { cn } from "@/lib/utils"
import type {
  PartialFailureSummaryData,
  PartialFailureSummaryFailure,
  PartialFailureSummaryItem,
  PartialFailureSummaryUnit,
} from "./partial-failure-summary.contract"

Installation

npx shadcn@latest add https://ui.zyeon.ai/r/partial-failure-summary.json

Prompt

Build a React + TypeScript + Tailwind "PartialFailureSummary" card (lucide-react
icons, zod, shadcn Button + Badge) that reports the immediate result of ONE bulk
action — not a job board, no clock, no polling: every number is final.

Contract
- One zod schema is the single source of truth:
  { status: "loading" | "empty" | "error" | "ready"; action: string;
    total: number; succeeded: string[];
    failed: { id, label, reason, code?, retryable? }[];
    skipped: { id, label, reason }[];
    transactional: boolean; unit?: { one, other }; verb?: string; runId?: string }.
- Props = z.infer of that schema, plus onRetry?(ids: string[]),
  onDownloadReport?(csv, filename), onReload?(), errorMessage? and the native
  section attributes; forwardRef to the root <section> and spread the rest.
- `succeeded` is ids only — the card needs their count and, in an atomic run,
  their ids to re-run; it never needs 40k labels.
- `skipped` is NOT `failed`: a skipped row was never attempted, so it is counted,
  grouped and coloured separately and stays out of every failure number.

Behavior
- Four first-class branches. `loading` keeps the real action name in the header
  (it is already known) over a skeleton body; `empty` says the run matched
  nothing and wrote nothing; `error` means the REPORT did not load and says so
  explicitly — "that is this panel failing, not the action, it may well have
  finished" — offering reload, never a re-run; `ready` renders the summary.
- Headline: one assembled sentence, e.g. "42 of 50 subscribers imported — 5
  failed, 3 skipped." Build it as a string, not as JSX fragments, so no space
  can be swallowed. Zero failures and zero skips collapse it to "All N …".
- Commitment line, always rendered, derived from `transactional` + the failure
  count: committed / partially committed / rolled back, naming how many rows each
  claim covers. An atomic run that failed also DROPS the consumer's verb from the
  headline ("imported" claims a commit that never happened) and falls back to
  "succeeded". Rows the payload never accounts for are never claimed either way:
  a report whose arrays undershoot `total` names the gap instead of reading the
  silence as "nothing was attempted", and its header badge says "Incomplete"
  rather than "Complete".
- Proportion bar + legend over succeeded / failed / skipped / not-reported, with
  whole percents apportioned by LARGEST REMAINDER so they total exactly 100.
  Arrays that overrun `total` widen the denominator instead of printing >100%;
  arrays that undershoot it show the gap as "not reported". A slice that happened
  never prints 0%: anything non-empty is floored up to 1%, borrowing the point
  from the largest share, so 499 of 500 cannot legend as "Succeeded 100%" beside
  "Failed 0%".
- Failures are grouped by cause (`code` when present, else the reason text),
  biggest group first, ties alphabetical — a stable total order, never insertion
  order. Each group is a disclosure (button aria-expanded + aria-controls over a
  role=region panel) listing every affected row as label + id. The largest
  failure group starts open; skipped groups start closed. Each group's meta line
  promises only what exists: a retryable group reads "included in a retry" when
  `onRetry` was supplied and a neutral "safe to run again" when it was not.
- Retry is SCOPED by the same flag, and is the whole point:
  · non-atomic → onRetry(ids of failures with retryable !== false), labelled
    "Retry N failed", with a note that the already-saved rows are left alone and
    how many failures were excluded because they need the source fixed first;
  · atomic → onRetry(succeeded + failed ids), labelled "Re-run all N", with a
    note that the first attempt wrote nothing so this is not a second write, and
    — when some failures are blocked — that the re-run carries them along and
    will fail on them again until they are fixed at the source;
  · nothing retryable → NO button, atomic or not: re-running a set whose every
    failure needs the source fixed rolls back exactly the same way, so the
    transaction flag cannot buy a button back. State the blocker and the fix.
  · no onRetry prop → no affordance at all. Never render a dead disabled button.
- The report button builds an RFC 4180 CSV (outcome, id, label, reason, code)
  of every failed and skipped row: fields containing a comma, quote or newline are
  quoted and embedded quotes doubled, records end CRLF, and cells starting with
  = + - @ or a tab/CR get a leading apostrophe so a user-supplied label cannot
  become a spreadsheet formula. Without onDownloadReport the card downloads it
  itself via a Blob URL (UTF-8 BOM so Excel decodes it) through an anchor that is
  appended to the document, clicked and removed — a detached anchor is ignored by
  some browsers — and the URL is revoked a second later on a timeout that is
  cleared on unmount, because revoking it immediately cancels the transfer in
  others. Both bugs ship the user an empty file.
- Accessibility: the summary is announced through an sr-only polite live region
  filled one animation frame AFTER mount (a region that arrives pre-filled
  announces nothing), and the frame is cancelled on unmount and before rebuild.
  Scrollable group panels are focusable so keyboard users can reach the overflow.
  Nothing clips the disclosure focus ring: a full-bleed row inside a rounded
  container rounds its own corners instead of sitting in an `overflow-hidden`
  ancestor, which would paint the ring and then cut it away on every side.

Rendering & styling
- Semantic tokens only: bg-card / border for the card, bg-primary for succeeded,
  bg-destructive (and bg-destructive/10 + text-destructive for counts) for
  failures, bg-muted-foreground/50 for skipped, bg-foreground/20 for unreported,
  text-muted-foreground for supporting copy. No hex, no palette classes.
- Numbers tabular-nums; long labels, reasons and ids use wrap-anywhere so nothing
  is clipped at 420px; cn() merges className.
- Only two transitions (row hover, chevron rotation) and both are disabled under
  motion-reduce; the skeleton's pulse too. Collapsed panels use the `hidden`
  attribute, so there is no animation to reduce in the first place.

Customization levers
- Vocabulary: `unit` and `verb` carry the whole sentence — "files deleted",
  "invites sent", "invoices voided" — no string in the component is action-specific.
- Grouping key: swap `code ?? reason` for a coarser bucket (HTTP class, owning
  team) when your errors carry more structure than one code.
- Density: drop the proportion bar and keep the legend for a compact toast-sized
  card, or drop the legend and keep the bar for a wide one.
- Default disclosure: open every failure group, or none, by changing the single
  `index === 0` fallback in the open-state map.
- Report: hand `onDownloadReport` to a server endpoint, or reuse the exported
  `buildFailureReportCsv` to feed a share sheet or clipboard instead of a file.
- Emphasis: `Badge` variants carry the outcome pill (Complete / Partial /
  Failed) — swap in your own status vocabulary without touching the counts.

Concepts

Skipped is not failed — a skipped row was never attempted, so it gets its own count, its own colour and its own groups; folding it into the failure number sends people hunting a bug that does not exist.
Commitment statement — the card says outright whether the successful part was committed or rolled back, because the same counts mean opposite things and guessing is how a write gets duplicated.
Retry scope follows the transaction — non-atomic runs retry the failures only; atomic runs re-run everything they touched, since the successes were undone too. The button's label and note both change with it.
Grouped by cause, expandable to rows — eighty failures with three causes read as three lines; the individual rows stay one disclosure away instead of being summarised out of existence.
Blocked, not disabled — when nothing is retryable the card explains why and what to fix instead of rendering a button that could only fail. Atomicity does not buy the button back: re-running a set whose every failure needs the source fixed rolls back exactly the same way.
Largest remainder — whole percents floor-then-distribute so the split always totals exactly 100, in every payload the card is handed, and a slice that happened is never rounded down to 0% — one failure in 500 is 1%, not a card claiming 100% success.

Partial Failure Summary

Import subscribers

The mail provider rate-limited the import429_RATE_LIMITEDtransient — included in a retry2

The recipient's mail server rejected the address as unknownSMTP_550needs a fix before it can succeed2

Row is missing the required country fieldMISSING_FIELDneeds a fix before it can succeed1

Already on this list — added on 2025-09-14never attempted — nothing failed here2

Unsubscribed on 2025-11-03 and still on the suppression listnever attempted — nothing failed here1

Import subscribers

The mail provider rate-limited the import429_RATE_LIMITEDtransient — included in a retry2

The recipient's mail server rejected the address as unknownSMTP_550needs a fix before it can succeed2

Row is missing the required country fieldMISSING_FIELDneeds a fix before it can succeed1

Already on this list — added on 2025-09-14never attempted — nothing failed here2

Unsubscribed on 2025-11-03 and still on the suppression listnever attempted — nothing failed here1

Import subscribers

Import subscribers

Import subscribers

Installation

Prompt

Concepts

On This Page

Import subscribers

The mail provider rate-limited the import429_RATE_LIMITEDtransient — included in a retry2

The recipient's mail server rejected the address as unknownSMTP_550needs a fix before it can succeed2

Row is missing the required country fieldMISSING_FIELDneeds a fix before it can succeed1

Already on this list — added on 2025-09-14never attempted — nothing failed here2

Unsubscribed on 2025-11-03 and still on the suppression listnever attempted — nothing failed here1

Import subscribers

The mail provider rate-limited the import429_RATE_LIMITEDtransient — included in a retry2

The recipient's mail server rejected the address as unknownSMTP_550needs a fix before it can succeed2

Row is missing the required country fieldMISSING_FIELDneeds a fix before it can succeed1

Already on this list — added on 2025-09-14never attempted — nothing failed here2

Unsubscribed on 2025-11-03 and still on the suppression listnever attempted — nothing failed here1

Import subscribers

Import subscribers

Import subscribers