Performance improvements (#114)

* Performance improvements

* run fmt

* optimize creation modal

* remove print, fix mod loader editing

* Fix library update

* update extract loading bar

* Update theseus_gui/src-tauri/src/api/metadata.rs

Co-authored-by: triphora <emma@modrinth.com>

* fix cli

---------

Co-authored-by: triphora <emma@modrinth.com>

theseus_gui/src/components/GridDisplay.vue

@@ -103,7 +103,7 @@ const modsRow = ref(null)
     margin-right: auto;
     margin-top: 0.8rem;
     scroll-behavior: smooth;
-    overflow-y: scroll;
+    overflow-y: auto;
   }
 }
 

theseus_gui/src/components/modrinth-loading-indicator.js

@@ -63,7 +63,7 @@ export default defineComponent({
             background: props.color || undefined,
             backgroundSize: `${(100 / indicator.progress.value) * 100}% auto`,
             transition: 'width 0.1s, height 0.4s, opacity 0.4s',
-            zIndex: 99,
+            zIndex: 6,
           },
         },
         slots

theseus_gui/src/components/ui/Instance.vue

@@ -64,7 +64,7 @@ const install = async (e) => {
   )
 
   if (props.instance.project_type === 'modpack') {
-    const packs = Object.values(await list())
+    const packs = Object.values(await list(true))
 
     if (
       packs.length === 0 ||
@@ -125,9 +125,14 @@ await process_listener((e) => {
 
 <template>
   <div class="instance">
-    <Card v-if="props.small" class="instance-small-card button-base">
+    <Card v-if="props.small" class="instance-small-card button-base" @click="seeInstance">
       <Avatar
-        :src="convertFileSrc(props.instance.metadata.icon)"
+        :src="
+          !props.instance.metadata.icon ||
+          (props.instance.metadata.icon && props.instance.metadata.icon.startsWith('http'))
+            ? props.instance.metadata.icon
+            : convertFileSrc(instance.metadata?.icon)
+        "
         :alt="props.instance.metadata.name"
         size="sm"
       />
@@ -150,9 +155,10 @@ await process_listener((e) => {
         size="none"
         :src="
           props.instance.metadata
-            ? props.instance.metadata.icon && props.instance.metadata.icon.startsWith('http')
+            ? !props.instance.metadata.icon ||
+              (props.instance.metadata.icon && props.instance.metadata.icon.startsWith('http'))
               ? props.instance.metadata.icon
-              : convertFileSrc(props.instance.metadata?.icon)
+              : convertFileSrc(instance.metadata?.icon)
             : props.instance.icon_url
         "
         alt="Mod card"
@@ -166,25 +172,27 @@ await process_listener((e) => {
         </p>
       </div>
     </Card>
-    <div
-      v-if="props.instance.metadata && playing === false && modLoading === false"
-      class="install cta button-base"
-      @click="play"
-    >
-      <PlayIcon />
-    </div>
-    <div v-else-if="modLoading === true && playing === false" class="cta loading">
-      <AnimatedLogo class="loading" />
-    </div>
-    <div
-      v-else-if="playing === true"
-      class="stop cta button-base"
-      @click="stop"
-      @mousehover="checkProcess"
-    >
-      <XIcon />
-    </div>
-    <div v-else class="install cta buttonbase" @click="install"><SaveIcon /></div>
+    <template v-if="!props.small">
+      <div
+        v-if="props.instance.metadata && playing === false && modLoading === false"
+        class="install cta button-base"
+        @click="play"
+      >
+        <PlayIcon />
+      </div>
+      <div v-else-if="modLoading === true && playing === false" class="cta loading">
+        <AnimatedLogo class="loading" />
+      </div>
+      <div
+        v-else-if="playing === true"
+        class="stop cta button-base"
+        @click="stop"
+        @mousehover="checkProcess"
+      >
+        <XIcon />
+      </div>
+      <div v-else class="install cta buttonbase" @click="install"><SaveIcon /></div>
+    </template>
     <InstallConfirmModal ref="confirmModal" />
   </div>
 </template>
@@ -209,10 +217,6 @@ await process_listener((e) => {
       font-weight: bolder;
     }
   }
-
-  .cta {
-    display: none;
-  }
 }
 
 .instance {

theseus_gui/src/components/ui/InstanceCreationModal.vue

@@ -86,13 +86,13 @@ import {
   CodeIcon,
   Checkbox,
 } from 'omorphia'
-import { computed, ref } from 'vue'
+import { computed, ref, shallowRef } from 'vue'
 import { get_game_versions, get_loaders } from '@/helpers/tags'
 import { create } from '@/helpers/profile'
 import { open } from '@tauri-apps/api/dialog'
 import { useRouter } from 'vue-router'
 import { tauri } from '@tauri-apps/api'
-import { get_fabric_versions, get_forge_versions } from '@/helpers/metadata'
+import { get_fabric_versions, get_forge_versions, get_quilt_versions } from '@/helpers/metadata'
 
 const router = useRouter()
 
@@ -129,20 +129,27 @@ defineExpose({
   },
 })
 
-const all_game_versions = ref(await get_game_versions())
+const [fabric_versions, forge_versions, quilt_versions, all_game_versions, loaders] =
+  await Promise.all([
+    get_fabric_versions().then(shallowRef),
+    get_forge_versions().then(shallowRef),
+    get_quilt_versions().then(shallowRef),
+    get_game_versions().then(shallowRef),
+    get_loaders()
+      .then((value) =>
+        value
+          .filter((item) => item.supported_project_types.includes('modpack'))
+          .map((item) => item.name.toLowerCase())
+      )
+      .then(ref),
+  ])
 
 const game_versions = computed(() => {
   return all_game_versions.value
     .filter((item) => item.version_type === 'release' || showSnapshots.value)
     .map((item) => item.version)
 })
-const loaders = ref(
-  await get_loaders().then((value) =>
-    value
-      .filter((item) => item.supported_project_types.includes('modpack'))
-      .map((item) => item.name.toLowerCase())
-  )
-)
+
 const modal = ref(null)
 
 const check_valid = computed(() => {
@@ -191,9 +198,6 @@ const reset_icon = () => {
   display_icon.value = null
 }
 
-const fabric_versions = ref(await get_fabric_versions())
-const forge_versions = ref(await get_forge_versions())
-
 const selectable_versions = computed(() => {
   if (game_version.value) {
     if (loader.value === 'fabric') {
@@ -202,6 +206,8 @@ const selectable_versions = computed(() => {
       return forge_versions.value.gameVersions
         .find((item) => item.id === game_version.value)
         .loaders.map((item) => item.id)
+    } else if (loader.value === 'quilt') {
+      return quilt_versions.value.gameVersions[0].loaders.map((item) => item.id)
     }
   }
   return []

theseus_gui/src/components/ui/InstanceInstallModal.vue

@@ -11,14 +11,15 @@ import {
   RightArrowIcon,
   CheckIcon,
 } from 'omorphia'
-import { computed, ref } from 'vue'
-import { add_project_from_version as installMod, list } from '@/helpers/profile'
+import { computed, ref, shallowRef } from 'vue'
+import { add_project_from_version as installMod, check_installed, list } from '@/helpers/profile'
 import { tauri } from '@tauri-apps/api'
 import { open } from '@tauri-apps/api/dialog'
 import { convertFileSrc } from '@tauri-apps/api/tauri'
 import { useRouter } from 'vue-router'
 import { create } from '@/helpers/profile'
-import { checkInstalled, installVersionDependencies } from '@/helpers/utils'
+import { installVersionDependencies } from '@/helpers/utils'
+
 const router = useRouter()
 const versions = ref([])
 const project = ref('')
@@ -33,15 +34,17 @@ const gameVersion = ref(null)
 const creatingInstance = ref(false)
 
 defineExpose({
-  show: (projectId, selectedVersion) => {
+  show: async (projectId, selectedVersion) => {
     project.value = projectId
     versions.value = selectedVersion
     installModal.value.show()
     searchFilter.value = ''
+
+    profiles.value = await getData()
   },
 })
 
-const profiles = ref(await list().then(Object.values))
+const profiles = shallowRef(await getData())
 
 async function install(instance) {
   instance.installing = true
@@ -59,8 +62,10 @@ async function install(instance) {
   instance.installing = false
 }
 
-const filteredVersions = computed(() => {
-  const filtered = profiles.value
+async function getData() {
+  const projects = await list(true).then(Object.values)
+
+  const filtered = projects
     .filter((profile) => {
       return profile.metadata.name.toLowerCase().includes(searchFilter.value.toLowerCase())
     })
@@ -69,17 +74,20 @@ const filteredVersions = computed(() => {
         versions.value.flatMap((v) => v.game_versions).includes(profile.metadata.game_version) &&
         versions.value
           .flatMap((v) => v.loaders)
-          .some((value) => value === profile.metadata.loader || value === 'minecraft')
+          .some(
+            (value) =>
+              value === profile.metadata.loader || ['minecraft', 'iris', 'optifine'].includes(value)
+          )
       )
     })
 
-  filtered.map((profile) => {
+  for (let profile of filtered) {
     profile.installing = false
-    profile.installedMod = checkInstalled(profile, project.value)
-  })
+    profile.installedMod = await check_installed(profile.path, project.value)
+  }
 
   return filtered
-})
+}
 
 const toggleCreation = () => {
   showCreation.value = !showCreation.value
@@ -140,7 +148,7 @@ const check_valid = computed(() => {
     <div class="modal-body">
       <input v-model="searchFilter" type="text" class="search" placeholder="Search for a profile" />
       <div class="profiles">
-        <div v-for="profile in filteredVersions" :key="profile.metadata.name" class="option">
+        <div v-for="profile in profiles" :key="profile.metadata.name" class="option">
           <Button
             color="raised"
             class="profile-button"