Sign in

pulls/pr_01m47d24b0e6n91zwymwxg0vpx

public

pr_01m47d24b0e6n91zwymwxg0vpx/apps/web/app/routes/reset.tsx

58 lines1,858 bytesCodeBlame
1import { Form, Link, redirect } from "react-router";
2
3import type { Route } from "./+types/reset";
4import { AuthCard } from "../components/auth-card";
5import { Button, ErrorText, Field, Input } from "../components/ui";
6import { identity } from "../lib/services.server";
7import { assertSameOrigin } from "../lib/session.server";
8
9export function meta({}: Route.MetaArgs) {
10 return [{ title: "Choose a new password · g1t" }];
11}
12
13export function loader({ request }: Route.LoaderArgs) {
14 return { token: new URL(request.url).searchParams.get("token") ?? "" };
15}
16
17export async function action({ request }: Route.ActionArgs) {
18 assertSameOrigin(request);
19 const form = await request.formData();
20 const result = await identity.resetPassword(
21 String(form.get("token") ?? ""),
22 String(form.get("password") ?? ""),
23 );
24 if (!result.ok) return { error: result.error.message };
25 throw redirect("/login?reset=1");
26}
27
28export default function Reset({ loaderData, actionData }: Route.ComponentProps) {
29 return (
30 <AuthCard
31 title="Choose a new password"
32 subtitle="You will be signed out everywhere"
33 footer={
34 <Link to="/login" className="text-fg underline underline-offset-4">
35 Back to sign in
36 </Link>
37 }
38 >
39 <Form method="post" className="space-y-4">
40 <input type="hidden" name="token" value={loaderData.token} />
41 <Field label="New password" hint="At least 10 characters.">
42 <Input
43 name="password"
44 type="password"
45 autoComplete="new-password"
46 required
47 minLength={10}
48 autoFocus
49 />
50 </Field>
51 <ErrorText>{actionData?.error}</ErrorText>
52 <div className="pt-2 *:w-full">
53 <Button type="submit">Set password</Button>
54 </div>
55 </Form>
56 </AuthCard>
57 );
58}