eslint.config.js

@@ -30,5 +30,17 @@ export default ts.config(
 				parser: ts.parser,
 			},
 		},
+	},
+	{
+		rules: {
+			'@typescript-eslint/no-unused-vars': [
+				'error',
+				{
+					argsIgnorePattern: '^_',
+					varsIgnorePattern: '^_',
+					caughtErrorsIgnorePattern: '^_',
+				},
+			],
+		},
 	}
 );

src/lib/components/Navigation/Navbar/Navbar.svelte

@@ -1,11 +1,13 @@
 <script lang="ts">
-	let { title }: { title: string } = $props();
+	let { title, username }: { title: string; username: string } = $props();
+
+	let greeting = $derived(`Welcome ${username}!`);
 </script>
 
 <header class="navbar justify-between bg-base-200 px-4">
 	<h2 class="prose prose-xl">Hestia</h2>
 	<h1 class="prose prose-2xl">{title}</h1>
-	<p class="prose prose-lg">Welcome!</p>
+	<p class="prose prose-lg">{greeting}</p>
 </header>
 
 <style>

src/routes/+page.server.ts

@@ -1,5 +1,6 @@
 import { prisma } from '$lib/server/prisma';
 import { redirect } from '@sveltejs/kit';
+
 export async function load(event) {
 	const sessionId = event.cookies.get('auth_session');
 	if (!sessionId) {
@@ -11,7 +12,7 @@ export async function load(event) {
 		},
 	});
 	if (!user) {
-		redirect(401, '/login');
+		redirect(300, '/login');
 	}
 	return {};
 }

src/routes/+page.svelte

@@ -19,4 +19,4 @@
 	.site-loader {
 		@apply flex h-screen w-screen flex-col items-center justify-center gap-6;
 	}
-</style>
+</style>

src/routes/app/+layout.server.ts

@@ -0,0 +1,26 @@
+import { prisma } from '$lib/server/prisma';
+import { redirect } from '@sveltejs/kit';
+import dayjs from 'dayjs';
+
+export async function load(event) {
+	const sessionId = event.cookies.get('auth_session');
+	if (!sessionId) {
+		redirect(300, '/login');
+	}
+	const session = await prisma.session.findUnique({
+		where: { id: sessionId },
+		include: { user: true },
+	});
+	if (!session) {
+		redirect(300, '/login');
+	}
+	const expiry = session.expiresAt;
+	if (dayjs(expiry).isBefore(dayjs())) {
+		redirect(300, '/login');
+	}
+
+	const { password: _, ...rest } = session.user;
+	return {
+		user: rest,
+	};
+}

src/routes/app/+layout.svelte

@@ -1,8 +1,17 @@
 <script lang="ts">
 	import { Navbar } from '$lib/components/Navigation';
+	import type { User } from '@prisma/client';
+	import type { Snippet } from 'svelte';
 
-	let { children } = $props();
+	type Props = {
+		children: Snippet;
+		data: {
+			user: Omit<User, 'password'>;
+		};
+	};
+
+	let { children, data }: Props = $props();
 </script>
 
-<Navbar title="Svelte" />
-{@render children()}
+<Navbar title="Svelte" username={data.user.name} />
+{@render children()}

src/routes/app/+page.svelte

@@ -0,0 +1,2 @@
+<script lang="ts">
+</script>