From 703bd7de093351a7280303e7d80f10341b47ee24 Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 16:47:22 -0400
Subject: [PATCH 01/12] Log when saving debug fails due to empty reported
 filename

---
 backend/app/debug_info.go | 1 +
 1 file changed, 1 insertion(+)

diff --git a/backend/app/debug_info.go b/backend/app/debug_info.go
index bef87e94..fb5a8cfa 100644
--- a/backend/app/debug_info.go
+++ b/backend/app/debug_info.go
@@ -220,6 +220,7 @@ func (a *app) GenerateDebugInfo() bool {
 		return false
 	}
 	if filename == "" {
+		slog.Error("failed to save, filename was empty, the user might have cancelled the dialog")
 		return false
 	}
 

From 88b904a7b19834443f0b9b1e0782ceba193ea794 Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 17:05:23 -0400
Subject: [PATCH 02/12] Require the user to generate debug before opening the
 discord. Catch situations where generating debug logs fails.

---
 .../lib/components/modals/ErrorModal.svelte   | 73 +++++++++++++++----
 1 file changed, 57 insertions(+), 16 deletions(-)

diff --git a/frontend/src/lib/components/modals/ErrorModal.svelte b/frontend/src/lib/components/modals/ErrorModal.svelte
index c0776f19..9e95d0f7 100644
--- a/frontend/src/lib/components/modals/ErrorModal.svelte
+++ b/frontend/src/lib/components/modals/ErrorModal.svelte
@@ -1,13 +1,45 @@
 <script lang="ts">
-  import T, { translationElementPart } from '$lib/components/T.svelte';
-  import { GenerateDebugInfo } from '$wailsjs/go/app/app';
+  import T from "$lib/components/T.svelte";
+  import { BrowserOpenURL } from "$lib/generated/wailsjs/runtime/runtime";
+  import { GenerateDebugInfo } from "$wailsjs/go/app/app";
+  import { getTranslate } from "@tolgee/svelte";
 
   export let parent: { onClose: () => void };
 
+  let openDiscordTooltipText: string;
+  const { t } = getTranslate();
+  t.subscribe((getTranslationText) => {
+    openDiscordTooltipText = getTranslationText(
+      "error.open_modding_discord.must_generate_debug_first",
+      "You must generate debug info first",
+    );
+  });
+
+  let allowOpeningDiscord: boolean = false;
+
+  let onClickGenerateDebugInfo = async () => {
+    let didUserSaveFile = await GenerateDebugInfo();
+    if (didUserSaveFile) {
+      allowOpeningDiscord = true;
+      openDiscordTooltipText = "";
+    } else {
+      alert(
+        "Failed to generate and save the debug info file. Did you click the Cancel button? If not, manually check your Satisfactory Mod Manager log files for more information: https://docs.ficsit.app/satisfactory-modding/latest/faq.html#Files_Logs",
+      );
+    }
+  };
+
+  let OpenDiscord = () => {
+    BrowserOpenURL("https://discord.gg/xkVJ73E");
+  };
+
   export let error: string;
 </script>
 
-<div style="max-height: calc(100vh - 3rem); max-width: calc(100vw - 3rem);" class="w-[48rem] card flex flex-col gap-6">
+<div
+  style="max-height: calc(100vh - 3rem); max-width: calc(100vw - 3rem);"
+  class="w-[48rem] card flex flex-col gap-6"
+>
   <header class="card-header font-bold text-2xl text-center">
     <T defaultValue="Something went wrong" keyName="error.title" />
   </header>
@@ -16,25 +48,34 @@
   </section>
   <section class="px-4">
     <T
-      defaultValue="Seems wrong? Click the button below and send the generated zip file on the <1>modding discord</1> in #help-using-mods."
-      keyName="error.help"
-      parts={[
-        translationElementPart('a', {
-          href: 'https://discord.gg/xkVJ73E',
-          class: 'text-primary-600 underline',
-        }),
-      ]}
+      defaultValue="Seems wrong? Click the button below to gather logs, then send the generated zip file on the modding discord in #help-using-mods."
+      keyName="error.reporting_directions"
     />
   </section>
-  <footer class="card-footer">
+  <section class="px-4">
     <button
       class="btn text-primary-600 variant-ringed"
-      on:click={GenerateDebugInfo}>
-      <T defaultValue="Generate debug info" keyName="error.generate_debug_info" />
+      on:click={onClickGenerateDebugInfo}
+    >
+      <T
+        defaultValue="Generate debug info"
+        keyName="error.generate_debug_info"
+      />
     </button>
     <button
-      class="btn"
-      on:click={parent.onClose}>
+      class="btn text-primary-600 variant-ringed"
+      on:click={OpenDiscord}
+      disabled={!allowOpeningDiscord}
+      title={openDiscordTooltipText}
+    >
+      <T
+        defaultValue="Open the Modding Discord"
+        keyName="error.open_modding_discord"
+      />
+    </button>
+  </section>
+  <footer class="card-footer">
+    <button class="btn" on:click={parent.onClose}>
       <T defaultValue="Close" keyName="common.close" />
     </button>
   </footer>

From 9dacc1a20dbc7f7d1ae74e67ecbaea3d9542696c Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 17:05:32 -0400
Subject: [PATCH 03/12] Switch to new https://discord.ficsit.app/ link

---
 frontend/src/App.svelte                              | 2 +-
 frontend/src/lib/components/left-bar/LeftBar.svelte  | 2 +-
 frontend/src/lib/components/modals/ErrorModal.svelte | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index a4879080..cfafe788 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -249,7 +249,7 @@
                     keyName="error.help"
                     parts={[
                       translationElementPart('a', {
-                        href: 'https://discord.gg/xkVJ73E',
+                        href: 'https://discord.ficsit.app/',
                         class: 'text-primary-600 underline',
                       }),
                     ]}
diff --git a/frontend/src/lib/components/left-bar/LeftBar.svelte b/frontend/src/lib/components/left-bar/LeftBar.svelte
index fd15d804..c46efd46 100644
--- a/frontend/src/lib/components/left-bar/LeftBar.svelte
+++ b/frontend/src/lib/components/left-bar/LeftBar.svelte
@@ -378,7 +378,7 @@
       </button>
       <button
         class="btn w-full bg-surface-200-700-token px-4 h-8 text-sm"
-        on:click={() => BrowserOpenURL('https://discord.gg/xkVJ73E')}>
+        on:click={() => BrowserOpenURL('https://discord.ficsit.app/')}>
         <span>
           <T defaultValue="Satisfactory Modding Discord" keyName="left-bar.satisfactory-modding-discord"/>
         </span>
diff --git a/frontend/src/lib/components/modals/ErrorModal.svelte b/frontend/src/lib/components/modals/ErrorModal.svelte
index 9e95d0f7..42bf1fe7 100644
--- a/frontend/src/lib/components/modals/ErrorModal.svelte
+++ b/frontend/src/lib/components/modals/ErrorModal.svelte
@@ -30,7 +30,7 @@
   };
 
   let OpenDiscord = () => {
-    BrowserOpenURL("https://discord.gg/xkVJ73E");
+    BrowserOpenURL("https://discord.ficsit.app/");
   };
 
   export let error: string;

From 6f65f8a693326fea75860908def91769d3fa7e8b Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 17:58:32 -0400
Subject: [PATCH 04/12] Deduplicate error display code

---
 frontend/src/App.svelte                       | 43 +++------
 .../lib/components/modals/ErrorDetails.svelte | 87 +++++++++++++++++++
 .../lib/components/modals/ErrorModal.svelte   | 75 ++--------------
 3 files changed, 106 insertions(+), 99 deletions(-)
 create mode 100644 frontend/src/lib/components/modals/ErrorDetails.svelte

diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index cfafe788..17d64bdc 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -6,7 +6,7 @@
   import { DevTools, FormatSimple, Tolgee, TolgeeProvider } from '@tolgee/svelte';
   import { setContextClient } from '@urql/svelte';
 
-  import T, { translationElementPart } from '$lib/components/T.svelte';
+  import T from '$lib/components/T.svelte';
   import TitleBar from '$lib/components/TitleBar.svelte';
   import LeftBar from '$lib/components/left-bar/LeftBar.svelte';
   import ModDetails from '$lib/components/mod-details/ModDetails.svelte';
@@ -24,8 +24,9 @@
   import { error, expandedMod, siteURL } from '$lib/store/generalStore';
   import { konami, language, updateCheckMode } from '$lib/store/settingsStore';
   import { smmUpdate, smmUpdateReady } from '$lib/store/smmUpdateStore';
-  import { ExpandMod, GenerateDebugInfo, UnexpandMod } from '$wailsjs/go/app/app';
+  import { ExpandMod, UnexpandMod } from '$wailsjs/go/app/app';
   import { Environment, EventsOn } from '$wailsjs/runtime';
+  import ErrorDetails from '$lib/components/modals/ErrorDetails.svelte';
 
   initializeStores();
   initializeModalStore();
@@ -235,34 +236,18 @@
               focusOnEntry.focus();
             }}>
             <div class="card my-auto mr-4">
-              <header class="card-header font-bold text-2xl text-center">
-                {#if noInstallsError}
-                  <T defaultValue="No Satisfactory installs found" keyName="error.no_installs" />
-                {:else}
-                  <T defaultValue={'{invalidInstalls} invalid Satisfactory {invalidInstalls, plural, one {install} other {installs}} found'} keyName="error.invalid_installs" params={{ invalidInstalls: $invalidInstalls.length }} />
-                {/if}
-              </header>
-              <section class="p-4">
-                <p class="text-base text-center">
-                  <T
-                    defaultValue="Seems wrong? Click the button below and send the generated zip file on the <1>modding discord</1> in #help-using-mods."
-                    keyName="error.help"
-                    parts={[
-                      translationElementPart('a', {
-                        href: 'https://discord.ficsit.app/',
-                        class: 'text-primary-600 underline',
-                      }),
-                    ]}
+              <ErrorDetails
+                error={""}
+                parent={{onClose: () => {}}}
+                fullPageMode={true}
+              >
+                <!-- Svelte slots don't support dynamic passing, so this is kinda ugly. Switch to snippets once in svelte 5 https://github.com/sveltejs/svelte/issues/7651-->
+                <T slot="title"
+                  defaultValue={ noInstallsError ? "No Satisfactory installs found" : "{invalidInstalls} invalid Satisfactory {invalidInstalls, plural, one {install} other {installs}} found"}
+                  keyName={ noInstallsError ? "error.no_installs" : "error.invalid_installs"}
+                  params={{ invalidInstalls: $invalidInstalls.length }}
                   />
-                </p>
-              </section>
-              <footer class="card-footer">
-                <button
-                  class="btn text-primary-600 w-full"
-                  on:click={GenerateDebugInfo}>
-                  <T defaultValue="Generate debug info" keyName="error.generate_debug_info" />
-                </button>
-              </footer>
+              </ErrorDetails>
             </div>
           </ModsList>
         </div>
diff --git a/frontend/src/lib/components/modals/ErrorDetails.svelte b/frontend/src/lib/components/modals/ErrorDetails.svelte
new file mode 100644
index 00000000..339c417c
--- /dev/null
+++ b/frontend/src/lib/components/modals/ErrorDetails.svelte
@@ -0,0 +1,87 @@
+<script lang="ts">
+  import T from "$lib/components/T.svelte";
+  import { BrowserOpenURL } from "$lib/generated/wailsjs/runtime/runtime";
+  import { GenerateDebugInfo } from "$wailsjs/go/app/app";
+  import { getTranslate } from "@tolgee/svelte";
+
+  export let parent: { onClose: () => void };
+
+  export let fullPageMode: boolean = false;
+  let sectionClass: string = fullPageMode ? "p-4" : "px-4";
+
+  let openDiscordTooltipText: string;
+  const { t } = getTranslate();
+  t.subscribe((getTranslationText) => {
+    openDiscordTooltipText = getTranslationText(
+      "error.open_modding_discord.must_generate_debug_first",
+      "You must generate debug info first",
+    );
+  });
+
+  let allowOpeningDiscord: boolean = false;
+
+  let onClickGenerateDebugInfo = async () => {
+    let didUserSaveFile = await GenerateDebugInfo();
+    if (didUserSaveFile) {
+      allowOpeningDiscord = true;
+      openDiscordTooltipText = "";
+    } else {
+      alert(
+        "Failed to generate and save the debug info file. Did you click the Cancel button? If not, manually check your Satisfactory Mod Manager log files for more information: https://docs.ficsit.app/satisfactory-modding/latest/faq.html#Files_Logs",
+      );
+    }
+  };
+
+  let OpenDiscord = () => {
+    BrowserOpenURL("https://discord.ficsit.app/");
+  };
+  export let error: string;
+</script>
+
+<!-- Replace with svelte snippets once in Svelte 5 -->
+<header class="card-header font-bold text-2xl text-center">
+  <slot name="title" />
+  <!-- <T defaultValue="Something went wrong" keyName="error.title" /> -->
+</header>
+<section class={`${sectionClass} overflow-y-auto`}>
+  <p>{error}</p>
+</section>
+<section class={sectionClass}>
+  <p class={fullPageMode ? "text-base text-center" : ""}>
+    <T
+      defaultValue="Seems wrong? Click the button below to gather logs, then send the generated zip file on the modding discord in #help-using-mods."
+      keyName="error.reporting_directions"
+    />
+  </p>
+</section>
+<section class={sectionClass}>
+  <p class="text-base text-center">
+    <button
+      class="btn text-primary-600 variant-ringed"
+      on:click={onClickGenerateDebugInfo}
+    >
+      <T
+        defaultValue="Generate debug info"
+        keyName="error.generate_debug_info"
+      />
+    </button>
+    <button
+      class="btn text-primary-600 variant-ringed"
+      on:click={OpenDiscord}
+      disabled={!allowOpeningDiscord}
+      title={openDiscordTooltipText}
+    >
+      <T
+        defaultValue="Open the Modding Discord"
+        keyName="error.open_modding_discord"
+      />
+    </button>
+  </p>
+</section>
+{#if !fullPageMode}
+  <footer class="card-footer">
+    <button class="btn" on:click={parent.onClose}>
+      <T defaultValue="Close" keyName="common.close" />
+    </button>
+  </footer>
+{/if}
diff --git a/frontend/src/lib/components/modals/ErrorModal.svelte b/frontend/src/lib/components/modals/ErrorModal.svelte
index 42bf1fe7..78d10df5 100644
--- a/frontend/src/lib/components/modals/ErrorModal.svelte
+++ b/frontend/src/lib/components/modals/ErrorModal.svelte
@@ -1,38 +1,9 @@
 <script lang="ts">
-  import T from "$lib/components/T.svelte";
-  import { BrowserOpenURL } from "$lib/generated/wailsjs/runtime/runtime";
-  import { GenerateDebugInfo } from "$wailsjs/go/app/app";
-  import { getTranslate } from "@tolgee/svelte";
+  import { T } from "@tolgee/svelte";
+  import ErrorDetails from "./ErrorDetails.svelte";
 
   export let parent: { onClose: () => void };
 
-  let openDiscordTooltipText: string;
-  const { t } = getTranslate();
-  t.subscribe((getTranslationText) => {
-    openDiscordTooltipText = getTranslationText(
-      "error.open_modding_discord.must_generate_debug_first",
-      "You must generate debug info first",
-    );
-  });
-
-  let allowOpeningDiscord: boolean = false;
-
-  let onClickGenerateDebugInfo = async () => {
-    let didUserSaveFile = await GenerateDebugInfo();
-    if (didUserSaveFile) {
-      allowOpeningDiscord = true;
-      openDiscordTooltipText = "";
-    } else {
-      alert(
-        "Failed to generate and save the debug info file. Did you click the Cancel button? If not, manually check your Satisfactory Mod Manager log files for more information: https://docs.ficsit.app/satisfactory-modding/latest/faq.html#Files_Logs",
-      );
-    }
-  };
-
-  let OpenDiscord = () => {
-    BrowserOpenURL("https://discord.ficsit.app/");
-  };
-
   export let error: string;
 </script>
 
@@ -40,43 +11,7 @@
   style="max-height: calc(100vh - 3rem); max-width: calc(100vw - 3rem);"
   class="w-[48rem] card flex flex-col gap-6"
 >
-  <header class="card-header font-bold text-2xl text-center">
-    <T defaultValue="Something went wrong" keyName="error.title" />
-  </header>
-  <section class="px-4 overflow-y-auto">
-    <p>{error}</p>
-  </section>
-  <section class="px-4">
-    <T
-      defaultValue="Seems wrong? Click the button below to gather logs, then send the generated zip file on the modding discord in #help-using-mods."
-      keyName="error.reporting_directions"
-    />
-  </section>
-  <section class="px-4">
-    <button
-      class="btn text-primary-600 variant-ringed"
-      on:click={onClickGenerateDebugInfo}
-    >
-      <T
-        defaultValue="Generate debug info"
-        keyName="error.generate_debug_info"
-      />
-    </button>
-    <button
-      class="btn text-primary-600 variant-ringed"
-      on:click={OpenDiscord}
-      disabled={!allowOpeningDiscord}
-      title={openDiscordTooltipText}
-    >
-      <T
-        defaultValue="Open the Modding Discord"
-        keyName="error.open_modding_discord"
-      />
-    </button>
-  </section>
-  <footer class="card-footer">
-    <button class="btn" on:click={parent.onClose}>
-      <T defaultValue="Close" keyName="common.close" />
-    </button>
-  </footer>
+  <ErrorDetails {error} {parent}>
+    <T slot="title" defaultValue="Something went wrong" keyName="error.title" />
+  </ErrorDetails>
 </div>

From f85a4005ff7e1507ce7c1c34c94c2a2efa4d7ff4 Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 18:28:42 -0400
Subject: [PATCH 05/12] Fix typo

---
 frontend/src/lib/components/mods-list/ModsListItem.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/lib/components/mods-list/ModsListItem.svelte b/frontend/src/lib/components/mods-list/ModsListItem.svelte
index 7a385ca5..b81b5efb 100644
--- a/frontend/src/lib/components/mods-list/ModsListItem.svelte
+++ b/frontend/src/lib/components/mods-list/ModsListItem.svelte
@@ -74,7 +74,7 @@
       return {
         icon: mdiLinkLock,
         iconHover: mdiLinkLock,
-        tooltip: $t('mod-list-item.dependency', 'This mod is installed a dependency of another mod. It cannot be installed or removed on its own.'),
+        tooltip: $t('mod-list-item.dependency', 'This mod is installed as a dependency of another mod. It cannot be installed or removed on its own.'),
       };
     }
     if (queuedInstall) {

From df105dccce221143a8e9aa7e06efd07a70364ad9 Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 20:15:44 -0400
Subject: [PATCH 06/12] Run frontend formatter (seems this isn't run
 automatically?)

---
 README.md                                     |  6 +++++
 frontend/src/App.svelte                       | 15 +++++------
 .../lib/components/modals/ErrorDetails.svelte | 25 ++++++++++---------
 .../lib/components/modals/ErrorModal.svelte   |  5 ++--
 4 files changed, 30 insertions(+), 21 deletions(-)

diff --git a/README.md b/README.md
index 255ba486..74b48d7b 100644
--- a/README.md
+++ b/README.md
@@ -86,6 +86,12 @@ Then, to run it, use:
 golangci-lint run --fix
 ```
 
+You may also need to manually run the frontend linter. First, navigate to the `frontend` directory, then run:
+
+```bash
+pnpm run format
+```
+
 ### Localization
 
 If you'd like to help translate and localize SMM to different languages, join our [discord server](https://discord.ficsit.app/).
diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index 17d64bdc..a437ff99 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -10,6 +10,7 @@
   import TitleBar from '$lib/components/TitleBar.svelte';
   import LeftBar from '$lib/components/left-bar/LeftBar.svelte';
   import ModDetails from '$lib/components/mod-details/ModDetails.svelte';
+  import ErrorDetails from '$lib/components/modals/ErrorDetails.svelte';
   import ErrorModal from '$lib/components/modals/ErrorModal.svelte';
   import ExternalInstallMod from '$lib/components/modals/ExternalInstallMod.svelte';
   import { supportedProgressTypes } from '$lib/components/modals/ProgressModal.svelte';
@@ -26,7 +27,6 @@
   import { smmUpdate, smmUpdateReady } from '$lib/store/smmUpdateStore';
   import { ExpandMod, UnexpandMod } from '$wailsjs/go/app/app';
   import { Environment, EventsOn } from '$wailsjs/runtime';
-  import ErrorDetails from '$lib/components/modals/ErrorDetails.svelte';
 
   initializeStores();
   initializeModalStore();
@@ -237,16 +237,17 @@
             }}>
             <div class="card my-auto mr-4">
               <ErrorDetails
-                error={""}
-                parent={{onClose: () => {}}}
+                error={''}
                 fullPageMode={true}
+                parent={{ onClose: () => {} }}
               >
                 <!-- Svelte slots don't support dynamic passing, so this is kinda ugly. Switch to snippets once in svelte 5 https://github.com/sveltejs/svelte/issues/7651-->
-                <T slot="title"
-                  defaultValue={ noInstallsError ? "No Satisfactory installs found" : "{invalidInstalls} invalid Satisfactory {invalidInstalls, plural, one {install} other {installs}} found"}
-                  keyName={ noInstallsError ? "error.no_installs" : "error.invalid_installs"}
+                <T
+                  slot="title"
+                  defaultValue={noInstallsError ? 'No Satisfactory installs found' : '{invalidInstalls} invalid Satisfactory {invalidInstalls, plural, one {install} other {installs}} found'}
+                  keyName={noInstallsError ? 'error.no_installs' : 'error.invalid_installs'}
                   params={{ invalidInstalls: $invalidInstalls.length }}
-                  />
+                />
               </ErrorDetails>
             </div>
           </ModsList>
diff --git a/frontend/src/lib/components/modals/ErrorDetails.svelte b/frontend/src/lib/components/modals/ErrorDetails.svelte
index 339c417c..f24736fc 100644
--- a/frontend/src/lib/components/modals/ErrorDetails.svelte
+++ b/frontend/src/lib/components/modals/ErrorDetails.svelte
@@ -1,20 +1,21 @@
 <script lang="ts">
-  import T from "$lib/components/T.svelte";
-  import { BrowserOpenURL } from "$lib/generated/wailsjs/runtime/runtime";
-  import { GenerateDebugInfo } from "$wailsjs/go/app/app";
-  import { getTranslate } from "@tolgee/svelte";
+  import { getTranslate } from '@tolgee/svelte';
+
+  import T from '$lib/components/T.svelte';
+  import { BrowserOpenURL } from '$lib/generated/wailsjs/runtime/runtime';
+  import { GenerateDebugInfo } from '$wailsjs/go/app/app';
 
   export let parent: { onClose: () => void };
 
   export let fullPageMode: boolean = false;
-  let sectionClass: string = fullPageMode ? "p-4" : "px-4";
+  let sectionClass: string = fullPageMode ? 'p-4' : 'px-4';
 
   let openDiscordTooltipText: string;
   const { t } = getTranslate();
   t.subscribe((getTranslationText) => {
     openDiscordTooltipText = getTranslationText(
-      "error.open_modding_discord.must_generate_debug_first",
-      "You must generate debug info first",
+      'error.open_modding_discord.must_generate_debug_first',
+      'You must generate debug info first',
     );
   });
 
@@ -24,16 +25,16 @@
     let didUserSaveFile = await GenerateDebugInfo();
     if (didUserSaveFile) {
       allowOpeningDiscord = true;
-      openDiscordTooltipText = "";
+      openDiscordTooltipText = '';
     } else {
       alert(
-        "Failed to generate and save the debug info file. Did you click the Cancel button? If not, manually check your Satisfactory Mod Manager log files for more information: https://docs.ficsit.app/satisfactory-modding/latest/faq.html#Files_Logs",
+        'Failed to generate and save the debug info file. Did you click the Cancel button? If not, manually check your Satisfactory Mod Manager log files for more information: https://docs.ficsit.app/satisfactory-modding/latest/faq.html#Files_Logs',
       );
     }
   };
 
   let OpenDiscord = () => {
-    BrowserOpenURL("https://discord.ficsit.app/");
+    BrowserOpenURL('https://discord.ficsit.app/');
   };
   export let error: string;
 </script>
@@ -47,7 +48,7 @@
   <p>{error}</p>
 </section>
 <section class={sectionClass}>
-  <p class={fullPageMode ? "text-base text-center" : ""}>
+  <p class={fullPageMode ? 'text-base text-center' : ''}>
     <T
       defaultValue="Seems wrong? Click the button below to gather logs, then send the generated zip file on the modding discord in #help-using-mods."
       keyName="error.reporting_directions"
@@ -67,9 +68,9 @@
     </button>
     <button
       class="btn text-primary-600 variant-ringed"
-      on:click={OpenDiscord}
       disabled={!allowOpeningDiscord}
       title={openDiscordTooltipText}
+      on:click={OpenDiscord}
     >
       <T
         defaultValue="Open the Modding Discord"
diff --git a/frontend/src/lib/components/modals/ErrorModal.svelte b/frontend/src/lib/components/modals/ErrorModal.svelte
index 78d10df5..44b51128 100644
--- a/frontend/src/lib/components/modals/ErrorModal.svelte
+++ b/frontend/src/lib/components/modals/ErrorModal.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
-  import { T } from "@tolgee/svelte";
-  import ErrorDetails from "./ErrorDetails.svelte";
+  import { T } from '@tolgee/svelte';
+
+  import ErrorDetails from './ErrorDetails.svelte';
 
   export let parent: { onClose: () => void };
 

From 05d517d33810e48be9c137ffb1f22fa5900913bb Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 20:16:22 -0400
Subject: [PATCH 07/12] Switch to correct BrowserOpenUrl import

---
 frontend/src/lib/components/modals/ErrorDetails.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/lib/components/modals/ErrorDetails.svelte b/frontend/src/lib/components/modals/ErrorDetails.svelte
index f24736fc..b2e5ea7a 100644
--- a/frontend/src/lib/components/modals/ErrorDetails.svelte
+++ b/frontend/src/lib/components/modals/ErrorDetails.svelte
@@ -2,8 +2,8 @@
   import { getTranslate } from '@tolgee/svelte';
 
   import T from '$lib/components/T.svelte';
-  import { BrowserOpenURL } from '$lib/generated/wailsjs/runtime/runtime';
   import { GenerateDebugInfo } from '$wailsjs/go/app/app';
+  import { BrowserOpenURL } from '$wailsjs/runtime/runtime';
 
   export let parent: { onClose: () => void };
 

From c8c50cfda3229584286184e738d5009b7e339577 Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 20:49:35 -0400
Subject: [PATCH 08/12] Provide VSCode multi-root workspace for proper linter
 behavior per
 https://stackoverflow.com/questions/47405315/visual-studio-code-and-subfolder-specific-settings

---
 .gitignore                                    |  2 ++
 .vscode/SatisfactoryModManager.code-workspace | 35 +++++++++++++++++++
 README.md                                     |  8 +++++
 3 files changed, 45 insertions(+)
 create mode 100644 .vscode/SatisfactoryModManager.code-workspace

diff --git a/.gitignore b/.gitignore
index c43054ae..0eaa50e9 100644
--- a/.gitignore
+++ b/.gitignore
@@ -126,6 +126,8 @@ fabric.properties
 !.vscode/launch.json
 !.vscode/extensions.json
 !.vscode/*.code-snippets
+# Specifically allow the provided code workspace with the multi-root workaround
+!.vscode/SatisfactoryModManager.code-workspace
 
 # Local History for Visual Studio Code
 .history/
diff --git a/.vscode/SatisfactoryModManager.code-workspace b/.vscode/SatisfactoryModManager.code-workspace
new file mode 100644
index 00000000..65642eb4
--- /dev/null
+++ b/.vscode/SatisfactoryModManager.code-workspace
@@ -0,0 +1,35 @@
+{
+	// Needed for vscode ESLint to work
+	// https://stackoverflow.com/questions/47405315/visual-studio-code-and-subfolder-specific-settings
+	"folders": [
+		{
+			"name": "root",
+			"path": "../."
+		},
+		{
+			"path": "../frontend"
+		},
+		{
+			"path": "../backend"
+		}
+	],
+	"settings": {
+		"files.exclude": {
+			"**/.git": true,
+			"backend": true,
+			"frontend": true
+		},
+	},
+	"extensions": {
+		"recommendations": [
+			"svelte.svelte-vscode",
+			"streetsidesoftware.code-spell-checker",
+			"dbaeumer.vscode-eslint",
+			"davidanson.vscode-markdownlint",
+			"herrmannplatz.npm-dependency-links",
+			"medo64.render-crlf",
+			"redhat.vscode-yaml",
+			"golang.go"
+		]
+	}
+}
\ No newline at end of file
diff --git a/README.md b/README.md
index 74b48d7b..114af449 100644
--- a/README.md
+++ b/README.md
@@ -69,6 +69,14 @@ Although `wails dev` should run these commands for you under normal circumstance
 you may need to run `pnpm graphql-codegen` in the `frontend` directory to update the code generated from the SMR API,
 or run `pnpm translations` to update the translation data.
 
+### IDE Configuration
+
+Make sure that your IDE is connecting with the frontend's installation of ESLint to get the best experience.
+
+VSCode users, a preconfigured workspace is provided in `./vscode`
+that allows editing both Go and Svelte files
+while maintaining correct ESLint functionality.
+
 ### Building
 
 ```bash

From f73b0acf355240179b05d654b7330d7b3cb3a71b Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Sun, 1 Sep 2024 23:11:47 -0400
Subject: [PATCH 09/12] Cleanup

---
 frontend/src/lib/components/modals/ErrorDetails.svelte | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/src/lib/components/modals/ErrorDetails.svelte b/frontend/src/lib/components/modals/ErrorDetails.svelte
index b2e5ea7a..5293ffc0 100644
--- a/frontend/src/lib/components/modals/ErrorDetails.svelte
+++ b/frontend/src/lib/components/modals/ErrorDetails.svelte
@@ -42,7 +42,6 @@
 <!-- Replace with svelte snippets once in Svelte 5 -->
 <header class="card-header font-bold text-2xl text-center">
   <slot name="title" />
-  <!-- <T defaultValue="Something went wrong" keyName="error.title" /> -->
 </header>
 <section class={`${sectionClass} overflow-y-auto`}>
   <p>{error}</p>

From 5a2c3e85faa3f80a39d405ff50ad7c420d407bdf Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Tue, 3 Sep 2024 15:37:13 -0400
Subject: [PATCH 10/12] Suggestions from code review. Code format error text in
 error details. Handling failed debug zip generation case.

---
 .gitignore                                    |  6 +-
 README.md                                     |  2 +-
 backend/app/debug_info.go                     | 12 +--
 frontend/src/App.svelte                       | 21 +++--
 .../lib/components/modals/ErrorDetails.svelte | 88 ++++++++++++++-----
 .../lib/components/modals/ErrorModal.svelte   |  2 +-
 6 files changed, 89 insertions(+), 42 deletions(-)

diff --git a/.gitignore b/.gitignore
index 0eaa50e9..fe043c58 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,9 +2,11 @@
 dist
 *.syso
 
-
 .DS_Store
 
+# Specifically allow the provided code workspace with the multi-root workaround
+!.vscode/SatisfactoryModManager.code-workspace
+
 # Created by https://www.toptal.com/developers/gitignore/api/goland+all,go,visualstudiocode
 # Edit at https://www.toptal.com/developers/gitignore?templates=goland+all,go,visualstudiocode
 
@@ -126,8 +128,6 @@ fabric.properties
 !.vscode/launch.json
 !.vscode/extensions.json
 !.vscode/*.code-snippets
-# Specifically allow the provided code workspace with the multi-root workaround
-!.vscode/SatisfactoryModManager.code-workspace
 
 # Local History for Visual Studio Code
 .history/
diff --git a/README.md b/README.md
index 114af449..c07c357c 100644
--- a/README.md
+++ b/README.md
@@ -73,7 +73,7 @@ or run `pnpm translations` to update the translation data.
 
 Make sure that your IDE is connecting with the frontend's installation of ESLint to get the best experience.
 
-VSCode users, a preconfigured workspace is provided in `./vscode`
+VSCode users, a preconfigured workspace is provided in `.vscode/`
 that allows editing both Go and Svelte files
 while maintaining correct ESLint functionality.
 
diff --git a/backend/app/debug_info.go b/backend/app/debug_info.go
index fb5a8cfa..35a3f259 100644
--- a/backend/app/debug_info.go
+++ b/backend/app/debug_info.go
@@ -204,7 +204,7 @@ func (a *app) generateAndSaveDebugInfo(filename string) error {
 	return nil
 }
 
-func (a *app) GenerateDebugInfo() bool {
+func (a *app) GenerateDebugInfo() (bool, error) {
 	defaultFileName := fmt.Sprintf("SMMDebug-%s.zip", time.Now().UTC().Format("2006-01-02-15-04-05"))
 	filename, err := wailsRuntime.SaveFileDialog(appCommon.AppContext, wailsRuntime.SaveDialogOptions{
 		DefaultFilename: defaultFileName,
@@ -217,18 +217,18 @@ func (a *app) GenerateDebugInfo() bool {
 	})
 	if err != nil {
 		slog.Error("failed to open save dialog", slog.Any("error", err))
-		return false
+		return false, err
 	}
 	if filename == "" {
-		slog.Error("failed to save, filename was empty, the user might have cancelled the dialog")
-		return false
+		// user canceled the save dialog
+		return false, nil
 	}
 
 	err = a.generateAndSaveDebugInfo(filename)
 	if err != nil {
 		slog.Error("failed to generate debug info", slog.Any("error", err))
-		return false
+		return false, err
 	}
 
-	return true
+	return true, nil
 }
diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index a437ff99..332c3e79 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -239,15 +239,20 @@
               <ErrorDetails
                 error={''}
                 fullPageMode={true}
-                parent={{ onClose: () => {} }}
               >
-                <!-- Svelte slots don't support dynamic passing, so this is kinda ugly. Switch to snippets once in svelte 5 https://github.com/sveltejs/svelte/issues/7651-->
-                <T
-                  slot="title"
-                  defaultValue={noInstallsError ? 'No Satisfactory installs found' : '{invalidInstalls} invalid Satisfactory {invalidInstalls, plural, one {install} other {installs}} found'}
-                  keyName={noInstallsError ? 'error.no_installs' : 'error.invalid_installs'}
-                  params={{ invalidInstalls: $invalidInstalls.length }}
-                />
+                <svelte:fragment slot="title">
+                  {#if noInstallsError}
+                    <T
+                      defaultValue="No Satisfactory installs found"
+                      keyName="error.no_installs"
+                    />
+                  {:else}
+                    <T
+                      defaultValue={'{invalidInstalls} invalid Satisfactory {invalidInstalls, plural, one {install} other {installs}} found'}
+                      keyName="error.invalid_installs"
+                      params={{ invalidInstalls: $invalidInstalls.length }} />
+                  {/if}
+                </svelte:fragment>
               </ErrorDetails>
             </div>
           </ModsList>
diff --git a/frontend/src/lib/components/modals/ErrorDetails.svelte b/frontend/src/lib/components/modals/ErrorDetails.svelte
index 5293ffc0..f5d9facc 100644
--- a/frontend/src/lib/components/modals/ErrorDetails.svelte
+++ b/frontend/src/lib/components/modals/ErrorDetails.svelte
@@ -1,61 +1,78 @@
 <script lang="ts">
+  import { type PopupSettings, popup } from '@skeletonlabs/skeleton';
   import { getTranslate } from '@tolgee/svelte';
 
   import T from '$lib/components/T.svelte';
+  import Tooltip from '$lib/components/Tooltip.svelte';
   import { GenerateDebugInfo } from '$wailsjs/go/app/app';
-  import { BrowserOpenURL } from '$wailsjs/runtime/runtime';
+  import { BrowserOpenURL, LogError } from '$wailsjs/runtime/runtime';
 
-  export let parent: { onClose: () => void };
+  export let onClose: (() => void) | null = null;
 
   export let fullPageMode: boolean = false;
-  let sectionClass: string = fullPageMode ? 'p-4' : 'px-4';
+  $: sectionClass = fullPageMode ? 'p-4' : 'px-4';
 
-  let openDiscordTooltipText: string;
   const { t } = getTranslate();
-  t.subscribe((getTranslationText) => {
-    openDiscordTooltipText = getTranslationText(
-      'error.open_modding_discord.must_generate_debug_first',
-      'You must generate debug info first',
-    );
-  });
+  $: openDiscordTooltipText = $t(
+    'error.open_modding_discord.must_generate_debug_first',
+    'You must generate debug info first',
+  );
 
   let allowOpeningDiscord: boolean = false;
+  let debugFileGenerationError: boolean = false;
 
   let onClickGenerateDebugInfo = async () => {
-    let didUserSaveFile = await GenerateDebugInfo();
-    if (didUserSaveFile) {
+    try {
+      let didUserSaveFile = await GenerateDebugInfo();
+      if (didUserSaveFile) {
+        // Explicitly set to true -> if people click to save a second time but cancel, don't lock them out
+        allowOpeningDiscord = true;
+      }
+    } catch (error) {
+      LogError(`GenerateDebugInfo failed: ${error}`);
+      debugFileGenerationError = true;
+      // Enable the Discord button so they can report the error
       allowOpeningDiscord = true;
-      openDiscordTooltipText = '';
-    } else {
-      alert(
-        'Failed to generate and save the debug info file. Did you click the Cancel button? If not, manually check your Satisfactory Mod Manager log files for more information: https://docs.ficsit.app/satisfactory-modding/latest/faq.html#Files_Logs',
-      );
     }
   };
 
   let OpenDiscord = () => {
     BrowserOpenURL('https://discord.ficsit.app/');
   };
+
+  let OpenLogDocs = () => {
+    BrowserOpenURL('https://docs.ficsit.app/satisfactory-modding/latest/faq.html#Files_Logs');
+  };
+
+  const popupId = 'error-details-open-discord-popup';
+  const openDiscordPopup = {
+    event: 'hover',
+    target: popupId,
+    middleware: {
+      offset: 4,
+    },
+    placement: 'bottom-end',
+  } satisfies PopupSettings;
+  
   export let error: string;
 </script>
 
-<!-- Replace with svelte snippets once in Svelte 5 -->
 <header class="card-header font-bold text-2xl text-center">
   <slot name="title" />
 </header>
 <section class={`${sectionClass} overflow-y-auto`}>
-  <p>{error}</p>
+  <p class="font-mono">{error}</p>
 </section>
 <section class={sectionClass}>
   <p class={fullPageMode ? 'text-base text-center' : ''}>
     <T
-      defaultValue="Seems wrong? Click the button below to gather logs, then send the generated zip file on the modding discord in #help-using-mods."
+      defaultValue="Seems wrong? Click the button below to gather logs, then send the generated zip file on the modding Discord in #help-using-mods."
       keyName="error.reporting_directions"
     />
   </p>
 </section>
 <section class={sectionClass}>
-  <p class="text-base text-center">
+  <p class="text-base">
     <button
       class="btn text-primary-600 variant-ringed"
       on:click={onClickGenerateDebugInfo}
@@ -68,19 +85,44 @@
     <button
       class="btn text-primary-600 variant-ringed"
       disabled={!allowOpeningDiscord}
-      title={openDiscordTooltipText}
       on:click={OpenDiscord}
+      use:popup={openDiscordPopup}
     >
       <T
         defaultValue="Open the Modding Discord"
         keyName="error.open_modding_discord"
       />
     </button>
+    <Tooltip disabled={allowOpeningDiscord} {popupId}>
+      {openDiscordTooltipText}
+    </Tooltip>
   </p>
 </section>
+{#if debugFileGenerationError}
+  <section class={sectionClass}>
+    <p class="text-base text-red-500">
+      <T
+        defaultValue="An error occurred while generating the debug file. Please manually check your Satisfactory Mod Manager log files for more information and report this on the Discord. Use the button below to open the documentation and learn how."
+        keyName="error.failed_to_generate_debug"
+      />
+    </p>
+  </section>
+  <section class={sectionClass}>
+    <button
+      class="btn text-primary-600 variant-ringed"
+      on:click={OpenLogDocs}
+    >
+      <T
+        defaultValue="Open the Logging Documentation"
+        keyName="error.open_log_docs"
+      />
+    </button>
+  </section>
+{/if}
 {#if !fullPageMode}
   <footer class="card-footer">
-    <button class="btn" on:click={parent.onClose}>
+    <!-- Must lambda the onClose call for type matching to be happy -->
+    <button class="btn" on:click={onClose}>
       <T defaultValue="Close" keyName="common.close" />
     </button>
   </footer>
diff --git a/frontend/src/lib/components/modals/ErrorModal.svelte b/frontend/src/lib/components/modals/ErrorModal.svelte
index 44b51128..bf5888c5 100644
--- a/frontend/src/lib/components/modals/ErrorModal.svelte
+++ b/frontend/src/lib/components/modals/ErrorModal.svelte
@@ -12,7 +12,7 @@
   style="max-height: calc(100vh - 3rem); max-width: calc(100vw - 3rem);"
   class="w-[48rem] card flex flex-col gap-6"
 >
-  <ErrorDetails {error} {parent}>
+  <ErrorDetails {error} onClose={parent.onClose}>
     <T slot="title" defaultValue="Something went wrong" keyName="error.title" />
   </ErrorDetails>
 </div>

From b484885d8d0886db165017c3d26bd39108eaa9c2 Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Tue, 3 Sep 2024 15:59:34 -0400
Subject: [PATCH 11/12] Left align buttons in modal mode, center in fullpageh

---
 frontend/src/lib/components/modals/ErrorDetails.svelte | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/lib/components/modals/ErrorDetails.svelte b/frontend/src/lib/components/modals/ErrorDetails.svelte
index f5d9facc..c76097d7 100644
--- a/frontend/src/lib/components/modals/ErrorDetails.svelte
+++ b/frontend/src/lib/components/modals/ErrorDetails.svelte
@@ -72,7 +72,7 @@
   </p>
 </section>
 <section class={sectionClass}>
-  <p class="text-base">
+  <p class={`text-base ${fullPageMode ? 'text-center' : ''}`}>
     <button
       class="btn text-primary-600 variant-ringed"
       on:click={onClickGenerateDebugInfo}
@@ -99,7 +99,7 @@
   </p>
 </section>
 {#if debugFileGenerationError}
-  <section class={sectionClass}>
+  <section class={`${sectionClass} ${fullPageMode ? 'text-center' : ''}`}>
     <p class="text-base text-red-500">
       <T
         defaultValue="An error occurred while generating the debug file. Please manually check your Satisfactory Mod Manager log files for more information and report this on the Discord. Use the button below to open the documentation and learn how."
@@ -107,7 +107,7 @@
       />
     </p>
   </section>
-  <section class={sectionClass}>
+  <section class={`${sectionClass} ${fullPageMode ? 'text-center' : ''}`}>
     <button
       class="btn text-primary-600 variant-ringed"
       on:click={OpenLogDocs}

From a48376209214239375ef1b8019475728cdb523d7 Mon Sep 17 00:00:00 2001
From: Rob B <computerguy440+gh@gmail.com>
Date: Tue, 3 Sep 2024 17:27:21 -0400
Subject: [PATCH 12/12] Suggestions from code review

---
 backend/app/debug_info.go                              | 6 ++----
 frontend/src/lib/components/modals/ErrorDetails.svelte | 2 --
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/backend/app/debug_info.go b/backend/app/debug_info.go
index 35a3f259..f0786541 100644
--- a/backend/app/debug_info.go
+++ b/backend/app/debug_info.go
@@ -216,8 +216,7 @@ func (a *app) GenerateDebugInfo() (bool, error) {
 		},
 	})
 	if err != nil {
-		slog.Error("failed to open save dialog", slog.Any("error", err))
-		return false, err
+		return false, fmt.Errorf("failed to open save dialog: %w", err)
 	}
 	if filename == "" {
 		// user canceled the save dialog
@@ -226,8 +225,7 @@ func (a *app) GenerateDebugInfo() (bool, error) {
 
 	err = a.generateAndSaveDebugInfo(filename)
 	if err != nil {
-		slog.Error("failed to generate debug info", slog.Any("error", err))
-		return false, err
+		return false, fmt.Errorf("failed to generate debug info: %w", err)
 	}
 
 	return true, nil
diff --git a/frontend/src/lib/components/modals/ErrorDetails.svelte b/frontend/src/lib/components/modals/ErrorDetails.svelte
index c76097d7..caa37a5e 100644
--- a/frontend/src/lib/components/modals/ErrorDetails.svelte
+++ b/frontend/src/lib/components/modals/ErrorDetails.svelte
@@ -29,7 +29,6 @@
         allowOpeningDiscord = true;
       }
     } catch (error) {
-      LogError(`GenerateDebugInfo failed: ${error}`);
       debugFileGenerationError = true;
       // Enable the Discord button so they can report the error
       allowOpeningDiscord = true;
@@ -121,7 +120,6 @@
 {/if}
 {#if !fullPageMode}
   <footer class="card-footer">
-    <!-- Must lambda the onClose call for type matching to be happy -->
     <button class="btn" on:click={onClose}>
       <T defaultValue="Close" keyName="common.close" />
     </button>