WebSocket

function DemoWebSocket() {
    const [logs, setLogs] = useState([]);
    useEffect(() => {
        const addToLog = (msg) => {
            const copy = { ...msg, timestamp: new Date().toISOString() };
            console.log(copy);
            setLogs((prev) => [...prev, JSON.stringify(copy)]);
        };
        const ws = chronik.ws({
            onMessage: addToLog,
            onConnect: addToLog,
            onReconnect: addToLog,
            onError: addToLog,
            onEnd: addToLog,
        });
        ws.subscribeToBlocks();
        ws.subscribeToAddress(
            'ecash:qryzw7gteszy8jgsejjchlwjg7lctxpwjgllx92x9j',
        );
        void ws.waitForOpen();
        return () => {
            ws.close();
        };
    }, []);
    return (
        <div
            style={{
                maxHeight: 384,
                overflowY: 'auto',
                fontFamily: 'var(--font-fira-code), ui-monospace, monospace',
                fontSize: 12,
            }}
        >
            {logs.map((log, idx) => (
                <div
                    key={idx}
                    style={{
                        borderBottom: '1px solid rgba(255,255,255,0.08)',
                        padding: '4px 0',
                    }}
                >
                    {log}
                </div>
            ))}
        </div>
    );
}
render(<DemoWebSocket />);