From 521571c4ca31d4346731f9703a0e53dcd9c104da Mon Sep 17 00:00:00 2001
From: Jason <farion1231@gmail.com>
Date: Thu, 9 Apr 2026 15:19:51 +0800
Subject: [PATCH] fix(usage): only show CLI subscription quota for active
 provider

CLI-credential-based subscriptions (Claude/Codex/Gemini) read from a
single global credential file, so the quota always reflects the last
CLI login rather than a specific provider. Showing it on non-current
cards is misleading when multiple official subscriptions exist.

Apply the same isCurrent + autoQuery pattern already used by Copilot
and Codex OAuth: only query and render the quota footer when the
provider is the currently active one.
---
 src/components/SubscriptionQuotaFooter.tsx |  6 +++++-
 src/components/providers/ProviderCard.tsx  |  2 +-
 src/lib/query/subscription.ts              | 11 ++++++++---
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/components/SubscriptionQuotaFooter.tsx b/src/components/SubscriptionQuotaFooter.tsx
index e345b58f9..fce6ea09e 100644
--- a/src/components/SubscriptionQuotaFooter.tsx
+++ b/src/components/SubscriptionQuotaFooter.tsx
@@ -8,6 +8,7 @@ import type { QuotaTier, SubscriptionQuota } from "@/types/subscription";
 interface SubscriptionQuotaFooterProps {
   appId: AppId;
   inline?: boolean;
+  isCurrent?: boolean;
 }
 
 interface SubscriptionQuotaViewProps {
@@ -386,12 +387,15 @@ const TierBar: React.FC<{
 const SubscriptionQuotaFooter: React.FC<SubscriptionQuotaFooterProps> = ({
   appId,
   inline = false,
+  isCurrent = false,
 }) => {
   const {
     data: quota,
     isFetching: loading,
     refetch,
-  } = useSubscriptionQuota(appId, true);
+  } = useSubscriptionQuota(appId, isCurrent, isCurrent);
+
+  if (!isCurrent) return null;
 
   return (
     <SubscriptionQuotaView
diff --git a/src/components/providers/ProviderCard.tsx b/src/components/providers/ProviderCard.tsx
index 3ceb78968..3f999937d 100644
--- a/src/components/providers/ProviderCard.tsx
+++ b/src/components/providers/ProviderCard.tsx
@@ -369,7 +369,7 @@ export function ProviderCard({
                   isCurrent={isCurrent}
                 />
               ) : isOfficial ? (
-                <SubscriptionQuotaFooter appId={appId} inline={true} />
+                <SubscriptionQuotaFooter appId={appId} inline={true} isCurrent={isCurrent} />
               ) : hasMultiplePlans ? (
                 <div className="flex items-center gap-2 text-xs text-gray-600 dark:text-gray-400">
                   <span className="font-medium">
diff --git a/src/lib/query/subscription.ts b/src/lib/query/subscription.ts
index 71248e7f6..f79dd1d6b 100644
--- a/src/lib/query/subscription.ts
+++ b/src/lib/query/subscription.ts
@@ -7,13 +7,18 @@ import { PROVIDER_TYPES } from "@/config/constants";
 
 const REFETCH_INTERVAL = 5 * 60 * 1000; // 5 minutes
 
-export function useSubscriptionQuota(appId: AppId, enabled: boolean) {
+export function useSubscriptionQuota(
+  appId: AppId,
+  enabled: boolean,
+  autoQuery = false,
+) {
   return useQuery({
     queryKey: ["subscription", "quota", appId],
     queryFn: () => subscriptionApi.getQuota(appId),
     enabled: enabled && ["claude", "codex", "gemini"].includes(appId),
-    refetchInterval: REFETCH_INTERVAL,
-    refetchOnWindowFocus: true,
+    refetchInterval: autoQuery ? REFETCH_INTERVAL : false,
+    refetchIntervalInBackground: autoQuery,
+    refetchOnWindowFocus: autoQuery,
     staleTime: REFETCH_INTERVAL,
     retry: 1,
   });