From e666f02b882c75a90cadc9644dfdb30314ea836a Mon Sep 17 00:00:00 2001
From: Yohan Boniface <yohanboniface@free.fr>
Date: Tue, 11 Feb 2025 12:26:29 +0100
Subject: [PATCH] feat(sync): display an alert when disconnected

fix #2500
cf #2235
---
 umap/static/umap/js/modules/sync/websocket.js | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/umap/static/umap/js/modules/sync/websocket.js b/umap/static/umap/js/modules/sync/websocket.js
index 5a18f880..1a304239 100644
--- a/umap/static/umap/js/modules/sync/websocket.js
+++ b/umap/static/umap/js/modules/sync/websocket.js
@@ -1,3 +1,6 @@
+import { uMapAlert as Alert } from '../../components/alerts/alert.js'
+import { translate } from '../i18n.js'
+
 const PONG_TIMEOUT = 5000
 const PING_INTERVAL = 30000
 const FIRST_CONNECTION_TIMEOUT = 2000
@@ -14,15 +17,20 @@ export class WebSocketTransport {
     }
     this.websocket.addEventListener('message', this.onMessage.bind(this))
     this.websocket.onclose = () => {
-      console.log('websocket closed')
+      console.debug('websocket closed')
       if (!this.receiver.closeRequested) {
-        console.log('Not requested, reconnecting...')
+        Alert.info(
+          translate(
+            'This map has enabled real-time synchronization with other users, but you are currently disconnected. We will try to reconnect in the background and reconcile with other users, but this feature is still experimental, and you might lose data. Have fun!'
+          )
+        )
+        console.debug('Not requested, reconnecting...')
         this.receiver.reconnect()
       }
     }
 
     this.websocket.onerror = (error) => {
-      console.log('WS ERROR', error)
+      console.debug('WS ERROR', error)
     }
 
     this.ensureOpen = setInterval(() => {
@@ -38,7 +46,7 @@ export class WebSocketTransport {
     // See https://making.close.com/posts/reliable-websockets/ for more details.
     this.pingInterval = setInterval(() => {
       if (this.websocket.readyState === WebSocket.OPEN) {
-        console.log('sending ping')
+        console.debug('sending ping')
         this.websocket.send('ping')
         this.pongReceived = false
         setTimeout(() => {
@@ -68,7 +76,7 @@ export class WebSocketTransport {
   }
 
   close() {
-    console.log('Closing')
+    console.debug('Closing')
     this.receiver.closeRequested = true
     this.websocket.close()
   }