fix(studio): use warning tokens for previously used JWT signing key badge (#45460)

## Summary
- Replaces invalid Tailwind purple classes on the "previously used" JWT
key badge with the design system's warning tokens, matching the
bg-*-200/text-*-600/border-*-500 pattern used by the in_use and revoked
variants
- text-purple-1200 didn't exist (Tailwind purple scale stops at 950) and
the design system has no purple palette, which is why the badge rendered
with off-theme default Tailwind purple

Resolves
[FE-3128](https://linear.app/supabase/issue/FE-3128/fix-previous-key-button-color-in-jwt-rotation-modal)

## Test plan
- [x] Open the Rotate JWT signing key modal — "Previous key" badge
should match the warning palette and visually fit alongside
Standby/Current
- [x] JWT signing keys table row with status `previously_used` renders
with the same warning styling

## Example 
<img width="426" height="570" alt="image"
src="https://github.com/user-attachments/assets/34baca2b-48c0-4cd3-b997-d5c029182ad4"
/>
This commit is contained in:
Ali Waseem authored and GitHub committed 2026-05-01 14:18:17 +00:00
1 parent 5bfbae22a9
commit 50ccd39b31
1 file changed
+1 -1
@@ -12,7 +12,7 @@ export const statusLabels: Record<JWTSigningKey['status'], string> = {
export const statusColors: Record<JWTSigningKey['status'], string> = {
standby: 'bg-surface-300 text-foreground border border-foreground-muted',
in_use: 'bg-brand-200 text-brand-600 border-brand-500',
previously_used: 'bg-purple-300 dark:bg-purple-100 text-purple-1200 border-purple-800',
previously_used: 'bg-warning-200 text-warning-600 border-warning-500',
revoked: 'bg-destructive-200 text-destructive-600 border-destructive-500',
}