disable futher actions when launching

src/App.svelte

@@ -12,7 +12,7 @@
     UserSettingsSolid,
   } from "flowbite-svelte-icons";
   import ezppLogo from "../public/favicon.png";
-  import { currentPage, currentUser } from "./storage/localStore";
+  import { currentPage, currentUser, launching } from "./storage/localStore";
   import { Page } from "./consts/pages";
   import Login from "./pages/Login.svelte";
   import Launch from "./pages/Launch.svelte";
@@ -65,7 +65,9 @@
       </DropdownHeader>
       <DropdownItem
         class="flex flex-row gap-2 border-0 dark:!bg-gray-700 dark:active:!bg-gray-900 dark:hover:!bg-gray-800 transition-colors"
-        on:click={() => currentPage.set(Page.Settings)}
+        on:click={() => {
+          if (!$launching) currentPage.set(Page.Settings);
+        }}
       >
         <UserSettingsSolid class="select-none outline-none border-none" />
         Settings
@@ -74,7 +76,9 @@
       {#if loggedIn}
         <DropdownItem
           class="flex flex-row gap-2 border-0 dark:!bg-gray-700 dark:active:!bg-gray-900 dark:hover:!bg-gray-800 transition-colors"
-          on:click={logout}
+          on:click={() => {
+            if (!$launching) logout();
+          }}
         >
           <ArrowRightFromBracketSolid
             class="select-none outline-none border-none"
@@ -84,7 +88,9 @@
       {:else}
         <DropdownItem
           class="flex flex-row gap-2 border-0 dark:!bg-gray-700 dark:active:!bg-gray-900 dark:hover:!bg-gray-800 transition-colors"
-          on:click={() => currentPage.set(Page.Login)}
+          on:click={() => {
+            if (!$launching) currentPage.set(Page.Login);
+          }}
         >
           <ArrowRightToBracketSolid
             class="select-none outline-none border-none"

src/pages/Launch.svelte

@@ -1,9 +1,8 @@
 <script lang="ts">
   import { Button, Checkbox } from "flowbite-svelte";
   import Progressbar from "../lib/Progressbar.svelte";
+  import { launching, patch } from "./../storage/localStore";
   let progressbarFix = true;
-  let launching = false;
-  let patch = true;
 
   setTimeout(() => {
     progressbarFix = false;
@@ -19,15 +18,19 @@
     <Button
       color="light"
       size="xl"
-      class="dark:active:!bg-gray-900 {launching
+      class="dark:active:!bg-gray-900 {$launching
         ? ''
         : 'active:scale-95 '}transition-transform duration-75"
-      disabled={launching}
+      disabled={$launching}
-      on:click={() => (launching = !launching)}>Launch</Button
+      on:click={() => launching.set(!$launching)}>Launch</Button
+    >
+    <Checkbox
+      disabled={$launching}
+      bind:checked={$patch}
+      on:click={() => patch.set(!$patch)}>Patch</Checkbox
     >
-    <Checkbox disabled={launching} bind:checked={patch}>Patch</Checkbox>
     <div
-      class="w-full flex flex-col justify-center items-center gap-2 mt-2 {launching
+      class="w-full flex flex-col justify-center items-center gap-2 mt-2 {$launching
         ? 'animate-fadeIn '
         : 'animate-fadeOut '}{progressbarFix ? '!opacity-0' : 'opacity-0'}"
     >

src/storage/localStore.ts

@@ -3,5 +3,7 @@ import { Page } from "../consts/pages";
 import type { User } from "../types/user";
 
 export const startup = writable(false);
+export const launching = writable(false);
+export const patch = writable(true);
 export const currentUser: Writable<undefined | User> = writable(undefined);
 export const currentPage = writable(Page.Login);