From 9df6ea8847e20c52034881629a7da8c57e28a2ac Mon Sep 17 00:00:00 2001
From: Klesti Selimaj <klesti.selimay@icloud.com>
Date: Sat, 4 Apr 2026 18:06:37 +0200
Subject: [PATCH] Implementing auth

---
 src-tauri/src/launcher/auth.rs            |   7 +-
 src/components/layout/AccountDropdown.tsx | 112 +++++++++++++++++-----
 src/lib/auth.ts                           |  18 +++-
 3 files changed, 108 insertions(+), 29 deletions(-)

diff --git a/src-tauri/src/launcher/auth.rs b/src-tauri/src/launcher/auth.rs
index 45cd859..ecd74bc 100644
--- a/src-tauri/src/launcher/auth.rs
+++ b/src-tauri/src/launcher/auth.rs
@@ -4,6 +4,7 @@ use reqwest::Client;
 use tauri::command;
 
 use lyceris::auth::microsoft::{authenticate, create_link, refresh, validate, MinecraftAccount};
+use tauri_plugin_opener::open_url;
 
 use crate::launcher::LAUNCHER_DIR;
 
@@ -36,7 +37,11 @@ fn save_accounts(accounts: &[MinecraftAccount]) -> Result<(), String> {
 
 #[command]
 pub fn auth_create_link() -> Result<String, String> {
-    create_link().map_err(|e| e.to_string())
+    let link = create_link().map_err(|e| e.to_string())?;
+
+    open_url(&link, None::<String>).map_err(|e| e.to_string())?;
+
+    Ok(link)
 }
 
 #[command]
diff --git a/src/components/layout/AccountDropdown.tsx b/src/components/layout/AccountDropdown.tsx
index 6f075e3..89eebe9 100644
--- a/src/components/layout/AccountDropdown.tsx
+++ b/src/components/layout/AccountDropdown.tsx
@@ -1,6 +1,13 @@
+import { useEffect, useState } from "react";
 import { User, LogOut } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { Props } from "./props";
+import { authList, authRemove, authCreateLink } from "@/lib/auth";
+
+interface Account {
+  uuid: string;
+  username: string;
+}
 
 function UserComponent({
   username,
@@ -36,63 +43,120 @@ export default function AccountDropdown({
   setIsAccountDropdownOpen,
   accountRef,
 }: Props) {
+  const [accounts, setAccounts] = useState<Account[]>([]);
+  const [active, setActive] = useState<Account | null>(null);
+
+  // Load accounts
+  useEffect(() => {
+    loadAccounts();
+  }, []);
+
+  async function loadAccounts() {
+    const accs = await authList();
+    setAccounts(accs);
+
+    if (accs.length && !active) {
+      setActive(accs[0]); // default
+    }
+  }
+
+  // Switch account
+  function switchAccount(acc: Account) {
+    setActive(acc);
+    setIsAccountDropdownOpen(false);
+  }
+
+  // Logout (remove account)
+  async function logout() {
+    if (!active) return;
+
+    await authRemove(active.uuid);
+
+    const updated = await authList();
+    setAccounts(updated);
+    setActive(updated[0] || null);
+  }
+
+  // Add account (open Microsoft login)
+  async function addAccount() {
+    const url = await authCreateLink();
+    console.log("Opening auth URL:", url);
+  }
+
+  const otherAccounts = accounts.filter((a) => a.uuid !== active?.uuid);
+
   return (
     <div ref={accountRef} className="relative group overflow-visible">
+      {/* Glow */}
       <div className="absolute -inset-1 bg-linear-to-r from-blue-600 to-cyan-500 rounded-lg blur opacity-25 group-hover:opacity-50 transition pointer-events-none duration-700" />
 
+      {/* Button */}
       <button
         className="relative z-10 flex items-center gap-3 pl-20 pr-4 py-2 rounded-lg btn-primary"
         onClick={() => setIsAccountDropdownOpen((prev: boolean) => !prev)}
       >
         <div className="absolute -top-2 left-4 group-hover:scale-110 transition-transform duration-700 w-12 overflow-hidden z-20">
-          <img
-            src="https://render.crafty.gg/3d/bust/swight"
-            className="w-full h-full object-cover"
-          />
+          {active && (
+            <img
+              src={`https://render.crafty.gg/3d/bust/${active.uuid}`}
+              className="w-full h-full object-cover"
+            />
+          )}
+          {!active && (
+            <img
+              src={`https://render.crafty.gg/3d/bust/MHF_Steve`}
+              className="w-full h-full object-cover"
+            />
+          )}
         </div>
 
         <div className="leading-tight">
           <p className="text-[10px] text-white/80 uppercase tracking-wide">
             Playing as
           </p>
-          <p className="text-sm font-bold text-white">SaturnDev</p>
+          <p className="text-sm font-bold text-white">
+            {active?.username || "No Account"}
+          </p>
         </div>
       </button>
 
+      {/* Dropdown */}
       <div
         className={cn(
-          "absolute top-full right-0 mt-2 w-48 bg-saturn-panel border border-saturn-border rounded-lg shadow-2xl z-50 py-1 overflow-hidden transition-all duration-200 origin-top",
+          "absolute top-full right-0 mt-2 w-56 bg-saturn-panel border border-saturn-border rounded-lg shadow-2xl z-50 py-1 overflow-hidden transition-all duration-200 origin-top",
           isAccountDropdownOpen
             ? "opacity-100 scale-100 translate-y-0 pointer-events-auto"
             : "opacity-0 scale-95 -translate-y-2 pointer-events-none",
         )}
       >
         {/* Current account */}
-        <div>
+        {active && (
+          <UserComponent username={active.username} uuid={active.uuid} />
+        )}
+
+        {/* Other accounts */}
+        {otherAccounts.map((acc) => (
           <UserComponent
-            username="SaturnDev"
-            uuid="123e4567-e89b-12d3-a456-426614174000"
+            key={acc.uuid}
+            username={acc.username}
+            uuid={acc.uuid}
+            onClick={() => switchAccount(acc)}
           />
-        </div>
+        ))}
 
-        {/* Accounts (current account should be filtered) */}
-
-        <div>
-          <UserComponent
-            username="SaturnDev2"
-            uuid="123e4567-e89b-12d3-a456-426614174000"
-            onClick={() => {}}
-          />
-        </div>
-
-        {/* Account Options */}
-
-        <button className="w-full flex items-center gap-2 px-4 py-2 text-sm hover:bg-white/5 transition-colors">
+        {/* Actions */}
+        <button
+          onClick={addAccount}
+          className="w-full flex items-center gap-2 px-4 py-2 text-sm hover:bg-white/5 transition-colors"
+        >
           <User size={14} />
           <span>Add Account</span>
         </button>
 
-        <button className="w-full flex items-center gap-2 px-4 py-2 text-sm hover:bg-red-500/10 text-red-400 transition-colors">
+        <button
+          onClick={logout}
+          className="w-full flex items-center gap-2 px-4 py-2 text-sm hover:bg-red-500/10 text-red-400 transition-colors"
+        >
           <LogOut size={14} />
           <span>Logout</span>
         </button>
diff --git a/src/lib/auth.ts b/src/lib/auth.ts
index 9a7d33b..311c8ee 100644
--- a/src/lib/auth.ts
+++ b/src/lib/auth.ts
@@ -1,5 +1,15 @@
 import { invoke } from "@tauri-apps/api/core";
 
+export interface MinecraftAccount {
+  xuid: string;
+  exp: number;
+  uuid: string;
+  username: string;
+  access_token: string;
+  refresh_token: string;
+  client_id: string;
+}
+
 /**
  * Create Microsoft login URL
  */
@@ -10,21 +20,21 @@ export async function authCreateLink(): Promise<string> {
 /**
  * Exchange auth code for account
  */
-export async function authLogin(code: string) {
+export async function authLogin(code: string): Promise<MinecraftAccount> {
   return await invoke("auth_login", { code });
 }
 
 /**
  * Refresh account by UUID
  */
-export async function authRefresh(uuid: string) {
+export async function authRefresh(uuid: string): Promise<MinecraftAccount> {
   return await invoke("auth_refresh", { uuid });
 }
 
 /**
  * Get all stored accounts
  */
-export async function authList() {
+export async function authList(): Promise<MinecraftAccount[]> {
   return await invoke("auth_list");
 }
 
@@ -45,6 +55,6 @@ export async function authValidate(uuid: string): Promise<boolean> {
 /**
  * Get valid account (auto-refresh if needed)
  */
-export async function authGetValid(uuid: string) {
+export async function authGetValid(uuid: string): Promise<MinecraftAccount> {
   return await invoke("auth_get_valid", { uuid });
 }