From 7bc7918cc6684d739ee662bfdde37cbcbbb27357 Mon Sep 17 00:00:00 2001 From: DhanushSantosh Date: Fri, 23 Jan 2026 17:49:53 +0530 Subject: [PATCH] fix: show session usage window on board usage button --- apps/ui/src/assets/icons/gemini-icon.svg | 1 + apps/ui/src/components/ui/provider-icon.tsx | 43 +++++++-------------- apps/ui/src/components/usage-popover.tsx | 14 ++++--- 3 files changed, 25 insertions(+), 33 deletions(-) create mode 100644 apps/ui/src/assets/icons/gemini-icon.svg diff --git a/apps/ui/src/assets/icons/gemini-icon.svg b/apps/ui/src/assets/icons/gemini-icon.svg new file mode 100644 index 00000000..38f56259 --- /dev/null +++ b/apps/ui/src/assets/icons/gemini-icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/apps/ui/src/components/ui/provider-icon.tsx b/apps/ui/src/components/ui/provider-icon.tsx index 752a1fa6..456a09c8 100644 --- a/apps/ui/src/components/ui/provider-icon.tsx +++ b/apps/ui/src/components/ui/provider-icon.tsx @@ -1,4 +1,4 @@ -import { useId, type ComponentType, type SVGProps } from 'react'; +import type { ComponentType, ImgHTMLAttributes, SVGProps } from 'react'; import { cn } from '@/lib/utils'; import type { AgentModel, ModelProvider } from '@automaker/types'; import { getProviderFromModel } from '@/lib/utils'; @@ -166,16 +166,14 @@ export function CursorIcon(props: Omit) { return ; } -const GEMINI_GRADIENT_STOPS = [ - { offset: '0%', color: '#4285F4' }, - { offset: '33%', color: '#EA4335' }, - { offset: '66%', color: '#FBBC04' }, - { offset: '100%', color: '#34A853' }, -] as const; +const GEMINI_ICON_URL = new URL('../../assets/icons/gemini-icon.svg', import.meta.url).toString(); +const GEMINI_ICON_ALT = 'Gemini'; -export function GeminiIcon({ title, className, ...props }: Omit) { - const definition = PROVIDER_ICON_DEFINITIONS[PROVIDER_ICON_KEYS.gemini]; - const gradientId = useId(); +type GeminiIconProps = Omit, 'src'> & { + title?: string; +}; + +export function GeminiIcon({ title, className, ...props }: GeminiIconProps) { const { role, 'aria-label': ariaLabel, @@ -184,30 +182,19 @@ export function GeminiIcon({ title, className, ...props }: Omit - {title && {title}} - - - {GEMINI_GRADIENT_STOPS.map((stop) => ( - - ))} - - - - + /> ); } diff --git a/apps/ui/src/components/usage-popover.tsx b/apps/ui/src/components/usage-popover.tsx index dc383a1f..126c7be6 100644 --- a/apps/ui/src/components/usage-popover.tsx +++ b/apps/ui/src/components/usage-popover.tsx @@ -27,6 +27,8 @@ type UsageError = { // Fixed refresh interval (45 seconds) const REFRESH_INTERVAL_SECONDS = 45; +const CLAUDE_SESSION_WINDOW_HOURS = 5; +const CLAUDE_SESSION_WINDOW_BADGE = `${CLAUDE_SESSION_WINDOW_HOURS}h`; // Helper to format reset time for Codex function formatCodexResetTime(unixTimestamp: number): string { @@ -226,9 +228,7 @@ export function UsagePopover() { }; // Calculate max percentage for header button - const claudeMaxPercentage = claudeUsage - ? Math.max(claudeUsage.sessionPercentage || 0, claudeUsage.weeklyPercentage || 0) - : 0; + const claudeSessionPercentage = claudeUsage?.sessionPercentage || 0; const codexMaxPercentage = codexUsage?.rateLimits ? Math.max( @@ -237,7 +237,6 @@ export function UsagePopover() { ) : 0; - const maxPercentage = Math.max(claudeMaxPercentage, codexMaxPercentage); const isStale = activeTab === 'claude' ? isClaudeStale : isCodexStale; const getProgressBarColor = (percentage: number) => { @@ -251,7 +250,7 @@ export function UsagePopover() { if (activeTab === 'claude') { return { icon: AnthropicIcon, - percentage: claudeMaxPercentage, + percentage: claudeSessionPercentage, isStale: isClaudeStale, }; } @@ -270,6 +269,11 @@ export function UsagePopover() {