From b9287e9ac74312b5efee8c13e3164a3352d5d09d Mon Sep 17 00:00:00 2001
From: Rémy Raes <contact@remyraes.com>
Date: Wed, 21 Dec 2022 15:03:20 +0100
Subject: fix: Mod view with no game install (#114)

* refactor: set installedMods as a ModsView computed property

* feat: display a message on ModsView instead of cards if no mods were found

* refactor: remove error notification on game path discovery failure

* Revert "refactor: remove error notification on game path discovery failure"

This reverts commit db4af9ff78dc17bda77ce94283e35f9f1e961086.

* fix: don't invoke get_installed_mods_caller with no game path set
---
 src-vue/src/plugins/store.ts   | 7 +++++++
 src-vue/src/views/ModsView.vue | 8 +++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src-vue/src/plugins/store.ts b/src-vue/src/plugins/store.ts
index b51f97e5..3776a6c5 100644
--- a/src-vue/src/plugins/store.ts
+++ b/src-vue/src/plugins/store.ts
@@ -238,6 +238,13 @@ export const store = createStore<FlightCoreStore>({
                 game_path: state.game_path,
                 install_type: state.install_type
             } as GameInstall;
+
+            // If there's no game path, prevent looking for installed mods.
+            if (state.game_path === undefined) {
+                console.warn('Cannot load installed mods since so game path is selected.');
+                return;
+            }
+
             // Call back-end for installed mods
             await invoke("get_installed_mods_caller", { gameInstall: game_install })
                 .then((message) => {
diff --git a/src-vue/src/views/ModsView.vue b/src-vue/src/views/ModsView.vue
index 00522bf5..b1d1aeff 100644
--- a/src-vue/src/views/ModsView.vue
+++ b/src-vue/src/views/ModsView.vue
@@ -3,7 +3,8 @@
         <el-scrollbar>
             <h3>Installed Mods:</h3>
             <div>
-                <el-card shadow="hover" v-for="mod in $store.state.installed_mods">
+                <p v-if="installedMods.length === 0">No mods were found.</p>
+                <el-card v-else shadow="hover" v-for="mod in installedMods" v-bind:key="mod.name">
                     <el-switch style="--el-switch-on-color: #13ce66; --el-switch-off-color: #8957e5" v-model="mod.enabled"
                         :before-change="() => updateWhichModsEnabled(mod)" :loading="global_load_indicator" />
                     {{mod.name}}
@@ -30,6 +31,11 @@ export default defineComponent({
     async mounted() {
         this.$store.commit('loadInstalledMods');
     },
+    computed: {
+        installedMods(): NorthstarMod[] {
+            return this.$store.state.installed_mods;
+        }
+    },
     methods: {
         async updateWhichModsEnabled(mod: NorthstarMod) {
             this.global_load_indicator = true;
-- 
cgit v1.2.3