Add more functionality wip

src/app.d.ts

@@ -8,8 +8,8 @@ declare global {
 		interface Locals {
 			user: {
 				isLoggedIn: boolean;
-				email: string | undefined;
+				email: string | null;
-				username: string | undefined | null;
+				username: string | null;
 			}
 		}
 		// interface PageData {}

src/hooks.server.ts

@@ -1,7 +1,7 @@
 import { db } from '$lib/server/db';
 import { sessionsTable, usersTable } from '$lib/server/db/schema';
 import { eq } from 'drizzle-orm';
-import type { Handle } from '@sveltejs/kit';
+import { redirect, type Handle } from '@sveltejs/kit';
 
 export const handle: Handle = async ({ event, resolve }) => {
     const sessionId = event.cookies.get('session_id');
@@ -28,6 +28,12 @@ export const handle: Handle = async ({ event, resolve }) => {
         }
     } 
 
+    if (event.url.pathname.startsWith("/private") && !user.isLoggedIn) {
+        redirect(307, "/error");
+    } else if (event.url.pathname.startsWith("/api") && !user.isLoggedIn) {
+        return new Response(null, { status: 401 });
+    }
+
     event.locals.user = user;
     const response = await resolve(event);
     return response;

src/routes/+page.server.ts

@@ -1,13 +1,46 @@
 import { db } from "$lib/server/db";
-import { usersTable } from "$lib/server/db/schema";
+import { sessionsTable, usersTable } from "$lib/server/db/schema";
+import { eq } from "drizzle-orm";
+import { redirect, type Actions } from "@sveltejs/kit";
 import type { PageServerLoad } from "./$types";
 
 
 export const load: PageServerLoad = async ({ locals }) => {
-    const allUsers = await db.select().from(usersTable);
+    let allUsers = null;
+    if (locals.user.isLoggedIn) {
+        allUsers = await db.select().from(usersTable);
+    }
 
     return {
         user: locals.user,
-        users: allUsers
+        users: allUsers ?? []
     }
-};
+};
+
+export const actions = {
+    logout: async ({ locals, cookies }) => {
+        const sessionId = cookies.get('session_id');
+
+        if (!sessionId) {
+            redirect(307, "/error")
+        }
+
+        await db.delete(sessionsTable).where(eq(sessionsTable.id, sessionId))
+
+        cookies.delete('session_id', { path: "/" });
+        locals.user.isLoggedIn = false;
+        locals.user.email = null;
+        locals.user.username = null;
+
+        return { success: true };
+    },
+    deleteUsers: async ({ locals, fetch }) => {
+        await fetch("/api/deleteUsers");
+
+        locals.user.isLoggedIn = false;
+        locals.user.email = null;
+        locals.user.username = null;
+
+        return { success: true }
+    }
+} satisfies Actions;

src/routes/+page.svelte

@@ -2,10 +2,7 @@
 	import { goto } from '$app/navigation';
 	import type { PageProps } from './$types';
 
-	let { data }: PageProps = $props();
+	let { data, form }: PageProps = $props();
-
-	let users = $state(data.users);
-	let user = $state(data.user);
 </script>
 
 <h1>Welcome to SvelteKit</h1>
@@ -16,20 +13,21 @@
 	<label>Username: <input type="text" bind:value={username} /></label>
 </div> -->
 
-{#if !user.isLoggedIn}
+{#if form?.success}
+	<p>Successfully logged out</p>
+{/if}
+
+{#if !data.user.isLoggedIn}
 	<button onclick={async () => await goto('/login')}> Login </button>
 {:else}
-	<h2>Hello {user.username}</h2>
+	<h2>Hello {data.user.username}</h2>
-	<button
+	<form method="POST" action="?/logout">
-		onclick={async () => {
+		<button type="submit">Logout</button>
-			user.username = "";
+	</form>
-			user.email = "";
+
-			user.isLoggedIn = false;
+	<form method="POST" action="?/deleteUsers">
-			await goto('/logout');
+		<button type="submit">Delete all Users</button>
-		}}
+	</form>
-	>
-		Logout
-	</button>
 {/if}
 <!-- 
 <button
@@ -56,18 +54,8 @@
 	}}>Create User</button
 > -->
 
-<button
-	onclick={async () => {
-		const response = await fetch('/api/deleteUsers', {
-			method: 'POST'
-		});
-
-		users.splice(0, users.length);
-	}}>Delete all Users</button
->
-
 <ul>
-	{#each users as user (user.email)}
+	{#each data.users as user (user.email)}
 		<li>
 			{user.username} = {user.email}
 		</li>

src/routes/api/deleteUsers/+server.ts

@@ -1,7 +1,5 @@
 import { db } from "$lib/server/db"
 import { sessionsTable, usersTable } from "$lib/server/db/schema"
-import { DefaultViewBuilderCore } from "drizzle-orm/gel-core";
-
 
 export async function POST() {
     await db.delete(sessionsTable);

src/routes/callback/+page.server.ts

@@ -25,9 +25,6 @@ export const load: PageServerLoad = async ({ url, cookies }) => {
     // TODO: Check if deletion was fulfilled
     await db.delete(states).where(eq(states.id, state));
 
-    console.log(`Received request and exchanged code for token: ${token}`)
-
-    console.log("Trying to get current User Profile")
     const userResponse = await getCurrentUserProfile(token.access_token)
 
     const isUser: boolean = (await db.$count(usersTable, eq(usersTable.email, userResponse.email))) === 1

src/routes/private/+page.svelte

@@ -0,0 +1,3 @@
+<h1>
+    Hello :)
+</h1>