New instance settings in app (#3033)

* Tabbed interface component

* Start instance settings

* New instance settings, mostly done minus modpacks

* Extract i18n

* Some more fixes with settings, still no modpacks yet

* Lint

* Modpack installation settings

* Change no friends language

* Remove options legacy button

* fix lint, small bug

* fix invalid cond on friends ui

* update resource management page

---------

Signed-off-by: Geometrically <18202329+Geometrically@users.noreply.github.com>
Co-authored-by: Jai A <jaiagr+gpg@pm.me>
Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>

apps/app-frontend/src/components/ui/ModpackVersionModal.vue

@@ -24,6 +24,8 @@ defineExpose({
   },
 })
 
+const emit = defineEmits(['finish-install'])
+
 const filteredVersions = computed(() => {
   return props.versions
 })
@@ -34,9 +36,17 @@ const installing = computed(() => props.instance.install_stage !== 'installed')
 const inProgress = ref(false)
 
 const switchVersion = async (versionId) => {
+  modpackVersionModal.value.hide()
   inProgress.value = true
   await update_managed_modrinth_version(props.instance.path, versionId)
   inProgress.value = false
+  emit('finish-install')
+}
+
+const onHide = () => {
+  if (!inProgress.value) {
+    emit('finish-install')
+  }
 }
 </script>
 
@@ -45,9 +55,10 @@ const switchVersion = async (versionId) => {
     ref="modpackVersionModal"
     class="modpack-version-modal"
     header="Change modpack version"
+    :on-hide="onHide"
   >
     <div class="modal-body">
-      <Card v-if="instance.linked_data" class="mod-card">
+      <div v-if="instance.linked_data" class="mod-card">
         <div class="table">
           <div class="table-row with-columns table-head">
             <div class="table-cell table-text download-cell" />
@@ -106,7 +117,7 @@ const switchVersion = async (versionId) => {
             </div>
           </div>
         </div>
-      </Card>
+      </div>
     </div>
   </ModalWrapper>
 </template>