[web] add external 15s heartbeat to socket.io connection (#22853)

* [web] add external 15s heartbeat to socket.io connection

* [web] extend debugging context for client errors

- include performance.now() timestamp for correlating other timings
- include connectionState, especially for new externalHeartbeat detail
- include spellCheckLanguage to check on client-side spelling impact

* [web] remove unnecessary hook dependency

Co-authored-by: Alf Eaton <alf.eaton@overleaf.com>

* Refactor externalHeartbeat

* Add connectionManager to context

* Clear the interval earlier, and on connect

* [web] refactor handling of socket debugging info

* [web] add split-test for external socket heartbeat

* [web] fully remove connectionManager from connection context

---------

Co-authored-by: Alf Eaton <alf.eaton@overleaf.com>
GitOrigin-RevId: fbebe64f8aa207eb4fd4a8f27d522d1cac35f9d4

services/web/frontend/js/features/ide-react/context/ide-react-context.tsx

@@ -100,7 +100,7 @@ export const IdeReactProvider: FC = ({ children }) => {
   // been called
   const [projectJoined, setProjectJoined] = useState(false)
 
-  const { socket } = useConnectionContext()
+  const { socket, getSocketDebuggingInfo } = useConnectionContext()
 
   const reportError = useCallback(
     (error: any, meta?: Record<string, any>) => {
@@ -108,11 +108,12 @@ export const IdeReactProvider: FC = ({ children }) => {
         ...meta,
         user_id: getMeta('ol-user_id'),
         project_id: projectId,
-        client_id: socket.socket?.sessionid,
-        transport: socket.socket?.transport?.name,
         client_now: new Date(),
+        performance_now: performance.now(),
         release,
         client_load: LOADED_AT,
+        spellCheckLanguage: scopeStore.get('project.spellCheckLanguage'),
+        ...getSocketDebuggingInfo(),
       }
 
       const errorObj: Record<string, any> = {}
@@ -130,7 +131,7 @@ export const IdeReactProvider: FC = ({ children }) => {
         },
       })
     },
-    [socket.socket, release, projectId]
+    [release, projectId, getSocketDebuggingInfo, scopeStore]
   )
 
   // Populate scope values when joining project, then fire project:joined event