From 38db04f8aef914e09f580b78f93bce1e503744be Mon Sep 17 00:00:00 2001
From: Kloon ImKloon <kloon15@gmail.com>
Date: Sun, 1 Oct 2023 14:57:02 +0200
Subject: [PATCH] Show toast for other errors in Login

---
 frontend/src/api/utils.ts    |  6 +++++-
 frontend/src/utils/auth.ts   | 12 +++++++++---
 frontend/src/views/Login.vue | 19 +++++++++++++------
 3 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/frontend/src/api/utils.ts b/frontend/src/api/utils.ts
index 9d116132..7008e28a 100644
--- a/frontend/src/api/utils.ts
+++ b/frontend/src/api/utils.ts
@@ -42,7 +42,11 @@ export async function fetchURL(
   }
 
   if (res.status < 200 || res.status > 299) {
-    const error = new StatusError(await res.text(), res.status);
+    const body = await res.text();
+    const error = new StatusError(
+      body || `${res.status} ${res.statusText}`,
+      res.status
+    );
 
     if (auth && res.status == 401) {
       logout();
diff --git a/frontend/src/utils/auth.ts b/frontend/src/utils/auth.ts
index 538c8ee1..9db4f315 100644
--- a/frontend/src/utils/auth.ts
+++ b/frontend/src/utils/auth.ts
@@ -48,7 +48,10 @@ export async function login(
   if (res.status === 200) {
     parseToken(body);
   } else {
-    throw new StatusError(body, res.status);
+    throw new StatusError(
+      body || `${res.status} ${res.statusText}`,
+      res.status
+    );
   }
 }
 
@@ -65,7 +68,10 @@ export async function renew(jwt: string) {
   if (res.status === 200) {
     parseToken(body);
   } else {
-    throw new StatusError(body, res.status);
+    throw new StatusError(
+      body || `${res.status} ${res.statusText}`,
+      res.status
+    );
   }
 }
 
@@ -81,7 +87,7 @@ export async function signup(username: string, password: string) {
   });
 
   if (res.status !== 200) {
-    throw new StatusError(res.statusText, res.status);
+    throw new StatusError(`${res.status} ${res.statusText}`, res.status);
   }
 }
 
diff --git a/frontend/src/views/Login.vue b/frontend/src/views/Login.vue
index 4786b218..5804789a 100644
--- a/frontend/src/views/Login.vue
+++ b/frontend/src/views/Login.vue
@@ -42,6 +42,7 @@
 </template>
 
 <script setup lang="ts">
+import { StatusError } from "@/api/utils";
 import * as auth from "@/utils/auth";
 import {
   name,
@@ -50,7 +51,7 @@ import {
   recaptchaKey,
   signup,
 } from "@/utils/constants";
-import { onMounted, ref } from "vue";
+import { inject, onMounted, ref } from "vue";
 import { useI18n } from "vue-i18n";
 import { useRoute, useRouter } from "vue-router";
 
@@ -67,6 +68,8 @@ const { t } = useI18n({});
 // Define functions
 const toggleMode = () => (createMode.value = !createMode.value);
 
+const $showError = inject<IToastError>("$showError")!;
+
 const submit = async (event: Event) => {
   event.preventDefault();
   event.stopPropagation();
@@ -98,11 +101,15 @@ const submit = async (event: Event) => {
     await auth.login(username.value, password.value, captcha);
     router.push({ path: redirect });
   } catch (e: any) {
-    console.error(e);
-    if (e.message == 409) {
-      error.value = t("login.usernameTaken");
-    } else {
-      error.value = t("login.wrongCredentials");
+    // console.error(e);
+    if (e instanceof StatusError) {
+      if (e.status === 409) {
+        error.value = t("login.usernameTaken");
+      } else if (e.status === 403) {
+        error.value = t("login.wrongCredentials");
+      } else {
+        $showError(e);
+      }
     }
   }
 };