feat(analytics): add formatDurationMs function for improved duration formatting

client/src/routes/Analytics.tsx

@@ -1,6 +1,7 @@
 import { Show, createMemo, createResource, createSignal, type Component } from 'solid-js';
 import { api } from '../api/client';
 import { Layout } from '../components/Layout';
+import { formatDurationMs } from '../ui/lib/format';
 import {
   BoxPlotChart,
   ChartLegend,
@@ -142,7 +143,7 @@ export const Analytics: Component = () => {
     return [
       { label: 'Requests', value: formatInteger.format(totals.requests), hint: `Last ${days()} days` },
       { label: 'Tokens', value: formatInteger.format(totals.tokens), hint: `Selected ${days()}-day window total` },
-      { label: 'Avg Response', value: `${avgLatency.toFixed(1)}ms`, hint: 'Across visible backend series' },
+      { label: 'Avg Response', value: formatDurationMs(avgLatency), hint: 'Across visible backend series' },
       { label: 'Errors', value: formatInteger.format(errorCount), hint: 'Absolute backend error count' },
     ];
   });
@@ -252,8 +253,8 @@ export const Analytics: Component = () => {
               showLegend={false}
               hiddenKeys={hiddenResponseSeries()}
               onToggleLegend={(key) => toggleHiddenKey(setHiddenResponseSeries, key)}
-              yLeftLabel="Milliseconds"
+              yLeftLabel="Response time"
-              formatLeftValue={(value) => `${value.toFixed(0)}ms`}
+              formatLeftValue={formatDurationMs}
               tooltipTitle="Average backend response time"
             />
           </Panel>

client/src/routes/Dashboard.tsx

@@ -2,6 +2,7 @@ import RefreshCcw from 'lucide-solid/icons/refresh-ccw';
 import { Show, createMemo, createResource, createSignal, type Component } from 'solid-js';
 import { api } from '../api/client';
 import { Layout } from '../components/Layout';
+import { formatDurationMs } from '../ui/lib/format';
 import {
   ChartLegend,
   ComboChart,
@@ -248,8 +249,8 @@ export const Dashboard: Component = () => {
                 showLegend={false}
                 hiddenKeys={hiddenLatencySeries()}
                 onToggleLegend={(key) => toggleHiddenKey(setHiddenLatencySeries, key)}
-                yLeftLabel="Milliseconds"
+                yLeftLabel="Latency"
-                formatLeftValue={(value) => `${value.toFixed(0)}ms`}
+                formatLeftValue={formatDurationMs}
                 tooltipTitle="Backend latency"
               />
             </Panel>

client/src/ui/lib/format.ts

@@ -0,0 +1,21 @@
+const durationFormatters = {
+  seconds: new Intl.NumberFormat('en-US', { maximumFractionDigits: 1 }),
+  minutes: new Intl.NumberFormat('en-US', { maximumFractionDigits: 1 }),
+};
+
+export function formatDurationMs(value: number): string {
+  if (!Number.isFinite(value)) {
+    return '0ms';
+  }
+
+  const absoluteValue = Math.abs(value);
+  if (absoluteValue < 1000) {
+    return `${Math.round(value)}ms`;
+  }
+
+  if (absoluteValue < 60_000) {
+    return `${durationFormatters.seconds.format(value / 1000)}s`;
+  }
+
+  return `${durationFormatters.minutes.format(value / 60_000)}m`;
+}