From 8ec3e66f42df8e6c031cec0fec13cf6d2b032304 Mon Sep 17 00:00:00 2001
From: Knut Ahlers <knut@ahlers.me>
Date: Sat, 13 Jul 2024 13:21:59 +0200
Subject: [PATCH] Hook botauth against events

in order to update frontend info when backend changes

Signed-off-by: Knut Ahlers <knut@ahlers.me>
---
 .eslintrc.js               |  2 +-
 src/components/botauth.vue | 28 +++++++++++++++++++++++++++-
 2 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 137eb2f..e353152 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -86,7 +86,7 @@ module.exports = {
     'keyword-spacing': ['error'],
     'linebreak-style': ['error', 'unix'],
     'lines-between-class-members': ['error'],
-    'multiline-comment-style': ['warn'],
+    'multiline-comment-style': ['off'],
     'newline-per-chained-call': ['error'],
     'no-alert': ['error'],
     'no-console': ['off'],
diff --git a/src/components/botauth.vue b/src/components/botauth.vue
index 003deb0..d8325c1 100644
--- a/src/components/botauth.vue
+++ b/src/components/botauth.vue
@@ -60,6 +60,7 @@
 
 
 <script lang="ts">
+import BusEventTypes from '../helpers/busevents'
 import { defineComponent } from 'vue'
 
 export default defineComponent({
@@ -72,6 +73,10 @@ export default defineComponent({
   },
 
   methods: {
+    /**
+     * Copies auth-url for the bot into clipboard and gives user feedback
+     * by colorizing copy-button for a short moment
+     */
     copyAuthURL(): void {
       navigator.clipboard.writeText(this.authURLs.update_bot_token)
         .then(() => {
@@ -81,6 +86,9 @@ export default defineComponent({
         })
     },
 
+    /**
+     * Fetches auth-URLs from the backend
+     */
     fetchAuthURLs(): Promise<void> | undefined {
       return this.$root?.fetchJSON('config-editor/auth-urls')
         .then((data: any) => {
@@ -88,6 +96,12 @@ export default defineComponent({
         })
     },
 
+    /**
+     * Fetches the bot profile (including display-name and profile
+     * image) and stores it locally
+     *
+     * @param user Login-name of the user to fetch the profile for
+     */
     fetchBotProfile(user: string): Promise<void> | undefined {
       return this.$root?.fetchJSON(`config-editor/user?user=${user}`)
         .then((data: any) => {
@@ -95,18 +109,30 @@ export default defineComponent({
         })
     },
 
+    /**
+     * Fetches the general config object from the backend including the
+     * authorized bot-name
+     */
     fetchGeneralConfig(): Promise<void> | undefined {
       return this.$root?.fetchJSON('config-editor/general')
         .then((data: any) => {
           this.generalConfig = data
         })
+        .then(() => this.fetchBotProfile(this.generalConfig.bot_name))
     },
   },
 
   mounted() {
+    // Reload config after it changed
+    this.bus.on(BusEventTypes.ConfigReload, () => this.fetchGeneralConfig())
+
+    // Socket-reconnect could mean we need new auth-urls as the state
+    // may have changed due to bot-restart
+    this.bus.on(BusEventTypes.NotifySocketConnected, () => this.fetchAuthURLs())
+
+    // Do initial fetches
     this.fetchAuthURLs()
     this.fetchGeneralConfig()
-      ?.then(() => this.fetchBotProfile(this.generalConfig.bot_name))
   },
 
   name: 'TwitchBotEditorBotAuth',