Make UI language, timestamps and live feedback consistent

src/lib/ui/components/CapacitySamples.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+    import RelativeTime from '$ui/components/RelativeTime.svelte';
     import type { CapacitySamplePage } from '$lib/hosts.js';
     import Button from './primitives/Button.svelte';
 
@@ -54,7 +55,7 @@
                     <table><caption>CPU and memory peaks per container and minute; times are local.</caption>
                         <thead><tr><th scope="col">Time</th>{#if scope === 'fleet'}<th scope="col">Host</th>{/if}<th scope="col">Server</th><th scope="col">Phase</th><th scope="col">CPU cores</th><th scope="col">Memory</th></tr></thead>
                         <tbody>{#each result.samples as sample}
-                            <tr><td><time datetime={sample.timestamp}>{new Date(sample.timestamp).toLocaleString()}</time></td>
+                            <tr><td><RelativeTime value={sample.timestamp} /></td>
                                 {#if scope === 'fleet'}<td>{sample.hostName ?? sample.hostId}</td>{/if}
                                 <td>{sample.server ?? sample.instanceId}<small title={sample.instanceId}>Generation {sample.generation}</small></td>
                                 <td>{sample.phase === 'startup' ? 'Starting' : 'Running'}</td><td>{sample.cpuCores.toFixed(3)}</td><td>{(sample.memoryBytes / 1048576).toFixed(1)} MiB</td></tr>