you know what let's just change frontend framework again

Foxnouns.Frontend/src/routes/auth/log-in/+page.server.ts

@@ -0,0 +1,79 @@
+import { isRedirect, redirect } from "@sveltejs/kit";
+
+import { apiRequest } from "$api";
+import type { AuthResponse, AuthUrls } from "$api/models/auth";
+import { setToken } from "$lib";
+import ApiError, { ErrorCode } from "$api/error";
+
+export const load = async ({ fetch, parent }) => {
+	const parentData = await parent();
+	if (parentData.meUser) redirect(303, `/@${parentData.meUser.username}`);
+
+	const urls = await apiRequest<AuthUrls>("POST", "/auth/urls", { fetch, isInternal: true });
+	return { urls };
+};
+
+export const actions = {
+	login: async ({ request, fetch, cookies }) => {
+		const body = await request.formData();
+		const email = body.get("email") as string | null;
+		const password = body.get("password") as string | null;
+
+		try {
+			const resp = await apiRequest<AuthResponse>("POST", "/auth/email/login", {
+				body: { email, password },
+				fetch,
+				isInternal: true,
+			});
+
+			setToken(cookies, resp.token);
+			redirect(303, `/@${resp.user.username}`);
+		} catch (e) {
+			if (isRedirect(e)) throw e;
+
+			if (e instanceof ApiError) return { error: e.obj };
+			throw e;
+		}
+	},
+	fediToggle: () => {
+		return { error: null, showFediBox: true };
+	},
+	fedi: async ({ request, fetch }) => {
+		const body = await request.formData();
+		const instance = body.get("instance") as string | null;
+		if (!instance) return { error: new ApiError(undefined, ErrorCode.BadRequest).obj };
+
+		try {
+			const resp = await apiRequest<{ url: string }>(
+				"GET",
+				`/auth/fediverse?instance=${encodeURIComponent(instance)}`,
+				{ fetch, isInternal: true },
+			);
+			redirect(303, resp.url);
+		} catch (e) {
+			if (isRedirect(e)) throw e;
+
+			if (e instanceof ApiError) return { error: e.obj };
+			throw e;
+		}
+	},
+	fediForceRefresh: async ({ request, fetch }) => {
+		const body = await request.formData();
+		const instance = body.get("instance") as string | null;
+		if (!instance) return { error: new ApiError(undefined, ErrorCode.BadRequest).obj };
+
+		try {
+			const resp = await apiRequest<{ url: string }>(
+				"GET",
+				`/auth/fediverse?instance=${encodeURIComponent(instance)}&forceRefresh=true`,
+				{ fetch, isInternal: true },
+			);
+			redirect(303, resp.url);
+		} catch (e) {
+			if (isRedirect(e)) throw e;
+
+			if (e instanceof ApiError) return { error: e.obj };
+			throw e;
+		}
+	},
+};

Foxnouns.Frontend/src/routes/auth/log-in/+page.svelte

@@ -0,0 +1,88 @@
+<script lang="ts">
+	import type { ActionData, PageData } from "./$types";
+	import { t } from "$lib/i18n";
+	import { enhance } from "$app/forms";
+	import { Button, ButtonGroup, Input, InputGroup } from "@sveltestrap/sveltestrap";
+	import ErrorAlert from "$components/ErrorAlert.svelte";
+
+	type Props = { data: PageData; form: ActionData };
+	let { data, form }: Props = $props();
+</script>
+
+<svelte:head>
+	<title>{$t("title.log-in")} • pronouns.cc</title>
+</svelte:head>
+
+<div class="container">
+	<div class="row">
+		{#if form?.error}
+			<ErrorAlert error={form.error} />
+		{/if}
+	</div>
+	<div class="row">
+		{#if data.urls.email_enabled}
+			<div class="col col-md mb-4">
+				<h2>{$t("auth.log-in-form-title")}</h2>
+				<form method="POST" action="?/login" use:enhance>
+					<div class="mb-2">
+						<label class="form-label" for="email">{$t("auth.log-in-form-email-label")}</label>
+						<Input type="email" id="email" name="email" placeholder="me@example.com" />
+					</div>
+					<div class="mb-2">
+						<label class="form-label" for="password">{$t("auth.log-in-form-password-label")}</label>
+						<Input type="password" id="password" name="password" />
+					</div>
+					<ButtonGroup>
+						<Button type="submit" color="primary">{$t("auth.log-in-button")}</Button>
+						<a class="btn btn-secondary" href="/auth/register">
+							{$t("auth.register-with-email-button")}
+						</a>
+					</ButtonGroup>
+				</form>
+			</div>
+		{:else}
+			<div class="col-lg-3"></div>
+		{/if}
+		<div class="col col-md">
+			<h3>{$t("auth.log-in-3rd-party-header")}</h3>
+			<p>{$t("auth.log-in-3rd-party-desc")}</p>
+			<form method="POST" action="?/fediToggle" use:enhance>
+				<div class="list-group">
+					{#if data.urls.discord}
+						<a href={data.urls.discord} class="list-group-item list-group-item-action">
+							{$t("auth.log-in-with-discord")}
+						</a>
+					{/if}
+					{#if data.urls.google}
+						<a href={data.urls.google} class="list-group-item list-group-item-action">
+							{$t("auth.log-in-with-google")}
+						</a>
+					{/if}
+					{#if data.urls.tumblr}
+						<a href={data.urls.tumblr} class="list-group-item list-group-item-action">
+							{$t("auth.log-in-with-tumblr")}
+						</a>
+					{/if}
+					<button type="submit" class="list-group-item list-group-item-action">
+						{$t("auth.log-in-with-the-fediverse")}
+					</button>
+				</div>
+			</form>
+			{#if form?.showFediBox}
+				<h4 class="mt-4">{$t("auth.log-in-with-the-fediverse")}</h4>
+				<form method="POST" action="?/fedi" use:enhance>
+					<InputGroup>
+						<Input name="instance" type="text" placeholder="Your instance (i.e. mastodon.social)" />
+						<Button type="submit" color="secondary">{$t("auth.log-in-button")}</Button>
+					</InputGroup>
+					<p>
+						{$t("auth.log-in-with-fediverse-error-blurb")}
+						<Button formaction="?/fediForceRefresh" type="submit" color="link">
+							{$t("auth.log-in-with-fediverse-force-refresh-button")}
+						</Button>
+					</p>
+				</form>
+			{/if}
+		</div>
+	</div>
+</div>