114 lines
3.3 KiB
TypeScript
114 lines
3.3 KiB
TypeScript
// * Packages.
|
|
import { SubmitEvent } from "react";
|
|
import { Head, useForm } from "@inertiajs/react";
|
|
import { route } from "ziggy-js";
|
|
import { LoaderCircleIcon, ShieldCheckIcon } from "lucide-react";
|
|
// * Components shadcn.
|
|
import { Button } from "@/components/ui/button";
|
|
import {
|
|
CardContent,
|
|
CardDescription,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from "@/components/ui/card";
|
|
// * Other.
|
|
import GuestLayout from "@/back/Layouts/GuestLayout";
|
|
import SimpleString from "@/back/Components/Inputs/SimpleString";
|
|
import useTrans from "@/hooks/use-translations";
|
|
import { toast } from "@/hooks/use-toast";
|
|
|
|
type ResetPasswordProps = {
|
|
token: string;
|
|
email: string;
|
|
};
|
|
|
|
export default function ResetPassword({ token, email }: ResetPasswordProps) {
|
|
const resetSent = useTrans("auth.reset_sent");
|
|
const resetSentDesc = useTrans("auth.reset_sent_desc");
|
|
|
|
const { post, setData, processing } = useForm({
|
|
token,
|
|
email,
|
|
password: "",
|
|
password_confirmation: "",
|
|
});
|
|
|
|
const submit = (event: SubmitEvent) => {
|
|
event.preventDefault();
|
|
post(route("back.reset-password.post"), {
|
|
onSuccess: () => {
|
|
toast({
|
|
title: resetSent,
|
|
description: resetSentDesc,
|
|
});
|
|
},
|
|
});
|
|
};
|
|
|
|
return (
|
|
<GuestLayout>
|
|
<CardHeader>
|
|
<Head title={useTrans("auth.reset_password")} />
|
|
<CardTitle>
|
|
<h1 className="text-2xl text-center font-extrabold tracking-tight">
|
|
{useTrans("auth.reset_password")}
|
|
</h1>
|
|
</CardTitle>
|
|
<CardDescription>
|
|
{useTrans("auth.reset_password_desc")}
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<form onSubmit={submit} className="space-y-3">
|
|
<SimpleString
|
|
id="email"
|
|
name="email"
|
|
type="email"
|
|
label={useTrans("back.your_field", {
|
|
params: { field: useTrans("validation.attributes.email") },
|
|
})}
|
|
placeholder="ex: john.doe@ldc.fr"
|
|
wordCounter={false}
|
|
value={email}
|
|
setData={() => {}}
|
|
disabled={true}
|
|
/>
|
|
<SimpleString
|
|
id="password"
|
|
name="password"
|
|
type="password"
|
|
label={useTrans("back.your_field", {
|
|
params: { field: useTrans("validation.custom.new_password") },
|
|
})}
|
|
placeholder="********"
|
|
wordCounter={false}
|
|
setData={setData}
|
|
/>
|
|
<SimpleString
|
|
id="password_confirmation"
|
|
name="password_confirmation"
|
|
type="password"
|
|
label={useTrans("back.your_field", {
|
|
params: {
|
|
field: useTrans("validation.attributes.password_confirmation"),
|
|
},
|
|
})}
|
|
placeholder="********"
|
|
wordCounter={false}
|
|
setData={setData}
|
|
/>
|
|
<div className="flex justify-center">
|
|
<Button type="submit" disabled={processing}>
|
|
{useTrans("auth.reset_your_password")}
|
|
{processing ? (
|
|
<LoaderCircleIcon className="animate-spin" />
|
|
) : (
|
|
<ShieldCheckIcon />
|
|
)}
|
|
</Button>
|
|
</div>
|
|
</form>
|
|
</CardContent>
|
|
</GuestLayout>
|
|
);
|
|
}
|