apps/web: Next.js 16 (App Router), Tailwind 4 and shadcn/ui, light and dark from the system. Pages render on the server and call the API with Eden Treaty (typed by @t5de/api), forwarding the visitor's cookie; forms use server actions; sign-up, sign-in and sign-out use Better Auth's React client. /api is rewritten to the API so its cookies are first-party. Who's online follows the API's event stream (Next's gzip is off: it held the stream back). Standalone output with a Dockerfile; deploys to Vercel as is. Co-Authored-By: Claude Opus 5.5 <[email protected]>
62 lines
2.0 KiB
TypeScript
62 lines
2.0 KiB
TypeScript
"use client";
|
|
import Link from "next/link";
|
|
import { useRouter } from "next/navigation";
|
|
import { useState } from "react";
|
|
import { ErrorText } from "@/components/forms";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Field, FieldDescription, FieldGroup, FieldLabel } from "@/components/ui/field";
|
|
import { Input } from "@/components/ui/input";
|
|
import { authClient } from "@/lib/auth-client";
|
|
|
|
/** Signs in with Better Auth, then goes to next (already checked to be a path on this site). */
|
|
export function SignInForm({ next }: { next: string }) {
|
|
const router = useRouter();
|
|
const [error, setError] = useState("");
|
|
const [pending, setPending] = useState(false);
|
|
|
|
async function submit(form: FormData) {
|
|
setError("");
|
|
setPending(true);
|
|
const { error } = await authClient.signIn.username({
|
|
username: String(form.get("username")),
|
|
password: String(form.get("password")),
|
|
});
|
|
if (error) {
|
|
setError(error.message ?? "That didn't work. Try again.");
|
|
setPending(false);
|
|
return;
|
|
}
|
|
router.push(next);
|
|
router.refresh();
|
|
}
|
|
|
|
return (
|
|
<form
|
|
onSubmit={(e) => {
|
|
e.preventDefault();
|
|
void submit(new FormData(e.currentTarget));
|
|
}}
|
|
>
|
|
<FieldGroup>
|
|
<Field>
|
|
<FieldLabel htmlFor="username">Username</FieldLabel>
|
|
<Input id="username" name="username" autoComplete="username" required autoFocus />
|
|
</Field>
|
|
<Field>
|
|
<FieldLabel htmlFor="password">Password</FieldLabel>
|
|
<Input id="password" name="password" type="password" autoComplete="current-password" required />
|
|
</Field>
|
|
{error && <ErrorText>{error}</ErrorText>}
|
|
<Field>
|
|
<Button type="submit" disabled={pending}>
|
|
{pending ? "Signing in…" : "Sign in"}
|
|
</Button>
|
|
<FieldDescription className="text-center">
|
|
No account? <Link href="/signup">Create one</Link>
|
|
</FieldDescription>
|
|
</Field>
|
|
</FieldGroup>
|
|
</form>
|
|
);
|
|
}
|