404 on invalid user

4 files changed, 45 insertions, 15 deletions

diff --git a/src/hooks/index.js b/src/hooks/index.js
index 6a9c8ec5..2284d88d 100644
--- a/src/hooks/index.js
+++ b/src/hooks/index.js
@@ -1,6 +1,10 @@
 import cookie from 'cookie';
+import { get } from '$lib/utils';
+import { protectedRoutes } from '$lib/utils';
+
 export async function handle({ event, resolve }) {
 	let {
+		params,
 		request: { headers }
 	} = event;
 
@@ -8,6 +12,11 @@ export async function handle({ event, resolve }) {
 	let { token } = cookies;
 	event.locals = { token };
 
+	if (protectedRoutes.find((p) => event.url.pathname.match(p))) {
+		let user = await get('/me', { accept: 'application/json', authorization: `Bearer ${token}` });
+		if (user.username !== params.username) throw new Error('user not found');
+	}
+
 	return resolve(event);
 }
 
diff --git a/src/lib/utils.js b/src/lib/utils.js
index b80a548b..db8a490a 100644
--- a/src/lib/utils.js
+++ b/src/lib/utils.js
@@ -6,10 +6,8 @@ export function scroll(section) {
 
 const base = browser ? '' : import.meta.env.VITE_COINOS_URL;
 
-export const get = (url) =>
-	fetch(base + url, {
-		headers: { accept: 'application/json' }
-	})
+export const get = (url, headers = { accept: 'application/json' }) =>
+	fetch(base + url, { headers })
 		.then((r) => r.text())
 		.then((body) => {
 			try {
@@ -38,3 +36,5 @@ export function reverseFormat(val, locale) {
 	reversedVal = reversedVal.replace(new RegExp('\\' + decimal, 'g'), '.');
 	return Number.isNaN(reversedVal) ? 0 : +reversedVal;
 }
+
+export let protectedRoutes = [/receive/, /customers/, /dashboard/, /settings/, /transactions/];
diff --git a/src/routes/[username]/index.svelte b/src/routes/[username]/index.svelte
index 6e3978ad..6002efdc 100644
--- a/src/routes/[username]/index.svelte
+++ b/src/routes/[username]/index.svelte
@@ -47,7 +47,6 @@
 	};
 </script>
 
-<!-- need to update this IF statement to only show if the username matches a user in the DB -->
 {#if username}
 	<AppHeader avatarPosition="left-[calc(15vw-48px)]" />
 
diff --git a/src/routes/__error.svelte b/src/routes/__error.svelte
index 6cdeeac7..2d617f9d 100644
--- a/src/routes/__error.svelte
+++ b/src/routes/__error.svelte
@@ -1,16 +1,38 @@
+<script context="module">
+	export function load({ error, status }) {
+		if (error.message.includes('not found')) {
+			error.message = 'Page not found';
+			status = 404;
+		}
+
+		return {
+			props: {
+				error,
+				status
+			}
+		};
+	}
+</script>
+
 <script>
-	import { Icon } from '$comp';
+	import { Icon, PageNotFound } from '$comp';
+	export let status, error;
 </script>
 
-<div class="flex justify-center items-center mt-20">
-	<div class="space-y-5 text-center">
-		<a href="/">
-			<Icon icon="logo" />
-		</a>
+{#if status === 404}
+	<PageNotFound />
+{:else}
+	<div class="flex justify-center items-center mt-20">
+		<div class="space-y-5 text-center">
+			<a href="/">
+				<Icon icon="logo" />
+			</a>
 
-		<Icon icon="error" style="mx-auto w-full" />
+			<Icon icon="error" style="mx-auto w-full" />
 
-		<h1 class="font-bold text-5xl">Error</h1>
-		<p>Please try again or contact support.</p>
+			<h1 class="font-bold text-5xl">Error</h1>
+			<p>{error.message}</p>
+			<p>Please try again or contact support.</p>
+		</div>
 	</div>
-</div>
+{/if}