diff --git a/src/components/usage/ModelStatsCard.tsx b/src/components/usage/ModelStatsCard.tsx
index 71ad330..cfa34dc 100644
--- a/src/components/usage/ModelStatsCard.tsx
+++ b/src/components/usage/ModelStatsCard.tsx
@@ -1,17 +1,15 @@
import { useState, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { Card } from '@/components/ui/Card';
-import { formatCompactNumber, formatUsd } from '@/utils/usage';
+import {
+ formatCompactNumber,
+ formatDurationMs,
+ formatUsd,
+ type ModelStatsSummary,
+} from '@/utils/usage';
import styles from '@/pages/UsagePage.module.scss';
-export interface ModelStat {
- model: string;
- requests: number;
- successCount: number;
- failureCount: number;
- tokens: number;
- cost: number;
-}
+export type ModelStat = ModelStatsSummary;
export interface ModelStatsCardProps {
modelStats: ModelStat[];
@@ -19,7 +17,14 @@ export interface ModelStatsCardProps {
hasPrices: boolean;
}
-type SortKey = 'model' | 'requests' | 'tokens' | 'cost' | 'successRate';
+type SortKey =
+ | 'model'
+ | 'requests'
+ | 'tokens'
+ | 'cost'
+ | 'successRate'
+ | 'averageLatencyMs'
+ | 'totalLatencyMs';
type SortDir = 'asc' | 'desc';
interface ModelStatWithRate extends ModelStat {
@@ -48,7 +53,15 @@ export function ModelStatsCard({ modelStats, loading, hasPrices }: ModelStatsCar
const dir = sortDir === 'asc' ? 1 : -1;
list.sort((a, b) => {
if (sortKey === 'model') return dir * a.model.localeCompare(b.model);
- return dir * ((a[sortKey] as number) - (b[sortKey] as number));
+ const left = a[sortKey];
+ const right = b[sortKey];
+ const leftValid = typeof left === 'number' && Number.isFinite(left);
+ const rightValid = typeof right === 'number' && Number.isFinite(right);
+
+ if (!leftValid && !rightValid) return 0;
+ if (!leftValid) return 1;
+ if (!rightValid) return -1;
+ return dir * (left - right);
});
return list;
}, [modelStats, sortKey, sortDir]);
@@ -95,6 +108,27 @@ export function ModelStatsCard({ modelStats, loading, hasPrices }: ModelStatsCar
{t('usage_stats.tokens_count')}{arrow('tokens')}
+
+
+ |
+
+
+ |
|