474 websocket add a snack bar to notify the user on websocket status changes (#483)

* [#474] added snackbar for websocket status

* [#474 & #447] added ping to complete browser online/offline status

* [#447] ping timeout as an env var

src/locales/en.json

@@ -299,6 +299,13 @@
     "endDate": "End Date",
     "endTime": "End Time"
   },
+  "websocket": {
+    "browserOnline": "You’re back online. Reconnecting live updates…",
+    "browserOffline": "You’re offline. Live updates are paused until the connection is restored.",
+    "reconnected": "Live updates are back.",
+    "error": "There was a problem with live updates: %{error}",
+    "closedUnexpectedly": "Live updates were interrupted. Trying to reconnect…"
+  },
   "months": {
     "standalone": {
       "0": "January",

src/locales/fr.json

@@ -300,6 +300,13 @@
     "endDate": "Date de la fin",
     "endTime": "Heure de la fin"
   },
+  "websocket": {
+    "browserOnline": "Vous êtes de nouveau en ligne. Reconnexion des mises à jour en temps réel…",
+    "browserOffline": "Vous êtes hors ligne. Les mises à jour en temps réel sont mises en pause jusqu’au rétablissement de la connexion.",
+    "reconnected": "Les mises à jour en temps réel sont de nouveau actives.",
+    "error": "Un problème est survenu avec les mises à jour en temps réel : %{error}",
+    "closedUnexpectedly": "Les mises à jour en temps réel ont été interrompues. Tentative de reconnexion…"
+  },
   "months": {
     "standalone": {
       "0": "Janvier",

src/locales/ru.json

@@ -300,6 +300,13 @@
     "endDate": "Дата окончания",
     "endTime": "Время окончания"
   },
+  "websocket": {
+    "browserOnline": "Вы снова в сети. Подключаем обновления в реальном времени…",
+    "browserOffline": "Вы не в сети. Обновления в реальном времени приостановлены до восстановления соединения.",
+    "reconnected": "Обновления в реальном времени снова работают.",
+    "error": "Произошла ошибка в обновлениях в реальном времени: %{error}",
+    "closedUnexpectedly": "Обновления в реальном времени были прерваны. Пробуем переподключиться…"
+  },
   "months": {
     "standalone": {
       "0": "Январь",

src/locales/vi.json

@@ -298,6 +298,13 @@
     "endDate": "Ngày kết thúc",
     "endTime": "Giờ kết thúc"
   },
+  "websocket": {
+    "browserOnline": "Bạn đã trực tuyến trở lại. Đang kết nối lại cập nhật thời gian thực…",
+    "browserOffline": "Bạn đang ngoại tuyến. Cập nhật thời gian thực sẽ tạm dừng cho đến khi kết nối được khôi phục.",
+    "reconnected": "Cập nhật thời gian thực đã hoạt động trở lại.",
+    "error": "Đã xảy ra sự cố với cập nhật thời gian thực: %{error}",
+    "closedUnexpectedly": "Cập nhật thời gian thực đã bị gián đoạn. Đang thử kết nối lại…"
+  },
   "months": {
     "standalone": {
       "0": "Tháng 1",