handle login/registration errors

7 files changed, 25 insertions, 12 deletions

diff --git a/src/components/RegisterOrLogin.svelte b/src/components/RegisterOrLogin.svelte
index de886314..0b954387 100644
--- a/src/components/RegisterOrLogin.svelte
+++ b/src/components/RegisterOrLogin.svelte
@@ -1,4 +1,5 @@
 <script>
+	import { fly } from 'svelte/transition';
 	import { enhance } from '$app/forms';
 	import { Icon } from '$comp';
 	import { focus } from '$lib/utils';
@@ -33,7 +34,9 @@
 			<h1 class="text-2xl font-bold text-center">{$t('login.' + pageID)}</h1>
 
 			{#if form?.error}
-				Login failed
+				<div class="text-red-600 text-center" in:fly>
+					{form.error}
+				</div>
 			{/if}
 
 			<form class="space-y-5" {action} method="POST" use:enhance>
diff --git a/src/lib/utils.js b/src/lib/utils.js
index baf2176d..65d42ffb 100644
--- a/src/lib/utils.js
+++ b/src/lib/utils.js
@@ -98,6 +98,7 @@ export const info = (m) => {
 export const login = async (user, cookies) => {
 	let maxAge = 30 * 24 * 60 * 60;
 	let { token } = await post('/login', user);
+  if (!token) throw new Error("Login failed");
 
 	let expires = new Date();
 	expires.setSeconds(expires.getSeconds() + maxAge);
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index 2fefcd81..d561b111 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -2,6 +2,7 @@
 	import { page } from '$app/stores';
 	import { Icon, PageNotFound } from '$comp';
 	import { t } from '$lib/translations';
+	import { back } from '$lib/utils';
 
 	export let data;
 	let { user } = data;
@@ -17,10 +18,9 @@
 
 		<p class="px-1 break-all mb-8">{$page.error.message}</p>
 
-		<a href={`/${user.username}/dashboard`}>
-			<button class="rounded-full bg-black text-white py-2 px-5 font-bold hover:opacity-80 mb-2"
-				>Go Home</button
-			>
-		</a>
+		<button
+			class="rounded-full bg-black text-white py-2 px-5 font-bold hover:opacity-80 mb-2"
+			on:click={back}>Back</button
+		>
 	</div>
 {/if}
diff --git a/src/routes/login/+page.server.js b/src/routes/login/+page.server.js
index d26d16ed..750933a0 100644
--- a/src/routes/login/+page.server.js
+++ b/src/routes/login/+page.server.js
@@ -7,8 +7,10 @@ export const actions = {
 		try {
 			await login(user, cookies);
 		} catch (e) {
-			return invalid(400, { message: 'Login failed' });
+      console.log("fail")
+			return invalid(400, { error: 'Login failed' });
 		}
+    console.log("succ")
 
 		throw redirect(303, `/${user.username}/dashboard`);
 	}
diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte
index 9fd6438d..57b67643 100644
--- a/src/routes/login/+page.svelte
+++ b/src/routes/login/+page.svelte
@@ -1,5 +1,6 @@
 <script>
 	import { RegisterOrLogin } from '$comp';
+  export let form;
 </script>
 
-<RegisterOrLogin pageID="signIn" />
+<RegisterOrLogin pageID="signIn" bind:form />
diff --git a/src/routes/register/+page.server.js b/src/routes/register/+page.server.js
index 26f4475f..5667914b 100644
--- a/src/routes/register/+page.server.js
+++ b/src/routes/register/+page.server.js
@@ -1,4 +1,4 @@
-import { redirect } from '@sveltejs/kit';
+import { invalid, redirect } from '@sveltejs/kit';
 import { post, login } from '$lib/utils';
 
 export const actions = {
@@ -7,8 +7,13 @@ export const actions = {
 		let { username, password, redirect: r } = form;
 
 		let user = { username, password };
-		await post('/register', { user });
-		await login(user, cookies);
+
+		try {
+			await post('/register', { user });
+			await login(user, cookies);
+		} catch (e) {
+			return invalid(400, { error: e.message });
+		}
 
 		throw redirect(303, r || `/${user.username}/dashboard`);
 	}
diff --git a/src/routes/register/+page.svelte b/src/routes/register/+page.svelte
index 82acb53b..747b3f8b 100644
--- a/src/routes/register/+page.svelte
+++ b/src/routes/register/+page.svelte
@@ -1,5 +1,6 @@
 <script>
 	import { RegisterOrLogin } from '$comp';
+  export let form;
 </script>
 
-<RegisterOrLogin pageID="register" />
+<RegisterOrLogin pageID="register" bind:form />