allow account selection during creation

gorilla-devs · Nov 18, 2024 · 08c1502 · 08c1502
1 parent 40c1edf
commit 08c1502
Show file tree

Hide file tree

Showing 5 changed files with 69 additions and 17 deletions.
diff --git a/apps/desktop/packages/mainWindow/src/pages/Login/GDLAccount.tsx b/apps/desktop/packages/mainWindow/src/pages/Login/GDLAccount.tsx
@@ -1,7 +1,7 @@
-import { createEffect, Show, Suspense } from "solid-js";
+import { createEffect, Match, Show, Suspense, Switch } from "solid-js";
 import { Trans, useTransContext } from "@gd/i18n";
-import { rspc } from "@/utils/rspcClient";
-import { Collapsable } from "@gd/ui";
+import { port, rspc } from "@/utils/rspcClient";
+import { Collapsable, Dropdown } from "@gd/ui";
 
 type Props = {
   activeUuid: string | null | undefined;
@@ -10,6 +10,10 @@ type Props = {
 const GDLAccount = (props: Props) => {
   const [t] = useTransContext();
 
+  const setActiveAccountMutation = rspc.createMutation(() => ({
+    mutationKey: ["account.setActiveUuid"]
+  }));
+
   const accounts = rspc.createQuery(() => ({
     queryKey: ["account.getAccounts"]
   }));
@@ -41,9 +45,66 @@ const GDLAccount = (props: Props) => {
     }
   });
 
+  const accountOptions = () => {
+    return accounts.data?.map((account) => {
+      return {
+        label: (
+          <div
+            class="flex justify-between items-center gap-4"
+            onClick={() => {
+              setActiveAccountMutation.mutate(account.uuid);
+            }}
+          >
+            <div class="flex items-center gap-4">
+              <img
+                src={`http://127.0.0.1:${port}/account/headImage?uuid=${account.uuid}`}
+                class="w-6 h-6 rounded-md"
+              />
+              <div class="truncate max-w-30">{account.username}</div>
+            </div>
+            <div class="flex items-center gap-2">
+              <Switch>
+                <Match when={account.type.type === "microsoft"}>
+                  <div class="w-4 h-4 i-ri:microsoft-fill" />
+                </Match>
+                <Match when={account.type.type === "offline"}>
+                  <div class="w-4 h-4 i-ri:computer-line" />
+                </Match>
+              </Switch>
+              <Switch>
+                <Match when={account.status === "ok"}>
+                  <div class="w-4 h-4 text-green-500 i-ri:check-fill" />
+                </Match>
+                <Match when={account.status === "expired"}>
+                  <div class="w-4 h-4 text-yellow-500 i-ri:alert-fill" />
+                </Match>
+                <Match when={account.status === "refreshing"}>
+                  <div class="w-4 h-4 text-yellow-500 i-ri:loader-4-fill" />
+                </Match>
+                <Match when={account.status === "invalid"}>
+                  <div class="w-4 h-4 text-red-500 i-ri:close-fill" />
+                </Match>
+              </Switch>
+            </div>
+          </div>
+        ),
+        key: account?.uuid
+      };
+    });
+  };
+
   return (
     <Suspense>
-      <div class="flex flex-col h-full w-full text-center">
+      <div class="flex flex-col h-full w-full text-center pt-2 box-border">
+        <div class="flex items-center justify-center gap-4">
+          <div>
+            <Trans key="login.link_account" />
+          </div>
+          <Dropdown
+            options={accountOptions() || []}
+            value={currentlySelectedAccount()?.uuid}
+          />
+        </div>
         <Show when={gdlUser.data}>
           <div class="flex-1 px-4">
             <h2>
@@ -59,7 +120,6 @@ const GDLAccount = (props: Props) => {
             </p>
           </div>
         </Show>
-
         <Show when={!gdlUser.data}>
           <div class="flex-1 px-4">
             <h2>

diff --git a/apps/desktop/packages/mainWindow/src/pages/Login/index.tsx b/apps/desktop/packages/mainWindow/src/pages/Login/index.tsx
@@ -500,7 +500,7 @@ export default function Login() {
                       i() + 1 < step() &&
                       (step() > Steps.CodeStep
                         ? i() + 1 > Steps.CodeStep
-                        : step() > Steps.Auth &&
+                        : step() >= Steps.Auth &&
                             searchParams.addMicrosoftAccount
                           ? false
                           : true)

diff --git a/apps/desktop/packages/mainWindow/src/pages/Settings/Accounts.tsx b/apps/desktop/packages/mainWindow/src/pages/Settings/Accounts.tsx
@@ -362,16 +362,7 @@ const Accounts = () => {
                       navigate("/");
                     }}
                   >
-                    <Trans
-                      key="settings:add_gdl_account"
-                      options={{
-                        accountName: globalStore.accounts.data?.find(
-                          (account) =>
-                            account.uuid ===
-                            globalStore.currentlySelectedAccountUuid.data
-                        )?.username
-                      }}
-                    />
+                    <Trans key="settings:link_gdl_account" />
                   </Button>
                 </div>
               </Match>

diff --git a/packages/i18n/locale/english/common.json b/packages/i18n/locale/english/common.json
@@ -72,6 +72,7 @@
   "login.next": "Next",
   "login.prev": "Prev",
   "login.register": "Register",
+  "login.link_account": "Link Account",
   "login.request_email_change": "Request Email Change",
   "login.sync_gdl_account": "Sync GDL Account",
   "login.manage": "Manage",

diff --git a/packages/i18n/locale/english/settings.json b/packages/i18n/locale/english/settings.json
@@ -56,7 +56,7 @@
   "remove_ms_account_with_gdl_account_removal_description": "This Microsoft account has been linked to a GDLauncher account. If you remove this account, you will also be logged out of the GDLauncher account and data will not continue to be synced.",
   "confirm_removal": "Confirm Removal",
   "cannot_request_deletion_for_time": "Wait {{time}} before requesting again",
-  "add_gdl_account": "Add GDLauncher Account ({{accountName}})",
+  "link_gdl_account": "Link GDLauncher Account",
   "log_out_gdl_account": "Log Out GDLauncher Account",
   "minecraft_accounts": "Minecraft Accounts",
   "uuid": "UUID",