Findings reportPro

Bug and security findings with severity, file and line, a repro, and fix or dismiss actions.

Markdown

On this page

ProA review of an invoicing service: filter by severity, open a finding, fix it with the agent.

Installation

$ pnpm dlx shadcn@latest add @chatcn-pro/findings-report

Usage

tsx

import { FindingsReport } from "@/components/ui/chatcn/pro/findings-report"

<FindingsReport
  title="Review of billing-service"
  findings={findings}
  onFix={(id) => agent.fix(id)}
  onDismiss={(id, reason) => dismiss(id, reason)}
  onOpenFile={(file, line) => openInEditor(file, line)}
/>

Severity is four rising bars, filled up to the level, so the order reads without color; the tint only confirms it. The strip on top counts open findings per severity and doubles as the filter. Opening a finding shows the code with the line marked in its severity color, the steps or command that reproduce it, and the actions. Once fixed, pass fixPatch and the diff replaces the excerpt.

Examples

States

ProScanning, fixed with the diff, a failed fix, filtered, clean, loading and a broken scan.

Props

Prop	Type	Notes
`findings`	`Finding[]`	`{ id, title, severity, kind, file, line, code?, repro?, fixPatch?, status? }`
`status`	`"idle" \| "loading" \| "scanning" \| "error"`	Scanning keeps findings arriving
`scanned`	`{ done, total }`	Files read so far, while scanning
`onFix`	`(id) => Promise<void>`	Reject with an Error that says what to do next
`onDismiss`	`(id, reason) => void`	Reasons from `dismissReasons`
`onReopen`, `onOpenFile`		Optional actions
`filter`, `defaultFilter`, `onFilterChange`	`{ severities, kind, resolved }`	Controlled or not
`defaultOpenId`	`string`	The finding open at first

Keyboard

Key	Action
Enter or Space	Open or close a finding; toggle a filter
Tab	Filters, then each finding and its actions

Accessibility

Each severity group is a labelled section; every row starts with its severity in words for screen readers.
Filters are toggle buttons with aria-pressed.
A failed fix is an alert with the reason and the next step.

Motion

An opened finding fades and settles in 180 ms; the chevron turns in 150 ms. Nothing animates on filter changes. Reduced motion keeps the fade only.