From 62f08de540ce08bb1dea4f9feb2d19d2140e31f3 Mon Sep 17 00:00:00 2001
From: Xiangzhe <32761048+xz-dev@users.noreply.github.com>
Date: Tue, 2 Jun 2026 16:14:23 +0800
Subject: [PATCH] fix(home): pass providerId to quota widget icons (#3064)

Co-authored-by: xz-dev <xz-dev@users.noreply.github.com>
---
 .../(dashboard)/home/ProviderQuotaWidget.tsx  | 13 ++++++++---
 .../provider-quota-widget-icon-prop.test.ts   | 22 +++++++++++++++++++
 2 files changed, 32 insertions(+), 3 deletions(-)
 create mode 100644 tests/unit/provider-quota-widget-icon-prop.test.ts

diff --git a/src/app/(dashboard)/home/ProviderQuotaWidget.tsx b/src/app/(dashboard)/home/ProviderQuotaWidget.tsx
index eb267fafdb..41cd067db2 100644
--- a/src/app/(dashboard)/home/ProviderQuotaWidget.tsx
+++ b/src/app/(dashboard)/home/ProviderQuotaWidget.tsx
@@ -175,7 +175,11 @@ export default function ProviderQuotaWidget({ autoRefreshInterval = 0 }: Provide
           onClick={refreshAll}
           disabled={refreshingAll || loading}
           className="flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-border bg-bg-subtle text-xs font-medium text-text-main disabled:opacity-50 disabled:cursor-not-allowed hover:bg-surface transition-colors"
-          title={autoRefreshIntervalMs > 0 ? tr("autoRefreshing", "Auto-refreshing") : tr("refreshAll", "Refresh All")}
+          title={
+            autoRefreshIntervalMs > 0
+              ? tr("autoRefreshing", "Auto-refreshing")
+              : tr("refreshAll", "Refresh All")
+          }
         >
           <span
             className={`material-symbols-outlined text-[16px] ${refreshingAll ? "animate-spin" : ""}`}
@@ -187,7 +191,10 @@ export default function ProviderQuotaWidget({ autoRefreshInterval = 0 }: Provide
               ? tr("refreshing", "Refreshing")
               : autoRefreshIntervalMs > 0
                 ? `${tr("autoRefreshing", "Auto-refreshing")} ${formatAutoRefreshCountdown(
-                    Math.max(0, autoRefreshIntervalMs - (autoRefreshClock - lastRefreshAllAtRef.current))
+                    Math.max(
+                      0,
+                      autoRefreshIntervalMs - (autoRefreshClock - lastRefreshAllAtRef.current)
+                    )
                   )}`
                 : tr("refreshAll", "Refresh All")}
           </span>
@@ -224,7 +231,7 @@ export default function ProviderQuotaWidget({ autoRefreshInterval = 0 }: Provide
                   className="rounded-lg border border-border bg-surface/40 p-3 flex flex-col gap-2"
                 >
                   <div className="flex items-center gap-2">
-                    <ProviderIcon provider={provider} size={18} />
+                    <ProviderIcon providerId={provider} size={18} />
                     <span className="font-medium text-sm truncate">
                       {provider.charAt(0).toUpperCase() + provider.slice(1)}
                     </span>
diff --git a/tests/unit/provider-quota-widget-icon-prop.test.ts b/tests/unit/provider-quota-widget-icon-prop.test.ts
new file mode 100644
index 0000000000..be3e4af6b5
--- /dev/null
+++ b/tests/unit/provider-quota-widget-icon-prop.test.ts
@@ -0,0 +1,22 @@
+import test from "node:test";
+import assert from "node:assert/strict";
+import { readFileSync } from "node:fs";
+import { dirname, join } from "node:path";
+import { fileURLToPath } from "node:url";
+
+const ROOT = join(dirname(fileURLToPath(import.meta.url)), "..", "..");
+const PROVIDER_QUOTA_WIDGET_PATH = join(ROOT, "src/app/(dashboard)/home/ProviderQuotaWidget.tsx");
+
+const providerQuotaWidgetSrc = readFileSync(PROVIDER_QUOTA_WIDGET_PATH, "utf8");
+
+test("ProviderQuotaWidget passes provider IDs using ProviderIcon's providerId prop", () => {
+  assert.ok(
+    providerQuotaWidgetSrc.includes("<ProviderIcon providerId={provider} size={18} />"),
+    "ProviderQuotaWidget must pass provider through ProviderIcon's providerId prop"
+  );
+  assert.equal(
+    providerQuotaWidgetSrc.includes("<ProviderIcon provider={provider}"),
+    false,
+    "ProviderQuotaWidget must not pass an unsupported provider prop to ProviderIcon"
+  );
+});