Gemini Nexus Bot
a648f2a281
Backend fixes: - Fix totalTokens defaulting to 0 when API omits totalTokenCount (now computes prompt+completion) - Fix streaming metadata extraction: unwrap response wrapper in Anthropic/Gemini handlers - Fix Zod schemas: handle SQL SUM(null) with nullable().transform() - Add is_estimated column migration to token_usage table Frontend redesign: - Rewrite Usage page with area charts (nivo/line), horizontal bar model ranking - StatCard: add trend indicators (% vs previous period) and inline SVG sparklines - Premium color palette, prompt/completion ratio bar, top models mini-list - Live indicator with 15s auto-refresh Design system migration: - Standardize all components on Gemini Nexus tokens (rounded-xl, border-white/[0.06]) - Refine UI components, proxy tabs, cloud account list, provider groups
57 lines
2.0 KiB
TypeScript
57 lines
2.0 KiB
TypeScript
import * as React from 'react';
|
|
import * as TabsPrimitive from '@radix-ui/react-tabs';
|
|
import { cn } from '@/lib/utils';
|
|
|
|
const Tabs = TabsPrimitive.Root;
|
|
|
|
const TabsList = React.forwardRef<
|
|
React.ElementRef<typeof TabsPrimitive.List>,
|
|
React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
|
|
>(({ className, ...props }, ref) => (
|
|
<TabsPrimitive.List
|
|
ref={ref}
|
|
className={cn(
|
|
'bg-muted/40 text-muted-foreground inline-flex h-9 items-center justify-center rounded-lg p-1 border border-white/[0.04]',
|
|
className,
|
|
)}
|
|
{...props}
|
|
/>
|
|
));
|
|
TabsList.displayName = TabsPrimitive.List.displayName;
|
|
|
|
const TabsTrigger = React.forwardRef<
|
|
React.ElementRef<typeof TabsPrimitive.Trigger>,
|
|
React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
|
|
>(({ className, ...props }, ref) => (
|
|
<TabsPrimitive.Trigger
|
|
ref={ref}
|
|
className={cn(
|
|
'inline-flex items-center justify-center rounded-md px-3 py-1 text-[13px] font-medium whitespace-nowrap transition-all duration-200',
|
|
'text-muted-foreground hover:text-foreground',
|
|
'data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm data-[state=active]:border data-[state=active]:border-white/[0.08]',
|
|
'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/30',
|
|
'disabled:pointer-events-none disabled:opacity-50',
|
|
className,
|
|
)}
|
|
{...props}
|
|
/>
|
|
));
|
|
TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
|
|
|
|
const TabsContent = React.forwardRef<
|
|
React.ElementRef<typeof TabsPrimitive.Content>,
|
|
React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
|
|
>(({ className, ...props }, ref) => (
|
|
<TabsPrimitive.Content
|
|
ref={ref}
|
|
className={cn(
|
|
'mt-3 animate-in focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/30',
|
|
className,
|
|
)}
|
|
{...props}
|
|
/>
|
|
));
|
|
TabsContent.displayName = TabsPrimitive.Content.displayName;
|
|
|
|
export { Tabs, TabsList, TabsTrigger, TabsContent };
|