Initial commit mit MkDocs-Dokumentation

frontend/src/hooks/useWebSocket.js

@@ -0,0 +1,62 @@
+import { useEffect, useRef } from 'react';
+
+function buildWsUrl() {
+  if (import.meta.env.VITE_WS_URL) {
+    return import.meta.env.VITE_WS_URL;
+  }
+
+  const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+  return `${protocol}//${window.location.host}/ws`;
+}
+
+export function useWebSocket({ onMessage }) {
+  const onMessageRef = useRef(onMessage);
+  onMessageRef.current = onMessage;
+
+  useEffect(() => {
+    let socket;
+    let reconnectTimer;
+    let isUnmounted = false;
+
+    const connect = () => {
+      if (isUnmounted) {
+        return;
+      }
+
+      socket = new WebSocket(buildWsUrl());
+
+      socket.onmessage = (event) => {
+        try {
+          const message = JSON.parse(event.data);
+          onMessageRef.current?.(message);
+        } catch (error) {
+          // ignore invalid json
+        }
+      };
+
+      socket.onclose = () => {
+        if (!isUnmounted) {
+          reconnectTimer = setTimeout(connect, 1500);
+        }
+      };
+
+      socket.onerror = () => {
+        if (socket && socket.readyState !== WebSocket.CLOSED) {
+          socket.close();
+        }
+      };
+    };
+
+    connect();
+
+    return () => {
+      isUnmounted = true;
+      if (reconnectTimer) {
+        clearTimeout(reconnectTimer);
+      }
+      if (socket && socket.readyState !== WebSocket.CLOSED) {
+        socket.close();
+      }
+    };
+  }, []);
+}