[web] trigger post-offline sync result treatments (#35854)

* trigger `UnableToSyncModal` on refresh
* trigger `UnableToSyncModal` without refresh
* show success toast when offline edits sync
* always show out of sync modal as the final backup

GitOrigin-RevId: 3ed300fef9e6d2ff81e17868309f80ffa40e0576

services/web/frontend/js/features/ide-react/components/connection-restored-toast.tsx

@@ -0,0 +1,34 @@
+import { useTranslation } from 'react-i18next'
+import { GlobalToastGeneratorEntry } from '@/features/ide-react/components/global-toasts'
+
+const CONNECTION_RESTORED_TOAST_HANDLE = 'connection-restored'
+
+const ConnectionRestoredToastContent = () => {
+  const { t } = useTranslation()
+  return <span>{t('youre_back_online')}</span>
+}
+
+const generators: GlobalToastGeneratorEntry[] = [
+  {
+    key: 'connection-restored',
+    generator: () => ({
+      content: <ConnectionRestoredToastContent />,
+      type: 'success',
+      autoHide: true,
+      delay: 5000,
+    }),
+  },
+]
+
+export default generators
+
+export const showConnectionRestoredToast = () => {
+  window.dispatchEvent(
+    new CustomEvent('ide:show-toast', {
+      detail: {
+        key: 'connection-restored',
+        handle: CONNECTION_RESTORED_TOAST_HANDLE,
+      },
+    })
+  )
+}

services/web/frontend/js/features/ide-react/components/global-toasts.tsx

@@ -7,6 +7,7 @@ import importOverleafModules from '../../../../macros/import-overleaf-module.mac
 import { OLToastContainer } from '@/shared/components/ol/ol-toast-container'
 import clipboardToastGenerators from '@/features/source-editor/components/clipboard-toasts'
 import exportDocumentToastGenerators from '@/features/ide-react/components/toolbar/export-document-toasts'
+import connectionRestoredToastGenerators from '@/features/ide-react/components/connection-restored-toast'
 
 const moduleGeneratorsImport = importOverleafModules('toastGenerators') as {
   import: { default: GlobalToastGeneratorEntry[] }
@@ -29,6 +30,7 @@ const GENERATOR_LIST: GlobalToastGeneratorEntry[] = [
   ...moduleGenerators.flat(),
   ...clipboardToastGenerators,
   ...exportDocumentToastGenerators,
+  ...connectionRestoredToastGenerators,
 ]
 const GENERATOR_MAP: Map<string, GlobalToastGenerator> = new Map(
   GENERATOR_LIST.map(({ key, generator }) => [key, generator])