feat(client): polished toolbar, live online count via SSE
CI / runtime-diagnostics (push) Skipped
CI / check (push) Successful in 28s
CI / release (push) Skipped
CI / deploy (push) Successful in 1m27s

- Redesign in-game client toolbar with refined glass styling and buttons
- Live online count + emulator status streamed over SSE multicast
- Who's-online tooltip throttled to reduce repeated requests
- Fix show button so it always returns the hidden toolbar
- Use theme CSS variables instead of hardcoded colors
- Add toolbar translations across all 25 locales
This commit is contained in:
openhands committed 2026-09-02 21:14:42 +02:00
1 parent e1ecb190bc
commit 67b67798b9
32 files changed
+799 -102

No files matched your search

+32
View File
@@ -0,0 +1,32 @@
"use client";
import { useEffect, useState } from "react";
import { AnimatedCounter } from "@/components/animated-counter";
import { useEventSource } from "@/lib/use-event-source";
/**
* Live animated online-count number. Subscribes to the SSE online-count stream
* so the stat updates in real-time (multicast) instead of only the initial SSR
* value, while keeping the entrance counter animation.
*/
export function LiveOnlineCounter({
initial,
suffix = "",
}: {
initial: number;
suffix?: string;
}) {
const [count, setCount] = useState(initial);
const { data: onlineStream } = useEventSource<{ count: number }>(
"/api/online/count/stream",
{ enabled: true },
);
useEffect(() => {
if (onlineStream && typeof onlineStream.count === "number") {
setCount(onlineStream.count);
}
}, [onlineStream]);
return <AnimatedCounter value={count} suffix={suffix} />;
}