29 lines
815 B
TypeScript
29 lines
815 B
TypeScript
import { useClock } from "../clock/clock";
|
|
import { formatSpan } from "../clock/timeFormat";
|
|
import { formatDuration } from "../format";
|
|
import { usePreferences } from "../state/preferences";
|
|
|
|
/**
|
|
* Live time remaining until `to` (server clock), in the player's countdown
|
|
* format (real, game or both; CR-011); shows `done` once it has passed.
|
|
* `format` styles the real-time part (e.g. mm:ss).
|
|
*/
|
|
export function Countdown({
|
|
to,
|
|
done = "Arriving…",
|
|
format = formatDuration,
|
|
}: {
|
|
to: number;
|
|
done?: string;
|
|
format?: (ms: number) => string;
|
|
}) {
|
|
const now = useClock((s) => s.now);
|
|
const mode = usePreferences((p) => p.countdown);
|
|
const remaining = to - now;
|
|
return (
|
|
<span className="tabular-nums">
|
|
{remaining > 0 ? formatSpan(remaining, mode, format) : done}
|
|
</span>
|
|
);
|
|
}
|