Exponential backoff with useRef

ItzCrazyKns · Aug 1, 2024 · 963be36 · 963be36
1 parent 84821d2
commit 963be36
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/ui/components/ChatWindow.tsx b/ui/components/ChatWindow.tsx
@@ -28,6 +28,8 @@ const useSocket = (
   hasError: boolean
 ) => {
   const [ws, setWs] = useState<WebSocket | null>(null);
+  const reconnectTimeout = useRef(0);
+  const reconnectAttempts = useRef(0);
 
   useEffect(() => {
     if (!ws) {
@@ -182,6 +184,8 @@ const useSocket = (
 
         ws.onopen = () => {
           console.log('[DEBUG] open');
+	  reconnectTimeout.current = 0;
+	  reconnectAttempts.current = 0;
           clearTimeout(timeoutId);
           setError(false);
           setIsWSReady(true);
@@ -195,7 +199,7 @@ const useSocket = (
 
         ws.onclose = () => {
           clearTimeout(timeoutId);
-          if (!hasError) {
+          if (!hasError && reconnectAttempts <) {
             setWs(null); // forces websocket to reopen when needed.
           }
           console.log('[DEBUG] closed');
@@ -211,7 +215,15 @@ const useSocket = (
         setWs(ws);
       };
 
-      connectWs();
+      if (reconnectAttempts.current < 3) {
+	console.log(`[DEBUG] Attempting to reconnect (${reconnectAttempts.current + 1}/3)`);
+	setTimeout(connectWs, reconnectTimeout.current);
+	reconnectTimeout.current = reconnectTimeout.current > 0 ? reconnectTimeout.current * 2 : 1000;
+	reconnectAttempts.current += 1;
+      } else {
+	console.log('[DEBUG] WebSocket reconnect failure after 3 retries');
+	setError(true);
+      }
     }
 
     return () => {