feat: Add initial skeleton for ModsView (#27)

* feat: Backend code to get list of installed mods

For now simply parses `enabledmods.json`.
Note that this file will not be up-to-date if the user just installed a
mod but hasn't launched Northstar yet.

* feat: Empty skeleton page for ModsView

Will be populated later with list of installed mods

* chore: Remove leftover print statement

2 files changed, 53 insertions, 0 deletions

diff --git a/src-vue/src/views/DeveloperView.vue b/src-vue/src/views/DeveloperView.vue
index 3a7ec8f5..8bcd36ea 100644
--- a/src-vue/src/views/DeveloperView.vue
+++ b/src-vue/src/views/DeveloperView.vue
@@ -22,6 +22,10 @@
             Disable all but core mods
         </el-button>
 
+        <el-button type="primary" @click="getInstalledMods">
+            Get installed mods
+        </el-button>
+
     </div>
 </template>
 
@@ -112,6 +116,33 @@ export default defineComponent({
                         position: 'bottom-right'
                     });
                 });
+        },
+        async getInstalledMods() {
+            let game_install = {
+                game_path: this.$store.state.game_path,
+                install_type: this.$store.state.install_type
+            } as GameInstall;
+            await invoke("get_installed_mods_caller", { gameInstall: game_install }).then((message) => {
+                // Simply console logging for now
+                // In the future we should display the installed mods somewhere
+                console.log(message);
+
+                // Just a visual indicator that it worked
+                ElNotification({
+                    title: 'Success',
+                    message: "Success",
+                    type: 'success',
+                    position: 'bottom-right'
+                });
+            })
+                .catch((error) => {
+                    ElNotification({
+                        title: 'Error',
+                        message: error,
+                        type: 'error',
+                        position: 'bottom-right'
+                    });
+                });
         }
     }
 });
diff --git a/src-vue/src/views/ModsView.vue b/src-vue/src/views/ModsView.vue
new file mode 100644
index 00000000..c37f5fe2
--- /dev/null
+++ b/src-vue/src/views/ModsView.vue
@@ -0,0 +1,22 @@
+<template>
+    <div class="fc__mods__container">
+        <h3>Installed Mods:</h3>
+        TODO
+    </div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+export default defineComponent({
+    name: "ModsView",
+});
+</script>
+
+<style scoped>
+.fc__mods__container {
+    padding: 20px 30px;
+    color: white;
+    position: relative;
+}
+</style>