feat: less bad installations

src/components/InstallButton.vue

@@ -13,7 +13,14 @@ const install = async () => {
         return;
     }
 
-    await invoke('install_package', { key: pkgKey(props.pkg) });
+    try {
+        await invoke('install_package', { key: pkgKey(props.pkg) });
+    } catch (err) {
+        console.error(err);
+        if (props.pkg !== undefined) {
+            props.pkg.js.busy = false;
+        }
+    }
 
     //if (rv === 'Deferred') { /* download progress */ }
 };
@@ -39,7 +46,7 @@ const remove = async () => {
         size="small"
         class="self-center ml-4"
         style="width: 2rem; height: 2rem"
-        :loading="false"
+        :loading="pkg?.js.busy"
         v-on:click="remove()"
     />
 
@@ -52,7 +59,7 @@ const remove = async () => {
         size="small"
         class="self-center ml-4"
         style="width: 2rem; height: 2rem"
-        :loading="false"
+        :loading="pkg?.js.busy"
         v-on:click="install()"
     />
 </template>

src/components/ModListEntry.vue

@@ -13,8 +13,9 @@ const props = defineProps({
     pkg: Object as () => Package,
 });
 
-const toggle = (value: boolean) => {
+const toggle = async (value: boolean) => {
     store.toggle(props.pkg, value);
+    await store.reloadProfile();
 };
 </script>
 

src/stores.ts

@@ -29,12 +29,18 @@ export const usePkgStore = defineStore('pkg', {
     actions: {
         setupListeners() {
             listen<InstallStatus>('install-start', async (ev) => {
-                await this.reload(ev.payload.pkg);
+                const key = ev.payload.pkg;
+                await this.reload(key);
+                this.pkg[key].js.busy = true;
+                console.log('install-start' + key);
             });
 
             listen<InstallStatus>('install-end', async (ev) => {
-                await this.reload(ev.payload.pkg);
+                const key = ev.payload.pkg;
+                await this.reload(key);
                 await this.reloadProfile();
+                this.pkg[key].js.busy = false;
+                console.log('install-end' + key);
             });
         },
 
@@ -44,37 +50,28 @@ export const usePkgStore = defineStore('pkg', {
                 [key: string]: Package;
             };
 
-            for (const k of Object.keys(this)) {
-                delete this.pkg[k];
+            for (const [k, v] of Object.entries(data)) {
+                this.reloadWith(k, v);
             }
-
-            Object.assign(this.pkg, data);
-
-            if (this.prf !== null)
-                for (const [k, v] of Object.entries(this)) {
-                    if (this.prf.mods.includes(k)) {
-                        if (v.loc) {
-                            v.loc.enabled = true;
-                        } else {
-                            console.error(`${k} enabled but not present`);
-                        }
-                    }
-                }
         },
 
         async reload(pkgOrKey: string | Package) {
             const key =
                 typeof pkgOrKey === 'string' ? pkgOrKey : pkgKey(pkgOrKey);
-            const rv: Package = await invoke('get_package', {
+            const pkg: Package = await invoke('get_package', {
                 key,
             });
+            this.reloadWith(key, pkg);
+        },
+
+        async reloadWith(key: string, pkg: Package) {
             if (this.pkg[key] === undefined) {
-                this.pkg[key] = {} as Package;
+                this.pkg[key] = { js: { busy: false } } as Package;
             } else {
                 this.pkg[key].loc = null;
                 this.pkg[key].rmt = null;
             }
-            Object.assign(this.pkg[key], rv);
+            Object.assign(this.pkg[key], pkg);
         },
 
         async initProfile(exePath: string) {

src/types.ts

@@ -14,6 +14,9 @@ export interface Package {
         download_url: string;
         deprecated: boolean;
     } | null;
+    js: {
+        busy: boolean;
+    };
 }
 
 export interface Profile {