shadcn.io is not affiliated with official shadcn/ui
Key Rotation Dashboard Block for Vue
Eight secrets with an age bar against a 90-day rotation policy and the overshoot hatched, three counts, and a Rotate dialog that sets a grace period and adds the new key's row while marking the old one as revoking.
Installation
Overview
Rotate what has gone stale before it becomes a finding, with this key rotation panel for Vue with Ark UI. A hairline frame with a plus mark on each corner opens with three counts (within policy, due within 14 days, overdue) over a table of eight secrets, each with a masked prefix, the day it was made and a bar of its age to the 90-day policy line, the days beyond it hatched. Rotate opens a Dialog: the new key's prefix, a Native Select for how long the old key keeps working (not at all, 1 hour, 24 hours or 7 days, with the stop moment written out), a Switch to revoke it afterwards, and a Shine Button that rotates. The new key joins as a row under the old one, which reads "Revoking until 19 Oct, 09:30 UTC", "Revoked" or "Rotated, old key still active", and the counts follow. For secrets managers and security settings.
FAQ
How do I fill it with my keys?
Edit KEYS. A key has a name, a kind, a masked prefix, the day it was created and its standing. Ages count from the fixed AS_OF time, POLICY_DAYS is the rotation policy and the bar scale is SCALE_DAYS. The counts and the header are worked out from the same array.
How do I read the age bar?
The solid part is the age up to the policy, the thin vertical line is the policy day and the hatched part is how far past it the key is. The words under the bar say the same ("148 days, 58 days over the policy"), so nothing depends on the pattern.
What does the grace period do?
It is how long the old key keeps working after the new one is made, so servers can be moved over without an outage. The dialog writes the moment it stops from one fixed time. With the revoke switch off the old key stays in force and keeps counting as overdue until you revoke it.
What stays local, and how do I wire it for real?
No key is made or revoked: the new prefix is typed and the dialog's result only changes this page. To make it real, call your vault's rotate endpoint from the button, show the new secret once with a copy button, and store the old key's stop time from its response.