From aeea3fae9bf6deb01a90c71016a7361fb5532ed1 Mon Sep 17 00:00:00 2001
From: QuentinHsu <xuquentinyang@gmail.com>
Date: Mon, 15 Jun 2026 14:53:23 +0800
Subject: [PATCH] fix(keys): refresh API key form options (#5512)

- enable model and group queries only while the API key drawer is open and remove the five-minute stale window so the form uses fresh backend options.
- align the API key table group-ratio query key to avoid duplicate caches for the same group endpoint.
---
 .../src/features/keys/components/api-keys-columns.tsx       | 4 ++--
 .../src/features/keys/components/api-keys-mutate-drawer.tsx | 6 ++++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/web/default/src/features/keys/components/api-keys-columns.tsx b/web/default/src/features/keys/components/api-keys-columns.tsx
index 1955ddd2..6aa858a6 100644
--- a/web/default/src/features/keys/components/api-keys-columns.tsx
+++ b/web/default/src/features/keys/components/api-keys-columns.tsx
@@ -49,9 +49,9 @@ function getQuotaProgressColor(percentage: number): string {
 
 function useGroupRatios(): Record<string, number> {
   const { data } = useQuery({
-    queryKey: ['user-self-groups'],
+    queryKey: ['user-groups'],
     queryFn: getUserGroups,
-    staleTime: 5 * 60 * 1000,
+    staleTime: 0,
     select: (res) => {
       if (!res.success || !res.data) return {}
       const ratios: Record<string, number> = {}
diff --git a/web/default/src/features/keys/components/api-keys-mutate-drawer.tsx b/web/default/src/features/keys/components/api-keys-mutate-drawer.tsx
index 45b30fe8..9a9611ba 100644
--- a/web/default/src/features/keys/components/api-keys-mutate-drawer.tsx
+++ b/web/default/src/features/keys/components/api-keys-mutate-drawer.tsx
@@ -104,14 +104,16 @@ export function ApiKeysMutateDrawer({
   const { data: modelsData } = useQuery({
     queryKey: ['user-models'],
     queryFn: getUserModels,
-    staleTime: 5 * 60 * 1000, // Cache for 5 minutes
+    enabled: open,
+    staleTime: 0,
   })
 
   // Fetch groups
   const { data: groupsData } = useQuery({
     queryKey: ['user-groups'],
     queryFn: getUserGroups,
-    staleTime: 5 * 60 * 1000,
+    enabled: open,
+    staleTime: 0,
   })
 
   const models = modelsData?.data || []