Remove saved account on incorrect password

src/components/dialogs/SendBoopDialog.vue

@@ -33,7 +33,7 @@
                 style="
                     display: grid;
                     grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
-                    gap: 15px;
+                    gap: 5px;
                     margin-top: 10px;
                     max-height: 600px;
                     overflow-y: auto;

src/components/dialogs/WorldDialog/WorldDialog.vue

@@ -23,7 +23,7 @@
                                         currentUser.$homeLocation &&
                                         currentUser.$homeLocation.worldId === worldDialog.id
                                     "
-                                    style="margin-right: 5px" />
+                                    class="inline-block" />
                                 {{ worldDialog.ref.name }}
                             </span>
                         </div>

src/stores/auth.js

@@ -447,59 +447,40 @@ export const useAuthStore = defineStore('Auth', () => {
             AppDebug.endpointDomain = AppDebug.endpointDomainVrchat;
             AppDebug.websocketDomain = AppDebug.websocketDomainVrchat;
         }
-        return new Promise((resolve, reject) => {
+
-            loginForm.value.loading = true;
+        loginForm.value.loading = true;
+        try {
+            let password = loginParams.password;
             if (advancedSettingsStore.enablePrimaryPassword) {
-                checkPrimaryPassword(loginParams)
+                try {
-                    .then((pwd) => {
+                    password = await checkPrimaryPassword(loginParams);
-                        return authRequest
+                } catch (err) {
-                            .getConfig()
+                    toast.error('Incorrect primary password');
-                            .catch((err) => {
+                    throw err;
-                                reject(err);
+                }
-                            })
-                            .then(() => {
-                                authLogin({
-                                    username: loginParams.username,
-                                    password: pwd,
-                                    cipher: loginParams.password,
-                                    endpoint: loginParams.endpoint,
-                                    websocket: loginParams.websocket
-                                })
-                                    .catch((err2) => {
-                                        reject(err2);
-                                    })
-                                    .then(() => {
-                                        resolve();
-                                    });
-                            });
-                    })
-                    .catch((_) => {
-                        toast.error('Incorrect primary password');
-                        reject(_);
-                    });
-            } else {
-                authRequest
-                    .getConfig()
-                    .catch((err) => {
-                        reject(err);
-                    })
-                    .then(() => {
-                        authLogin({
-                            username: loginParams.username,
-                            password: loginParams.password,
-                            endpoint: loginParams.endpoint,
-                            websocket: loginParams.websocket
-                        })
-                            .catch((err2) => {
-                                handleLogoutEvent();
-                                reject(err2);
-                            })
-                            .then(() => {
-                                resolve();
-                            });
-                    });
             }
-        }).finally(() => (loginForm.value.loading = false));
+
+            await authRequest.getConfig();
+            try {
+                await authLogin({
+                    username: loginParams.username,
+                    password,
+                    endpoint: loginParams.endpoint,
+                    websocket: loginParams.websocket
+                });
+            } catch (err) {
+                await handleLogoutEvent();
+                throw err;
+            }
+        } catch (err) {
+            if (err.message.includes('Invalid Username/Email or Password')) {
+                toast.error('Saved credentials are no longer valid.');
+                await deleteSavedLogin(user.user.id);
+            }
+            throw err;
+        } finally {
+            loginForm.value.loading = false;
+        }
     }
 
     async function deleteSavedLogin(userId) {

src/views/Login/Login.vue

@@ -1,17 +1,17 @@
 <template>
-    <div style="float: left; margin: 5px">
-        <TooltipWrapper v-if="!noUpdater" side="top" :content="t('view.login.updater')">
-            <Button class="rounded-full mr-2 text-xs" size="icon-sm" variant="ghost" @click="showVRCXUpdateDialog"
-                ><CircleArrowDown
-            /></Button>
-        </TooltipWrapper>
-        <TooltipWrapper side="top" :content="t('view.login.proxy_settings')">
-            <Button class="rounded-full text-xs" size="icon-sm" variant="ghost" @click="promptProxySettings"
-                ><Route
-            /></Button>
-        </TooltipWrapper>
-    </div>
     <div class="x-login-container">
+        <div style="position: absolute; top: 0; left: 0; margin: 5px">
+            <TooltipWrapper v-if="!noUpdater" side="top" :content="t('view.login.updater')">
+                <Button class="rounded-full mr-2 text-xs" size="icon-sm" variant="ghost" @click="showVRCXUpdateDialog"
+                    ><CircleArrowDown
+                /></Button>
+            </TooltipWrapper>
+            <TooltipWrapper side="top" :content="t('view.login.proxy_settings')">
+                <Button class="rounded-full text-xs" size="icon-sm" variant="ghost" @click="promptProxySettings"
+                    ><Route
+                /></Button>
+            </TooltipWrapper>
+        </div>
         <div class="x-login">
             <div class="x-login-form-container">
                 <div>
@@ -285,6 +285,15 @@
         }
     );
 
+    watch(
+        () => loginForm.value.loading,
+        (loading) => {
+            if (!loading) {
+                updateSavedCredentials();
+            }
+        }
+    );
+
     onBeforeMount(async () => {
         updateSavedCredentials();
     });