Added auth!

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

@@ -0,0 +1,76 @@
+import { lucia } from "$lib/server/auth";
+import { fail, redirect } from "@sveltejs/kit";
+import { Argon2id } from "oslo/password";
+import { db } from "$lib/db/db.server";
+
+import type { Actions, PageServerLoad } from "./$types";
+import type { DatabaseUser } from "$lib/server/auth";
+import { userTable } from "$lib/db/schema";
+import { eq } from "drizzle-orm";
+
+export const load: PageServerLoad = async (event) => {
+  if (event.locals.user) {
+    return redirect(302, "/");
+  }
+  return {};
+};
+
+export const actions: Actions = {
+  default: async (event) => {
+    const formData = await event.request.formData();
+    const username = formData.get("username");
+    const password = formData.get("password");
+
+    if (
+      typeof username !== "string" ||
+      username.length < 3 ||
+      username.length > 31 ||
+      !/^[a-z0-9_-]+$/.test(username)
+    ) {
+      return fail(400, {
+        message: "Invalid username",
+      });
+    }
+    if (
+      typeof password !== "string" ||
+      password.length < 6 ||
+      password.length > 255
+    ) {
+      return fail(400, {
+        message: "Invalid password",
+      });
+    }
+
+    const existingUser = await db
+      .select()
+      .from(userTable)
+      .where(eq(userTable.username, username))
+      .limit(1)
+      .then((results) => results[0] as unknown as DatabaseUser | undefined);
+
+    if (!existingUser) {
+      return fail(400, {
+        message: "Incorrect username or password",
+      });
+    }
+
+    const validPassword = await new Argon2id().verify(
+      existingUser.hashed_password,
+      password
+    );
+    if (!validPassword) {
+      return fail(400, {
+        message: "Incorrect username or password",
+      });
+    }
+
+    const session = await lucia.createSession(existingUser.id, {});
+    const sessionCookie = lucia.createSessionCookie(session.id);
+    event.cookies.set(sessionCookie.name, sessionCookie.value, {
+      path: ".",
+      ...sessionCookie.attributes,
+    });
+
+    return redirect(302, "/");
+  },
+};

src/routes/login/+page.svelte

@@ -0,0 +1,13 @@
+<!-- routes/login/+page.svelte -->
+<script lang="ts">
+  import { enhance } from "$app/forms";
+</script>
+
+<h1>Sign in</h1>
+<form method="post" use:enhance>
+  <label for="username">Username</label>
+  <input name="username" id="username" /><br />
+  <label for="password">Password</label>
+  <input type="password" name="password" id="password" /><br />
+  <button>Continue</button>
+</form>

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

@@ -0,0 +1,60 @@
+// routes/signup/+page.server.ts
+import { lucia } from "$lib/server/auth";
+import { fail, redirect } from "@sveltejs/kit";
+import { generateId } from "lucia";
+import { Argon2id } from "oslo/password";
+import { db } from "$lib/db/db.server";
+
+import type { Actions } from "./$types";
+import { userTable } from "$lib/db/schema";
+
+export const actions: Actions = {
+  default: async (event) => {
+    const formData = await event.request.formData();
+    const username = formData.get("username");
+    const password = formData.get("password");
+    // username must be between 4 ~ 31 characters, and only consists of lowercase letters, 0-9, -, and _
+    // keep in mind some database (e.g. mysql) are case insensitive
+    if (
+      typeof username !== "string" ||
+      username.length < 3 ||
+      username.length > 31 ||
+      !/^[a-z0-9_-]+$/.test(username)
+    ) {
+      return fail(400, {
+        message: "Invalid username",
+      });
+    }
+    if (
+      typeof password !== "string" ||
+      password.length < 6 ||
+      password.length > 255
+    ) {
+      return fail(400, {
+        message: "Invalid password",
+      });
+    }
+
+    const userId = generateId(15);
+    const hashedPassword = await new Argon2id().hash(password);
+
+    // TODO: check if username is already used
+    await db
+      .insert(userTable)
+      .values({
+        id: userId,
+        username: username,
+        hashed_password: hashedPassword,
+      })
+      .execute();
+
+    const session = await lucia.createSession(userId, {});
+    const sessionCookie = lucia.createSessionCookie(session.id);
+    event.cookies.set(sessionCookie.name, sessionCookie.value, {
+      path: ".",
+      ...sessionCookie.attributes,
+    });
+
+    redirect(302, "/");
+  },
+};

src/routes/signup/+page.svelte

@@ -0,0 +1,13 @@
+<!-- routes/signup/+page.svelte -->
+<script lang="ts">
+  import { enhance } from "$app/forms";
+</script>
+
+<h1>Sign up</h1>
+<form method="post" use:enhance>
+  <label for="username">Username</label>
+  <input name="username" id="username" /><br />
+  <label for="password">Password</label>
+  <input type="password" name="password" id="password" /><br />
+  <button>Continue</button>
+</form>