Add event when the connection lost modal is shown for users who have internet, but doc saves aren't successful (#25960)

* adding naive event send for case where realtime is disconnected, but user has internet connection for events

* using reportError and moving ops length summation to getUnsavedOpsSize

GitOrigin-RevId: 7c1c8e31ddbaa21fbc299703c69cf07ab46df925

services/web/frontend/js/features/ide-react/components/unsaved-docs/unsaved-docs-locked-alert.tsx

@@ -1,9 +1,21 @@
-import { FC } from 'react'
+import { FC, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
+import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 
 export const UnsavedDocsLockedAlert: FC = () => {
   const { t } = useTranslation()
+  const { openDocs } = useEditorManagerContext()
+  const { reportError } = useIdeReactContext()
+
+  useEffect(() => {
+    const { pendingOpsLength, inflightOpsLength } = openDocs.getUnsavedOpsSize()
+    reportError('connection-lost-with-unsaved-changes', {
+      pendingOpsLength,
+      inflightOpsLength,
+    })
+  }, [reportError, openDocs])
 
   return (
     <OLNotification

services/web/frontend/js/features/ide-react/editor/open-documents.ts

@@ -41,6 +41,22 @@ export class OpenDocuments {
     return this.openDocs.get(docId)
   }
 
+  getUnsavedOpsSize() {
+    const docs = this.unsavedDocs()
+    let pendingOpsLength = 0
+    let inflightOpsLength = 0
+    for (const doc of docs) {
+      const pendingOp = doc.getPendingOp()
+      const inFlightOp = doc.getInflightOp()
+      pendingOpsLength += pendingOp?.length || 0
+      inflightOpsLength += inFlightOp?.length || 0
+    }
+    return {
+      pendingOpsLength,
+      inflightOpsLength,
+    }
+  }
+
   private createDoc(docId: string) {
     const doc = new DocumentContainer(
       docId,