25 lines
1.2 KiB
Svelte
25 lines
1.2 KiB
Svelte
<script lang="ts">
|
|
import { timeFormat } from '$ui/stores/time-zone.js';
|
|
import { telemetryByServer, uiNow } from '$ui/stores/servers.js';
|
|
import { freshStatusTimestamp } from '$lib/server-freshness.js';
|
|
import { elapsedSince } from '$ui/duration.js';
|
|
import type { GameTelemetry } from '$lib/telemetry.js';
|
|
let { name, since = null, report: observation }: { name: string; since?: string | null; report?: GameTelemetry } = $props();
|
|
let report = $derived(observation ?? $telemetryByServer.get(name));
|
|
let fresh = $derived(report && freshStatusTimestamp(report.receivedAt, $uiNow)
|
|
&& (!since || Date.parse(report.receivedAt) >= Date.parse(since)));
|
|
</script>
|
|
|
|
{#if report && (report.event === 'round_change' || report.event === 'heartbeat') && fresh}
|
|
<div class="round" aria-live="polite">
|
|
<strong>Round {report.round}</strong>
|
|
<span title={$timeFormat.dateTime(report.receivedAt)}>Last reported {elapsedSince(report.receivedAt, $uiNow)} ago</span>
|
|
</div>
|
|
{/if}
|
|
|
|
<style>
|
|
.round { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); }
|
|
strong { color: var(--text-primary); font-family: var(--font-mono); }
|
|
span { color: var(--text-tertiary); font-size: var(--text-xs); }
|
|
</style>
|