0.16.0 Pre-Release Checks

frontend/src/hooks/useWebSocket.js

@@ -16,8 +16,44 @@ export function useWebSocket({ onMessage }) {
   useEffect(() => {
     let socket;
     let reconnectTimer;
+    let progressFlushTimer = null;
+    let progressFlushRaf = null;
+    let latestProgressMessage = null;
     let isUnmounted = false;
 
+    const clearProgressFlush = () => {
+      if (progressFlushRaf !== null && typeof window !== 'undefined' && typeof window.cancelAnimationFrame === 'function') {
+        window.cancelAnimationFrame(progressFlushRaf);
+      }
+      if (progressFlushTimer) {
+        clearTimeout(progressFlushTimer);
+      }
+      progressFlushRaf = null;
+      progressFlushTimer = null;
+    };
+
+    const flushProgressMessage = () => {
+      progressFlushRaf = null;
+      progressFlushTimer = null;
+      const message = latestProgressMessage;
+      latestProgressMessage = null;
+      if (!message) {
+        return;
+      }
+      onMessageRef.current?.(message);
+    };
+
+    const scheduleProgressFlush = () => {
+      if (progressFlushRaf !== null || progressFlushTimer) {
+        return;
+      }
+      if (typeof window !== 'undefined' && typeof window.requestAnimationFrame === 'function') {
+        progressFlushRaf = window.requestAnimationFrame(flushProgressMessage);
+        return;
+      }
+      progressFlushTimer = setTimeout(flushProgressMessage, 16);
+    };
+
     const connect = () => {
       if (isUnmounted) {
         return;
@@ -28,6 +64,11 @@ export function useWebSocket({ onMessage }) {
       socket.onmessage = (event) => {
         try {
           const message = JSON.parse(event.data);
+          if (message?.type === 'PIPELINE_PROGRESS') {
+            latestProgressMessage = message;
+            scheduleProgressFlush();
+            return;
+          }
           onMessageRef.current?.(message);
         } catch (error) {
           // ignore invalid json
@@ -51,6 +92,7 @@ export function useWebSocket({ onMessage }) {
 
     return () => {
       isUnmounted = true;
+      clearProgressFlush();
       if (reconnectTimer) {
         clearTimeout(reconnectTimer);
       }