Fixes and enhancements (#350)

* Fixes #147

* Fixes #149 and #151

* Fixed #153

* Fixes #154

* Update ContextMenu.vue

* Revert temp change to test windows

* More bug fixes

* Fixed modpack install bug

* Fixes #314

* Lint

* Fix #261

theseus_gui/src/components/ui/ContextMenu.vue

@@ -127,16 +127,19 @@ onBeforeUnmount(() => {
       &.primary {
         background-color: var(--color-brand);
         color: var(--color-accent-contrast);
+        font-weight: bold;
       }
 
       &.danger {
         background-color: var(--color-red);
         color: var(--color-accent-contrast);
+        font-weight: bold;
       }
 
       &.contrast {
         background-color: var(--color-orange);
         color: var(--color-accent-contrast);
+        font-weight: bold;
       }
     }
   }

theseus_gui/src/components/ui/InstallConfirmModal.vue

@@ -4,6 +4,7 @@ import { install as pack_install } from '@/helpers/pack'
 import { ref } from 'vue'
 import mixpanel from 'mixpanel-browser'
 import { useTheming } from '@/store/theme.js'
+import { handleError } from '@/store/state.js'
 
 const themeStore = useTheming()
 
@@ -15,11 +16,12 @@ const confirmModal = ref(null)
 const installing = ref(false)
 
 defineExpose({
-  show: (id, projectIdVal, projectTitle, projectIcon) => {
-    version.value = id
+  show: (projectIdVal, versionId, projectTitle, projectIcon) => {
     projectId.value = projectIdVal
+    version.value = versionId
     title.value = projectTitle
     icon.value = projectIcon
+    installing.value = false
     confirmModal.value.show()
 
     mixpanel.track('PackInstallStart')
@@ -28,7 +30,13 @@ defineExpose({
 
 async function install() {
   installing.value = true
-  await pack_install(projectId.value, version.value, title.value, icon.value ? icon.value : null)
+  console.log(`Installing ${projectId.value} ${version.value} ${title.value} ${icon.value}`)
+  await pack_install(
+    projectId.value,
+    version.value,
+    title.value,
+    icon.value ? icon.value : null
+  ).catch(handleError)
   confirmModal.value.hide()
 
   mixpanel.track('PackInstall', {

theseus_gui/src/components/ui/RunningAppBar.vue

@@ -11,14 +11,16 @@
     </Button>
     <div v-if="selectedProfile" class="status">
       <span class="circle running" />
-      <div
-        ref="profileButton"
-        class="running-text"
-        :class="{ clickable: currentProcesses.length > 1 }"
-        @click="toggleProfiles()"
-      >
-        {{ selectedProfile.metadata.name }}
-        <div v-if="currentProcesses.length > 1" class="arrow" :class="{ rotate: showProfiles }">
+      <div ref="profileButton" class="running-text">
+        <router-link :to="`/instance/${encodeURIComponent(selectedProfile.path)}`">
+          {{ selectedProfile.metadata.name }}
+        </router-link>
+        <div
+          v-if="currentProcesses.length > 1"
+          class="arrow button-base"
+          :class="{ rotate: showProfiles }"
+          @click="toggleProfiles()"
+        >
           <DropdownIcon />
         </div>
       </div>
@@ -44,7 +46,7 @@
     </div>
   </div>
   <transition name="download">
-    <Card v-if="showCard === true" ref="card" class="info-card">
+    <Card v-if="showCard === true && currentLoadingBars.length > 0" ref="card" class="info-card">
       <div v-for="loadingBar in currentLoadingBars" :key="loadingBar.id" class="info-text">
         <h3 class="info-title">
           {{ loadingBar.title }}
@@ -57,7 +59,11 @@
     </Card>
   </transition>
   <transition name="download">
-    <Card v-if="showProfiles === true" ref="profiles" class="profile-card">
+    <Card
+      v-if="showProfiles === true && currentProcesses.length > 0"
+      ref="profiles"
+      class="profile-card"
+    >
       <Button
         v-for="profile in currentProcesses"
         :key="profile.id"
@@ -193,6 +199,7 @@ const handleClickOutsideCard = (event) => {
     card.value &&
     card.value.$el !== event.target &&
     !elements.includes(card.value.$el) &&
+    infoButton.value &&
     !infoButton.value.contains(event.target)
   ) {
     showCard.value = false