fix(logs): live duration shows ∅ for in-flight requests on page refresh (#434)

## Problem

The live duration calculator in the Logs page showed **Duration: ∅** for
in-flight requests after a page refresh, even though it worked correctly
for requests arriving via the SSE event stream.

## Root Cause

Two issues compounded:

1. **Backend**: The REST API response coerced `durationMs: null` → `0`
via `?? 0` in `usage-storage.ts`. The DB correctly stores `null` for
pending requests, but the API response lost that signal.

2. **Frontend**: The live duration check used `log.durationMs != null`
to decide whether to use the stored value or compute live. When
`durationMs` was `0` (from the backend coercion), `0 != null` is `true`,
so `formatMs(0)` was called — which returns `'∅'`.

This only manifested on page refresh (REST API path). For SSE-arrived
requests, `durationMs` was `undefined` (not in the partial record), so
`!= null` correctly fell through to the live calculation.

## Changes

- **Backend** (`usage-storage.ts`): Stop coercing `durationMs` null→0 in
REST API response; let `null` flow through
- **Frontend** (`api.ts`): Change `durationMs` type from `number` to
`number | null` to reflect reality
- **Frontend** (`Logs.tsx`): Use `!= null && > 0` guard so both `null`
and `0` fall through to `Date.now() - startTime`
- **Frontend** (`useModels.ts`, `useProviderForm.tsx`): Add null guards
on `reduce` calls for the new nullable type

Author: mcowger

packages/backend/src/services/usage-storage.ts

@@ -654,7 +654,7 @@ export class UsageStorageService extends EventEmitter {
         costSource: row.costSource,
         costMetadata: row.costMetadata,
         startTime: row.startTime,
-        durationMs: row.durationMs ?? 0,
+        durationMs: row.durationMs,
         isStreamed: !!row.isStreamed,
         responseStatus: row.responseStatus ?? '',
         ttftMs: row.ttftMs,

packages/frontend/src/hooks/useModels.ts

@@ -169,7 +169,7 @@ export const useModels = () => {
 
       const allSuccess = results.every((r) => r.success);
       const firstError = results.find((r) => !r.success);
-      const totalDuration = results.reduce((sum, r) => sum + r.durationMs, 0);
+      const totalDuration = results.reduce((sum, r) => sum + (r.durationMs || 0), 0);
       const avgDuration = Math.round(totalDuration / results.length);
 
       setTestStates((prev) => ({

packages/frontend/src/hooks/useProviderForm.tsx

@@ -384,7 +384,7 @@ export function useProviderForm() {
       );
       const allSuccess = results.every((r) => r.success);
       const firstError = results.find((r) => !r.success);
-      const totalDuration = results.reduce((sum, r) => sum + r.durationMs, 0);
+      const totalDuration = results.reduce((sum, r) => sum + (r.durationMs || 0), 0);
       const avgDuration = Math.round(totalDuration / results.length);
       setTestStates((prev) => ({
         ...prev,

packages/frontend/src/lib/api.ts

@@ -461,7 +461,7 @@ export interface UsageRecord {
   costSource?: string;
   costMetadata?: string;
   startTime: number;
-  durationMs: number;
+  durationMs: number | null;
   isStreamed: boolean;
   responseStatus: string;
   ttftMs?: number;
@@ -2241,7 +2241,7 @@ export const api = {
   ): Promise<{
     success: boolean;
     error?: string;
-    durationMs: number;
+    durationMs: number | null;
     response?: string;
     apiType?: string;
   }> => {

packages/frontend/src/pages/Logs.tsx

@@ -654,7 +654,9 @@ export const Logs = () => {
                                   ? progressMapRef.current.get(log.requestId)
                                   : undefined;
                               const liveDuration = formatMs(
-                                log.durationMs != null ? log.durationMs : Date.now() - log.startTime
+                                log.durationMs != null && log.durationMs > 0
+                                  ? log.durationMs
+                                  : Date.now() - log.startTime
                               );
                               if (progress) {
                                 return (
@@ -1240,7 +1242,9 @@ export const Logs = () => {
                               ? progressMapRef.current.get(log.requestId)
                               : undefined;
                           const liveDuration = formatMs(
-                            log.durationMs != null ? log.durationMs : Date.now() - log.startTime
+                            log.durationMs != null && log.durationMs > 0
+                              ? log.durationMs
+                              : Date.now() - log.startTime
                           );
                           if (progress) {
                             return (