Spaces:
Running
Running
| import { useEffect, useRef, useState, useCallback } from "react"; | |
| import { wsUrl } from "../utils/api"; | |
| export default function useSimState() { | |
| const [snapshot, setSnapshot] = useState(null); | |
| const wsRef = useRef(null); | |
| const reconnectTimer = useRef(null); | |
| const disposedRef = useRef(false); | |
| const connect = useCallback(() => { | |
| if (disposedRef.current) return; | |
| clearTimeout(reconnectTimer.current); | |
| const url = wsUrl("/ws/sim"); | |
| const ws = new WebSocket(url); | |
| ws.onmessage = (e) => { | |
| try { | |
| const data = JSON.parse(e.data); | |
| setSnapshot(data); | |
| } catch { /* ignore parse errors */ } | |
| }; | |
| ws.onclose = () => { | |
| // Closing a socket during React cleanup is intentional. Reconnecting in | |
| // that case creates an orphan connection after the view has unmounted. | |
| if (disposedRef.current || wsRef.current !== ws) return; | |
| reconnectTimer.current = setTimeout(connect, 3000); | |
| }; | |
| ws.onerror = () => ws.close(); | |
| wsRef.current = ws; | |
| }, []); | |
| useEffect(() => { | |
| disposedRef.current = false; | |
| connect(); | |
| return () => { | |
| clearTimeout(reconnectTimer.current); | |
| disposedRef.current = true; | |
| const ws = wsRef.current; | |
| wsRef.current = null; | |
| if (ws) { | |
| ws.onclose = null; | |
| ws.close(); | |
| } | |
| }; | |
| }, [connect]); | |
| return snapshot; | |
| } | |