diff --git a/ui/src/components/monitoring/proxy-status-widget.tsx b/ui/src/components/monitoring/proxy-status-widget.tsx index 31c69a23..c6dd5dc2 100644 --- a/ui/src/components/monitoring/proxy-status-widget.tsx +++ b/ui/src/components/monitoring/proxy-status-widget.tsx @@ -46,7 +46,7 @@ import { AlertDialogTitle, } from '@/components/ui/alert-dialog'; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'; -import { useQuery } from '@tanstack/react-query'; +import { useQuery, useIsMutating } from '@tanstack/react-query'; import { api, type CliproxyServerConfig } from '@/lib/api-client'; import { useProxyStatus, @@ -167,6 +167,9 @@ export function ProxyStatusWidget() { staleTime: 30000, // 30 seconds }); + // Detect if backend switch is in progress (prevents race condition) + const isBackendSwitching = useIsMutating({ mutationKey: ['update-backend'] }) > 0; + // Determine if remote mode is enabled const remoteConfig = cliproxyConfig?.remote; const isRemoteMode = remoteConfig?.enabled && remoteConfig?.host; @@ -176,7 +179,8 @@ export function ProxyStatusWidget() { startProxy.isPending || stopProxy.isPending || restartProxy.isPending || - installVersion.isPending; + installVersion.isPending || + isBackendSwitching; const hasUpdate = updateCheck?.hasUpdate ?? false; const isUnstable = updateCheck?.isStable === false; const currentVersion = updateCheck?.currentVersion; diff --git a/ui/src/hooks/use-cliproxy.ts b/ui/src/hooks/use-cliproxy.ts index 6f6e6d18..493fe6ea 100644 --- a/ui/src/hooks/use-cliproxy.ts +++ b/ui/src/hooks/use-cliproxy.ts @@ -349,6 +349,7 @@ export function useUpdateBackend() { const queryClient = useQueryClient(); return useMutation({ + mutationKey: ['update-backend'], // Used by ProxyStatusWidget to detect backend switching mutationFn: ({ backend, force = false }: { backend: 'original' | 'plus'; force?: boolean }) => api.cliproxyServer.updateBackend(backend, force), onSuccess: () => { @@ -378,8 +379,8 @@ export function useCliproxyVersions() { return useQuery({ queryKey: ['cliproxy-versions'], queryFn: () => api.cliproxy.versions(), - staleTime: 60 * 60 * 1000, // 1 hour (matches backend cache) - refetchOnWindowFocus: false, + staleTime: 5 * 60 * 1000, // 5 minutes (reduced for faster backend switch response) + refetchOnWindowFocus: true, // Refetch on focus to catch backend changes }); }