Write a run's elapsed time once, in the duration formatter's units

The runs table drew when a run started and how long it took in two
notations ('56m ago | 55.5 min'), and for a run still going those are the
same reading twice. `dur` now steps past the minute into hours and days,
the ago reading is derived from it, and a running run writes only the
elapsed one.

frontend/src/components/Runs/RunsScreen.tsx

@@ -6,7 +6,6 @@ import { useRef } from "react"
 import type { fluksio__api__routes__runs__RunRow as RunRow } from "@/client"
 import { MAX_SERIES } from "@/components/Common/UplotChart"
 import { ValuePreview } from "@/components/Flow/ValuePreview"
-import { ago } from "@/components/Health/queries"
 import { Button } from "@/components/ui/button"
 import { Checkbox } from "@/components/ui/checkbox"
 import {
@@ -296,6 +295,12 @@ function ParamValue({ value }: { value: unknown }) {
   return <span className="font-mono text-xs">{paramText(value)}</span>
 }
 
+/** How long ago a moment was, in `dur`'s units so a row's two times agree. */
+function since(ts: unknown): string {
+  if (!ts) return "—"
+  return `${dur(Date.now() - Date.parse(String(ts)))} ago`
+}
+
 function RunsTable({
   runs,
   search,
@@ -456,14 +461,20 @@ function RunsTable({
                   only the store's, which is then the whole answer. */}
               {shortCommit(run.origin_commit || run.commit || "") || "—"}
             </TableCell>
-            <TableCell className="whitespace-nowrap text-muted-foreground text-sm">
+            <TableCell className="whitespace-nowrap text-muted-foreground text-sm tabular-nums">
               {/* When it started, and how long it then took. Two readings of
-                  one thing, so one column rather than two. */}
-              {ago(String(run.created_at ?? ""))}
-              <span className="px-1.5 text-border">|</span>
-              <span className="tabular-nums">
-                {run.duration_ms ? dur(run.duration_ms) : "—"}
-              </span>
+                  one thing, so one column rather than two — and while a run is
+                  still going they are the same reading, so it is written once:
+                  how long it has been running is also how long ago it began. */}
+              {run.status === "running" ? (
+                `${dur(run.duration_ms)} ago`
+              ) : (
+                <>
+                  {since(run.created_at)}
+                  <span className="px-1.5 text-border">|</span>
+                  <span>{run.duration_ms ? dur(run.duration_ms) : "—"}</span>
+                </>
+              )}
             </TableCell>
           </TableRow>
         ))}