shadcn.io is not affiliated with official shadcn/ui
Secret Scanner Dashboard Block for React Aria
Seven secrets found in repositories with their path, severity and whether they are still valid, and for the picked one the commit, a redacted value, five remediation steps with checkboxes, a progress bar, the purge command and a Revoke and rotate confirm.
Installation
Overview
Clean up a leaked credential in the right order with this secret scanner panel for React with React Aria. A hairline frame with a plus mark on each corner lists seven Spillguard findings as rows: the secret type, the file path in mono, a severity word and whether the secret is still valid (Verified, Unverified or False positive). Picking one shows where it leaked, as the commit, who committed it and the day, with the value redacted to its first four characters, and then the remediation as five steps with a checkbox each: revoke the key, issue a new one, update the deployment, purge it from git history and tell the owner. A progress bar counts the steps, and the purge command sits in a code box with a Copy Button. The foot's Shine Button opens an Alert Dialog that says to rotate in your provider and then ticks the first two steps. It's built from Alert Dialog, Copy Button, Shine Button and Guides. For engineering teams and security reviews.
FAQ
How do I fill it with my findings?
Edit LEAKS: the secret type, the path, the severity, whether it is still valid, the commit, who committed it, the day and only the first four characters of the value as prefix. The rest of the value is never typed here and is drawn as dots. STEPS holds the five remediation steps and PURGE the command.
How are the steps remembered?
Each finding has its own set of ticked steps, kept for the page, so you can go back to a finding and find it where you left it. The progress bar and the count beside the heading read from the ticks, and the status line says how many are done for the picked finding.
What does Revoke and rotate do?
It asks first, because the real action belongs in your provider. Confirming ticks the revoke and issue steps for the picked finding on this page and says that nothing was revoked. Cancelling leaves the steps as they were and puts focus back on the button.
What stays local, and how do I wire it for real?
Everything. No secret is stored or checked, the ticks live in the page, and the copy button only puts the purge command on your clipboard. To make it real, load findings from your scanner, call your provider's revoke and rotate endpoints from the confirm, and have the steps tick themselves when the matching check passes.