Reconnection Logic (#2743)

* reconnection logic

* prettier state.js

---------

Co-authored-by: Masen Furer <m_github@0x26.net>

reflex/.templates/web/utils/state.js

@@ -325,6 +325,17 @@ export const connect = async (
     autoUnref: false,
   });
 
+  function checkVisibility() {
+    if (document.visibilityState === "visible") {
+      if (!socket.current.connected) {
+        console.log("Socket is disconnected, attempting to reconnect ");
+        socket.current.connect();
+      } else {
+        console.log("Socket is reconnected ");
+      }
+    }
+  }
+
   // Once the socket is open, hydrate the page.
   socket.current.on("connect", () => {
     setConnectErrors([]);
@@ -345,6 +356,8 @@ export const connect = async (
       queueEvents(update.events, socket);
     }
   });
+
+  document.addEventListener("visibilitychange", checkVisibility);
 };
 
 /**