From 50ccd39b318331e45dcd0b4d144801dcc0e26e47 Mon Sep 17 00:00:00 2001 From: Ali Waseem Date: Fri, 1 May 2026 08:18:17 -0600 Subject: [PATCH] fix(studio): use warning tokens for previously used JWT signing key badge (#45460) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## 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 image --- apps/studio/components/interfaces/JwtSecrets/jwt.constants.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/studio/components/interfaces/JwtSecrets/jwt.constants.ts b/apps/studio/components/interfaces/JwtSecrets/jwt.constants.ts index 6d4c4a46116..ea7724a5895 100644 --- a/apps/studio/components/interfaces/JwtSecrets/jwt.constants.ts +++ b/apps/studio/components/interfaces/JwtSecrets/jwt.constants.ts @@ -12,7 +12,7 @@ export const statusLabels: Record = { export const statusColors: Record = { 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', }