diff --git a/apps/ui/src/components/claude-usage-popover.tsx b/apps/ui/src/components/claude-usage-popover.tsx
index fcff9320..84131e8d 100644
--- a/apps/ui/src/components/claude-usage-popover.tsx
+++ b/apps/ui/src/components/claude-usage-popover.tsx
@@ -123,7 +123,11 @@ export function ClaudeUsagePopover() {
isPrimary?: boolean;
stale?: boolean;
}) => {
- const status = getStatusInfo(percentage);
+ // Check if percentage is valid (not NaN, not undefined, is a finite number)
+ const isValidPercentage = typeof percentage === "number" && !isNaN(percentage) && isFinite(percentage);
+ const safePercentage = isValidPercentage ? percentage : 0;
+
+ const status = getStatusInfo(safePercentage);
const StatusIcon = status.icon;
return (
@@ -131,7 +135,7 @@ export function ClaudeUsagePopover() {
className={cn(
"rounded-xl border bg-card/50 p-4 transition-opacity",
isPrimary ? "border-border/60 shadow-sm" : "border-border/40",
- stale && "opacity-60"
+ (stale || !isValidPercentage) && "opacity-50"
)}
>
@@ -141,20 +145,24 @@ export function ClaudeUsagePopover() {
{subtitle}
-
-
-
- {Math.round(percentage)}%
-
-
+ {isValidPercentage ? (
+
+
+
+ {Math.round(safePercentage)}%
+
+
+ ) : (
+ N/A
+ )}
-
+
{resetText && (
@@ -267,8 +275,8 @@ export function ClaudeUsagePopover() {
diff --git a/apps/ui/src/lib/electron.ts b/apps/ui/src/lib/electron.ts
index 6baa67f6..5e01b492 100644
--- a/apps/ui/src/lib/electron.ts
+++ b/apps/ui/src/lib/electron.ts
@@ -898,9 +898,9 @@ const getMockElectronAPI = (): ElectronAPI => {
weeklyPercentage: 5,
weeklyResetTime: new Date(Date.now() + 86400000 * 2).toISOString(),
weeklyResetText: "Resets Dec 23",
- opusWeeklyTokensUsed: 0,
- opusWeeklyPercentage: 1,
- opusResetText: "Resets Dec 27",
+ sonnetWeeklyTokensUsed: 0,
+ sonnetWeeklyPercentage: 1,
+ sonnetResetText: "Resets Dec 27",
costUsed: null,
costLimit: null,
costCurrency: null,
diff --git a/apps/ui/src/store/app-store.ts b/apps/ui/src/store/app-store.ts
index 1601b1e8..365962c9 100644
--- a/apps/ui/src/store/app-store.ts
+++ b/apps/ui/src/store/app-store.ts
@@ -528,9 +528,9 @@ export interface ClaudeUsage {
weeklyResetTime: string;
weeklyResetText: string;
- opusWeeklyTokensUsed: number;
- opusWeeklyPercentage: number;
- opusResetText: string;
+ sonnetWeeklyTokensUsed: number;
+ sonnetWeeklyPercentage: number;
+ sonnetResetText: string;
costUsed: number | null;
costLimit: number | null;