From 203c24d2da82841cae0b5c29708d07ebce1efb85 Mon Sep 17 00:00:00 2001 From: HsiangNianian Date: Tue, 13 Jan 2026 19:20:24 +0800 Subject: refactor: clean up comments and improve code formatting in authentication and login UI --- ui/src/App.svelte | 423 ++++++++++++++++++++++++++++++++++-------------------- 1 file changed, 268 insertions(+), 155 deletions(-) (limited to 'ui/src/App.svelte') diff --git a/ui/src/App.svelte b/ui/src/App.svelte index c3848b2..914a5ea 100644 --- a/ui/src/App.svelte +++ b/ui/src/App.svelte @@ -60,7 +60,7 @@ // Login UI State let isLoginModalOpen = false; - let loginMode: 'select' | 'offline' | 'microsoft' = 'select'; + let loginMode: "select" | "offline" | "microsoft" = "select"; let offlineUsername = ""; let deviceCodeData: DeviceCodeResponse | null = null; let msLoginLoading = false; @@ -113,13 +113,13 @@ function openLoginModal() { if (currentAccount) { if (confirm("Logout " + currentAccount.username + "?")) { - invoke("logout").then(() => currentAccount = null); + invoke("logout").then(() => (currentAccount = null)); } return; } // Reset state isLoginModalOpen = true; - loginMode = 'select'; + loginMode = "select"; offlineUsername = ""; deviceCodeData = null; msLoginLoading = false; @@ -129,56 +129,110 @@ isLoginModalOpen = false; } - async function performOfflineLogin() { + async function performOfflineLogin() { if (!offlineUsername) return; try { - currentAccount = await invoke("login_offline", { username: offlineUsername }) as Account; + currentAccount = (await invoke("login_offline", { + username: offlineUsername, + })) as Account; isLoginModalOpen = false; } catch (e) { alert("Login failed: " + e); } } + let pollInterval: any; + + // Cleanup on destroy/close + function stopPolling() { + if (pollInterval) { + clearInterval(pollInterval); + pollInterval = null; + } + } + async function startMicrosoftLogin() { - loginMode = 'microsoft'; + loginMode = "microsoft"; msLoginLoading = true; + stopPolling(); // Ensure no duplicates + try { - deviceCodeData = await invoke("start_microsoft_login") as DeviceCodeResponse; - + deviceCodeData = (await invoke( + "start_microsoft_login" + )) as DeviceCodeResponse; + // UX Improvements: Auto Copy & Auto Open if (deviceCodeData) { - try { - await navigator.clipboard.writeText(deviceCodeData.user_code); - // alert("Code copied to clipboard: " + deviceCodeData.user_code); - } catch (e) { console.error("Clipboard failed", e); } - - openLink(deviceCodeData.verification_uri); + try { + await navigator.clipboard.writeText(deviceCodeData.user_code); + } catch (e) { + console.error("Clipboard failed", e); + } + + openLink(deviceCodeData.verification_uri); + + // Start Polling + console.log("Starting polling for token..."); + const intervalMs = (deviceCodeData.interval || 5) * 1000; + pollInterval = setInterval( + () => checkLoginStatus(deviceCodeData!.device_code), + intervalMs + ); } - - } catch(e) { - alert("Failed to start Microsoft login: " + e); - loginMode = 'select'; // Go back + } catch (e) { + alert("Failed to start Microsoft login: " + e); + loginMode = "select"; // Go back } finally { - msLoginLoading = false; + msLoginLoading = false; } } - - async function completeMicrosoftLogin() { - if(!deviceCodeData) return; - msLoginLoading = true; + + async function checkLoginStatus(deviceCode: string) { + console.log("Polling Microsoft API..."); try { - currentAccount = await invoke("complete_microsoft_login", { deviceCode: deviceCodeData.device_code }) as Account; - isLoginModalOpen = false; - } catch(e) { - alert("Login failed: " + e + "\n\nMake sure you authorized the app in your browser."); - // If it fails, users often want to retry checking without restarting the flow - } finally { - msLoginLoading = false; + // This will fail with "authorization_pending" until user logs in + currentAccount = (await invoke("complete_microsoft_login", { + deviceCode, + })) as Account; + + // If success: + console.log("Login Successful!", currentAccount); + stopPolling(); + isLoginModalOpen = false; + status = "Welcome back, " + currentAccount.username; + } catch (e: any) { + const errStr = e.toString(); + if (errStr.includes("authorization_pending")) { + console.log("Status: Waiting for user to authorize..."); + } else { + // Real error + console.error("Polling Error:", errStr); + // Optional: Stop polling on fatal errors? + // expired_token should stop it. + if ( + errStr.includes("expired_token") || + errStr.includes("access_denied") + ) { + stopPolling(); + alert("Login failed: " + errStr); + loginMode = "select"; + } + } } } + // Clean up manual button to just be a status indicator or 'Retry Now' + async function completeMicrosoftLogin() { + if (deviceCodeData) checkLoginStatus(deviceCodeData.device_code); + } + + function closeLoginModal() { + stopPolling(); + isLoginModalOpen = false; + } + function openLink(url: string) { - open(url); + open(url); } async function startGame() { @@ -342,79 +396,94 @@ {:else if currentView === "settings"}
-

Settings

- -
- -
- -
- -
-

The command or path to the Java Runtime Environment.

-
+

Settings

+ +
+ +
+ +
+ +
+

+ The command or path to the Java Runtime Environment. +

+
- -
- - -
-
- - -
-
- - -
-
+ +
+ + +
+
+ +
- - -
- -
-
- - -
-
- - -
-
+
+ +
+
+
-
- + +
+ +
+
+ + +
+
+ +
+
+ +
+ +
+
{/if}
@@ -504,71 +573,115 @@ {#if isLoginModalOpen} -
-
- +
+

Login

-
- {#if loginMode === 'select'} -
- - -
-
-
OR
-
- -
- e.key === 'Enter' && performOfflineLogin()} /> - -
+ {#if loginMode === "select"} +
+ + +
+
+
+
+
+ OR +
- {:else if loginMode === 'microsoft'} -
- {#if msLoginLoading && !deviceCodeData} -
Starting login flow...
- {:else if deviceCodeData} -
-

1. Go to this URL:

- - -

2. Enter this code:

-
navigator.clipboard.writeText(deviceCodeData?.user_code || '')}> - {deviceCodeData.user_code} -
-

Click code to copy

- -
- {#if msLoginLoading} - - {:else} - - {/if} -
- - -
- {/if} +
+ e.key === "Enter" && performOfflineLogin()} + /> +
+
+ {:else if loginMode === "microsoft"} +
+ {#if msLoginLoading && !deviceCodeData} +
+ Starting login flow... +
+ {:else if deviceCodeData} +
+

1. Go to this URL:

+ + +

2. Enter this code:

+
+ navigator.clipboard.writeText( + deviceCodeData?.user_code || "" + )} + > + {deviceCodeData.user_code} +
+

Click code to copy

+ +
+
+
+ Waiting for authorization... +
+

This window will update automatically.

+
+ + +
+ {/if} +
{/if}
-- cgit v1.2.3-70-g09d2