prevent uninstall multiple click (#567)

Author: ABevier

modules/desktop/src/components/package-banner/package-banner.svelte

@@ -19,28 +19,54 @@
 
   export let pkg: GUIPackage;
   let installing = false;
-  let pruning = false;
+  let uninstalling = false;
 
   const install = async (version: string) => {
-    installing = true;
-    await packagesStore.installPkg(pkg, version);
-    installing = false;
+    if (installing) {
+      return;
+    }
+    try {
+      installing = true;
+      await packagesStore.installPkg(pkg, version);
+    } finally {
+      installing = false;
+    }
+  };
+
+  const uninstall = async () => {
+    if (uninstalling) {
+      return;
+    }
+
+    try {
+      uninstalling = true;
+      await packagesStore.uninstallPkg(pkg);
+    } finally {
+      uninstalling = false;
+    }
   };
 
   const prune = async () => {
-    pruning = true;
-    const versions = (pkg?.installed_versions || []).sort((a, b) => semverCompare(b, a));
-    for (const [i, v] of versions.entries()) {
-      if (i) {
-        // skip the latest version = 0
-        try {
-          await packagesStore.deletePkg(pkg, v);
-        } catch (e) {
-          console.error(e);
+    if (uninstalling) {
+      return;
+    }
+
+    try {
+      uninstalling = true;
+      const versions = (pkg?.installed_versions || []).sort((a, b) => semverCompare(b, a));
+      for (const [i, v] of versions.entries()) {
+        if (i) {
+          // skip the latest version = 0
+          try {
+            await packagesStore.deletePkg(pkg, v);
+          } catch (e) {
+            console.error(e);
+          }
         }
       }
+    } finally {
+      uninstalling = false;
     }
-    pruning = false;
   };
 
   let copied = false;
@@ -100,10 +126,8 @@
                 class="h-10"
                 type="plain"
                 color="blue"
-                onClick={async () => {
-                  packagesStore.uninstallPkg(pkg);
-                }}
-                loading={pruning}
+                onClick={uninstall}
+                loading={uninstalling}
               >
                 <div class="version-item flex w-full items-center justify-center gap-x-1 text-xs">
                   <div class="icon-trash" />
@@ -125,7 +149,7 @@
                 type="plain"
                 color="blue"
                 onClick={prune}
-                loading={pruning}
+                loading={uninstalling}
               >
                 <div class="version-item flex w-full items-center justify-center gap-x-1 text-xs">
                   <div class="icon-scissors" />

modules/desktop/src/libs/stores/pkgs.ts

@@ -27,6 +27,7 @@ import withRetry from "$libs/utils/retry";
 
 import log from "$libs/logger";
 import { isPackageUpToDate } from "../packages/pkg-utils";
+import withDelay from "$libs/utils/delay";
 
 const packageRefreshInterval = 1000 * 60 * 60; // 1 hour
 
@@ -254,11 +255,11 @@ To read more about this package go to [${guiPkg.homepage}](${guiPkg.homepage}).
         await deletePkg(pkg, v);
       }
 
-      setTimeout(() => {
+      await withDelay(() => {
         updatePackage(pkg.full_name, {
           installed_versions: []
         });
-      }, 3000);
+      }, 1000);
     } catch (error) {
       log.error(error);
       notificationStore.add({

modules/desktop/src/libs/utils/delay.ts

@@ -0,0 +1,5 @@
+// withDelay adds a delay before calling the provided function.
+export default async function withDelay<T>(f: () => T, delayMs: number) {
+  await new Promise((resolve) => setTimeout(resolve, delayMs));
+  return f();
+}