vastly improve code of launcher ui

CCBlueX · Dec 28, 2023 · 031155a · 031155a
1 parent bf8b1b6
commit 031155a
Show file tree

Hide file tree

Showing 9 changed files with 153 additions and 197 deletions.
diff --git a/public/img/banner.png b/public/img/banner.png
diff --git a/src/lib/common/ButtonClose.svelte b/src/lib/common/ButtonClose.svelte
@@ -1,13 +1,12 @@
 <script>
-    import { invoke } from "@tauri-apps/api/tauri";
     import { appWindow } from "@tauri-apps/api/window";
 
-    function closeWindow() {
+    function handleClick() {
         appWindow.close();
     }
 </script>
 
-<button class="button-close" type="button" on:click={closeWindow}>
+<button class="button-close" type="button" on:click={handleClick}>
     <img class="icon" src="img/icon/icon-button-close.svg" alt="close">
 </button>
 

diff --git a/src/lib/login/loginmodal/LoginModal.svelte b/src/lib/login/loginmodal/LoginModal.svelte
@@ -7,49 +7,37 @@
 
     export let options;
 
-    let offlineUsername = "";
+    let offlineUsername;
+    let microsoftCode = null;
 
-    function handleOfflineLoginClick(e) {
+    async function handleOfflineLoginClick(e) {
         if (offlineUsername.length > 16 || offlineUsername.length < 1) {
             alert("Username must be between 1 and 16 characters long.");
             return;
         }
 
-        let usernameRegex = /^[a-zA-Z0-9_]+$/;
+        const usernameRegex = /^[a-zA-Z0-9_]+$/;
         if (!usernameRegex.test(offlineUsername)) {
             alert("Username can only contain letters, numbers, and underscores.");
             return;
         }
 
-        invoke("login_offline", { username: offlineUsername })
-            .then((accountData) => {
-                console.debug("login_offline", accountData)
-
-                options.currentAccount = accountData;
-                options.store();
-            })
-            .catch(e => console.error(e));
+        const accountData = await invoke("login_offline", { username: offlineUsername });
+        options.currentAccount = accountData;
+        options.store();
     }
 
-    function handleMicrosoftLoginClick(event) {
-        invoke("login_microsoft")
-            .then((account) => {
-                console.debug("microsoft authentication successful", account);
-
-                options.currentAccount = account;
-                options.store();
-            })
-            .catch(e => {
-                console.error("microsoft authentication error", e);
-                alert(e);
-            });
+    async function handleMicrosoftLoginClick(e) {
+        try {
+            const accountData = await invoke("login_microsoft");
+            options.currentAccount = accountData;
+            options.store();
+        } catch (err) {
+            alert(err);
+        }
     }
 
-    let microsoftCode;
-
     listen("microsoft_code", (e) => {
-        console.debug("microsoft_code", e.payload);
-
         microsoftCode = e.payload;
     });
 
@@ -63,7 +51,7 @@
 </script>
 
 <div class="modal">
-    {#if microsoftCode == null}
+    {#if !microsoftCode}
         <div class="title">Log in</div>
 
         <ModalInput placeholder="Username" icon="person" characterLimit={16} bind:value={offlineUsername} />

diff --git a/src/lib/login/loginmodal/ModalButton.svelte b/src/lib/login/loginmodal/ModalButton.svelte
@@ -1,7 +1,6 @@
 <script>
     import { createEventDispatcher } from "svelte";
 
-
     export let text;
     export let primary;
 

diff --git a/src/lib/main/Account.svelte b/src/lib/main/Account.svelte
@@ -9,7 +9,7 @@
 </script>
 
 <div class="account">
-    <object data="https://avatar.liquidbounce.net/avatar/{uuid}" type="image/png" class="avatar">
+    <object data="https://avatar.liquidbounce.net/avatar/{uuid}" type="image/png" class="avatar" aria-label="avatar">
         <img src="img/steve.png" alt=avatar class="avatar"/>
     </object>
     <div class="details">