From b9b80ed79a7edbd9e9421cb507944bf5a361ed8a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miroslav=20=C5=A0ediv=C3=BD?= <sedivy.miro@gmail.com>
Date: Sat, 17 Jul 2021 19:18:21 +0200
Subject: [PATCH] show reconnecting notify. #48

---
 client/src/locale/en-us.ts |  1 +
 client/src/locale/es-sp.ts |  2 ++
 client/src/locale/fr-fr.ts |  2 ++
 client/src/locale/nb-no.ts |  2 ++
 client/src/locale/sk-sk.ts |  1 +
 client/src/locale/sv-se.ts |  2 ++
 client/src/neko/base.ts    |  4 ++++
 client/src/neko/events.ts  |  1 +
 client/src/neko/index.ts   | 16 +++++++++++++++-
 9 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/client/src/locale/en-us.ts b/client/src/locale/en-us.ts
index 2c99a0e1..f730b1f2 100644
--- a/client/src/locale/en-us.ts
+++ b/client/src/locale/en-us.ts
@@ -69,6 +69,7 @@ export const setting = {
 
 export const connection = {
   logged_out: 'You have been logged out.',
+  reconnecting: 'Reconnecting...',
   connected: 'Connected',
   disconnected: 'Disconnected',
   button_confirm: 'OK',
diff --git a/client/src/locale/es-sp.ts b/client/src/locale/es-sp.ts
index 89733917..caac021c 100644
--- a/client/src/locale/es-sp.ts
+++ b/client/src/locale/es-sp.ts
@@ -69,6 +69,8 @@ export const setting = {
 
 export const connection = {
   logged_out: 'Has salido!',
+  // TODO
+  //reconnecting: 'Reconnecting',
   connected: 'Connectado correctamente',
   disconnected: 'Has sido desconectado',
   button_confirm: 'De acuerdo',
diff --git a/client/src/locale/fr-fr.ts b/client/src/locale/fr-fr.ts
index 11846e6a..4acd46e1 100644
--- a/client/src/locale/fr-fr.ts
+++ b/client/src/locale/fr-fr.ts
@@ -69,6 +69,8 @@ export const setting = {
 
 export const connection = {
   logged_out: 'Vous avez été déconnecté.',
+  // TODO
+  //reconnecting: 'Reconnecting',
   connected: 'Connecté',
   disconnected: 'Déconnecté',
   button_confirm: 'OK',
diff --git a/client/src/locale/nb-no.ts b/client/src/locale/nb-no.ts
index 03a31333..f7d47bc5 100644
--- a/client/src/locale/nb-no.ts
+++ b/client/src/locale/nb-no.ts
@@ -69,6 +69,8 @@ export const setting = {
 
 export const connection = {
   logged_out: 'Du har blitt utlogget.',
+  // TODO
+  //reconnecting: 'Reconnecting',
   connected: 'Tilkoblet',
   disconnected: 'Frakoblet',
   button_confirm: 'OK',
diff --git a/client/src/locale/sk-sk.ts b/client/src/locale/sk-sk.ts
index c18501f3..7cd559e3 100644
--- a/client/src/locale/sk-sk.ts
+++ b/client/src/locale/sk-sk.ts
@@ -69,6 +69,7 @@ export const setting = {
 
 export const connection = {
   logged_out: 'Boli ste odhlásený/á',
+  reconnecting: 'Obnova spojenia...',
   connected: 'Úspešne pripojený/á',
   disconnected: 'Boli ste odpojený/á',
   button_confirm: 'Ok',
diff --git a/client/src/locale/sv-se.ts b/client/src/locale/sv-se.ts
index f217a46c..0c08a154 100644
--- a/client/src/locale/sv-se.ts
+++ b/client/src/locale/sv-se.ts
@@ -69,6 +69,8 @@ export const setting = {
 
 export const connection = {
   logged_out: 'Du har blivit utloggad!',
+  // TODO
+  //reconnecting: 'Reconnecting',
   connected: 'Du har loggats in',
   disconnected: 'Du har blivit frånkopplad',
   button_confirm: 'Ok',
diff --git a/client/src/neko/base.ts b/client/src/neko/base.ts
index 5a9d0428..e477b531 100644
--- a/client/src/neko/base.ts
+++ b/client/src/neko/base.ts
@@ -230,6 +230,9 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
         case 'connected':
           this.onConnected()
           break
+        case 'disconnected':
+          this[EVENT.RECONNECTING]()
+          break
         // https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Signaling_and_video_calling#ice_connection_state
         // We don't watch the disconnected signaling state here as it can indicate temporary issues and may
         // go back to a connected state after some time. Watching it would close the video call on any temporary
@@ -358,6 +361,7 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
     this.emit('warn', `unhandled websocket event '${event}':`, payload)
   }
 
+  protected abstract [EVENT.RECONNECTING](): void
   protected abstract [EVENT.CONNECTING](): void
   protected abstract [EVENT.CONNECTED](): void
   protected abstract [EVENT.DISCONNECTED](reason?: Error): void
diff --git a/client/src/neko/events.ts b/client/src/neko/events.ts
index 7b785225..39eac429 100644
--- a/client/src/neko/events.ts
+++ b/client/src/neko/events.ts
@@ -1,5 +1,6 @@
 export const EVENT = {
   // Internal Events
+  RECONNECTING: 'RECONNECTING',
   CONNECTING: 'CONNECTING',
   CONNECTED: 'CONNECTED',
   DISCONNECTED: 'DISCONNECTED',
diff --git a/client/src/neko/index.ts b/client/src/neko/index.ts
index ad9dc491..545d4fe3 100644
--- a/client/src/neko/index.ts
+++ b/client/src/neko/index.ts
@@ -70,6 +70,16 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
   /////////////////////////////
   // Internal Events
   /////////////////////////////
+  protected [EVENT.RECONNECTING]() {
+    this.$vue.$notify({
+      group: 'neko',
+      type: 'warning',
+      title: this.$vue.$t('connection.reconnecting') as string,
+      duration: 5000,
+      speed: 1000,
+    })
+  }
+
   protected [EVENT.CONNECTING]() {
     this.$accessor.setConnnecting()
   }
@@ -77,7 +87,11 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
   protected [EVENT.CONNECTED]() {
     this.$accessor.user.setMember(this.id)
     this.$accessor.setConnected(true)
-    this.$accessor.setConnected(true)
+
+    this.$vue.$notify({
+      group: 'neko',
+      clean: true,
+    })
 
     this.$vue.$notify({
       group: 'neko',