From 03020941bb519ac39e43d1f014be8b19d207381c Mon Sep 17 00:00:00 2001
From: Stefan Dej <meteyou@gmail.com>
Date: Sat, 26 Oct 2024 21:58:37 +0200
Subject: [PATCH] feat: Add link to the Docs for Unauthorized connections
 (#2035)

---
 src/components/TheConnectingDialog.vue | 13 ++++++++++++-
 src/locales/de.json                    |  1 +
 src/locales/en.json                    |  1 +
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/components/TheConnectingDialog.vue b/src/components/TheConnectingDialog.vue
index 68bff8c66..0ee067331 100644
--- a/src/components/TheConnectingDialog.vue
+++ b/src/components/TheConnectingDialog.vue
@@ -18,6 +18,10 @@
                     <v-divider class="mt-4 mb-5" />
                 </template>
                 <div class="text-center mt-3">
+                    <v-btn v-if="helpButtonUrl" class="text--disabled mr-3" :href="helpButtonUrl" target="_blank">
+                        <v-icon left>{{ mdiHelp }}</v-icon>
+                        {{ $t('ConnectionDialog.Help') }}
+                    </v-btn>
                     <v-btn class="primary--text" @click="reconnect">{{ $t('ConnectionDialog.TryAgain') }}</v-btn>
                 </div>
             </v-card-text>
@@ -35,7 +39,7 @@ import BaseMixin from '@/components/mixins/base'
 
 import ThemeMixin from '@/components/mixins/theme'
 import ConnectionStatus from '@/components/ui/ConnectionStatus.vue'
-import { mdiConnection } from '@mdi/js'
+import { mdiConnection, mdiHelp } from '@mdi/js'
 
 @Component({
     components: {
@@ -44,6 +48,7 @@ import { mdiConnection } from '@mdi/js'
 })
 export default class TheConnectingDialog extends Mixins(BaseMixin, ThemeMixin) {
     mdiConnection = mdiConnection
+    mdiHelp = mdiHelp
 
     counter = 0
 
@@ -89,6 +94,12 @@ export default class TheConnectingDialog extends Mixins(BaseMixin, ThemeMixin) {
         return this.$store.state.socket.connectionFailedMessage ?? null
     }
 
+    get helpButtonUrl() {
+        if (!this.$store.state.socket.connectionFailedMessage) return null
+
+        return `https://docs.mainsail.xyz/faq/mainsail_errors/connection-${this.connectionFailedMessage?.toLowerCase()}`
+    }
+
     reconnect() {
         this.counter++
         this.$store.dispatch('socket/setData', { connectingFailed: false })
diff --git a/src/locales/de.json b/src/locales/de.json
index bc4ac382c..6369e0dab 100644
--- a/src/locales/de.json
+++ b/src/locales/de.json
@@ -155,6 +155,7 @@
         "CheckMoonrakerLog": "Wenn diese Meldung wiederholt erscheint, schaue bitte in die Logdatei unter:",
         "Connecting": "Verbinde zu {host}",
         "Failed": "Verbindung fehlgeschlagen",
+        "Help": "Hilfe",
         "Initializing": "Initialisieren",
         "TryAgain": "Erneut versuchen"
     },
diff --git a/src/locales/en.json b/src/locales/en.json
index d12f4e76e..6b0505e25 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -156,6 +156,7 @@
         "Connecting": "Connecting to {host}",
         "ErrorMessage": "Error message: {message}",
         "Failed": "Connection failed",
+        "Help": "Help",
         "Initializing": "Initializing",
         "TryAgain": "try again"
     },