From fe4cb4d4056cae05eccc67142340098612647075 Mon Sep 17 00:00:00 2001
From: Lukas Mertens <git@lukas-mertens.de>
Date: Sat, 16 Mar 2024 15:41:38 +0100
Subject: [PATCH] feat(login): possibility to switch between instances

closes #53

Signed-off-by: Lukas Mertens <git@lukas-mertens.de>

commit-id:21677a2f
---
 src/modules/evbc/client.ts     | 17 ++++++++++++++---
 src/modules/evbc/connection.ts | 14 +++++++++++++-
 src/pages/LoginPage.vue        |  3 +++
 src/pages/MainPanel.vue        | 16 ++++++++++------
 4 files changed, 40 insertions(+), 10 deletions(-)

diff --git a/src/modules/evbc/client.ts b/src/modules/evbc/client.ts
index bfc64e67..1b02e7a9 100644
--- a/src/modules/evbc/client.ts
+++ b/src/modules/evbc/client.ts
@@ -9,10 +9,10 @@ import {
   EverestModuleDefinitionList,
 } from ".";
 import EVConfigModel from "./config_model";
-import EVBackendConnection, { ConnectionStatus } from "./connection";
+import EVBackendConnection, {ConnectionStatus} from "./connection";
 
 type ConnectionStateEvent = {
-  type: "INFO" | "INITIALIZED" | "FAILED" | "RECONNECT";
+  type: "INFO" | "INITIALIZED" | "FAILED" | "RECONNECT" | "IDLE";
   text: string;
 };
 
@@ -40,9 +40,18 @@ class EVBackendClient {
   };
 
   connect(url: string) {
+    if (this._cxn) {
+      this._cxn._disconnect();
+    }
     this._cxn = new EVBackendConnection(url, (msg) => this._connection_state_listener(msg));
   }
 
+  disconnect(): void {
+    this._cxn._disconnect();
+    this.initialized = false;
+    this._cxn = null;
+  }
+
   on<K extends keyof ClientEventMap>(event_name: K, handler: EventHandler<ClientEventMap[K]>) {
     if (!(event_name in this._event_handler_map)) {
       this._event_handler_map[event_name] = [];
@@ -100,9 +109,11 @@ class EVBackendClient {
         event = { type: "INITIALIZED", text: "Successfully reconnected" };
       }
     } else if (status.type === "ERROR") {
-      event = { type: "FAILED", text: `Connection failed` };
+      event = {type: "FAILED", text: `Connection failed. Trying to reconnect.`};
     } else if (status.type === "CLOSED") {
       event = { type: "RECONNECT", text: "Trying to reconnect" };
+    } else if (status.type === "DISCONNECTED") {
+      event = {type: "IDLE", text: "Disconnected"};
     }
 
     if (event) {
diff --git a/src/modules/evbc/connection.ts b/src/modules/evbc/connection.ts
index 2b4c8b76..c217b90e 100644
--- a/src/modules/evbc/connection.ts
+++ b/src/modules/evbc/connection.ts
@@ -26,11 +26,16 @@ type ConnectionErrorStatus = {
   error: string;
 };
 
+type ConnectionDisconnectedStatus = {
+  type: "DISCONNECTED";
+}
+
 export type ConnectionStatus =
   | ConnectionOpenStatus
   | ConnectionOpenedStatus
   | ConnectionClosedStatus
-  | ConnectionErrorStatus;
+    | ConnectionErrorStatus
+    | ConnectionDisconnectedStatus;
 
 export type ConnectionStatusListener = (status: ConnectionStatus) => void;
 
@@ -70,6 +75,13 @@ class EVBackendConnection {
     this._socket.onclose = () => this._handle_socket_close();
   }
 
+  _disconnect() {
+    this._socket.close();
+    this._publish_connection_state({type: "DISCONNECTED"});
+    this._listener = () => {
+    };
+  }
+
   _issue_rpc_loopback(method: string /* params: unknown, notification: boolean */) {
     if (method === "get_modules") {
       return new Promise((resolve) => {
diff --git a/src/pages/LoginPage.vue b/src/pages/LoginPage.vue
index 2da9e13a..b1527154 100644
--- a/src/pages/LoginPage.vue
+++ b/src/pages/LoginPage.vue
@@ -300,6 +300,9 @@ export default defineComponent({
             connecting.value = false;
             error.active = true;
             error.status = ev.text;
+          } else if (ev.type === "IDLE") {
+            connecting.value = false;
+            connectionStatus.value = "";
           }
         });
       }
diff --git a/src/pages/MainPanel.vue b/src/pages/MainPanel.vue
index b998a836..7fd547e9 100644
--- a/src/pages/MainPanel.vue
+++ b/src/pages/MainPanel.vue
@@ -15,12 +15,9 @@
         <v-list-item to="config" append-icon="mdi-cog" link>
           <v-list-item-title>Config</v-list-item-title>
         </v-list-item>
-        <!--<v-list-item to="account" append-icon="mdi-account-multiple" link>
-          <v-list-item-title>Account</v-list-item-title>
-        </v-list-item>-->
-        <!--<v-list-item to="about" append-icon="mdi-ninja" link>
-          <v-list-item-title>Debug</v-list-item-title>
-        </v-list-item>-->
+        <v-list-item @click="changeInstance()" append-icon="mdi-image-filter-hdr" link>
+          <v-list-item-title>Change EVerest instance</v-list-item-title>
+        </v-list-item>
       </v-list>
       <v-list-item class="bottom-list d-flex flex-column">
         <span>Version {{ version }}</span>
@@ -70,9 +67,11 @@ import {defineComponent, inject} from "vue";
 import EVBackendClient from "@/modules/evbc/client";
 
 import {useMainStore} from "@/store/main";
+import {Router, useRouter} from "vue-router";
 
 let evbc: EVBackendClient;
 let mainStore: ReturnType<typeof useMainStore>;
+let router: Router;
 export default defineComponent({
   data: () => ({
     drawer: false,
@@ -92,10 +91,15 @@ export default defineComponent({
     close_snackbar() {
       mainStore.setSnackbarMessage(undefined);
     },
+    changeInstance() {
+      evbc.disconnect();
+      router.push("/login");
+    },
   },
   created() {
     mainStore = useMainStore()
     evbc = inject<EVBackendClient>("evbc");
+    router = useRouter();
     evbc.on("connection_state", (ev) => {
       this.evbc_status = ev.text;
       if (ev.type === "RECONNECT") {