Initial
This commit is contained in:
@@ -1,9 +1,10 @@
|
||||
import InputError from '@/Components/InputError';
|
||||
import InputLabel from '@/Components/InputLabel';
|
||||
import PrimaryButton from '@/Components/PrimaryButton';
|
||||
import TextInput from '@/Components/TextInput';
|
||||
import GuestLayout from '@/Layouts/GuestLayout';
|
||||
import { Head, useForm } from '@inertiajs/react';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/Components/ui/card.jsx";
|
||||
import { Label } from "@/Components/ui/label.jsx";
|
||||
|
||||
export default function ResetPassword({ token, email }) {
|
||||
const { data, setData, post, processing, errors, reset } = useForm({
|
||||
@@ -24,71 +25,43 @@ export default function ResetPassword({ token, email }) {
|
||||
return (
|
||||
<GuestLayout>
|
||||
<Head title="Reset Password" />
|
||||
|
||||
<form onSubmit={submit}>
|
||||
<div>
|
||||
<InputLabel htmlFor="email" value="Email" />
|
||||
|
||||
<TextInput
|
||||
id="email"
|
||||
type="email"
|
||||
name="email"
|
||||
value={data.email}
|
||||
className="mt-1 block w-full"
|
||||
autoComplete="username"
|
||||
onChange={(e) => setData('email', e.target.value)}
|
||||
/>
|
||||
|
||||
<InputError message={errors.email} className="mt-2" />
|
||||
</div>
|
||||
|
||||
<div className="mt-4">
|
||||
<InputLabel htmlFor="password" value="Password" />
|
||||
|
||||
<TextInput
|
||||
id="password"
|
||||
type="password"
|
||||
name="password"
|
||||
value={data.password}
|
||||
className="mt-1 block w-full"
|
||||
autoComplete="new-password"
|
||||
isFocused={true}
|
||||
onChange={(e) => setData('password', e.target.value)}
|
||||
/>
|
||||
|
||||
<InputError message={errors.password} className="mt-2" />
|
||||
</div>
|
||||
|
||||
<div className="mt-4">
|
||||
<InputLabel
|
||||
htmlFor="password_confirmation"
|
||||
value="Confirm Password"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
type="password"
|
||||
id="password_confirmation"
|
||||
name="password_confirmation"
|
||||
value={data.password_confirmation}
|
||||
className="mt-1 block w-full"
|
||||
autoComplete="new-password"
|
||||
onChange={(e) =>
|
||||
setData('password_confirmation', e.target.value)
|
||||
}
|
||||
/>
|
||||
|
||||
<InputError
|
||||
message={errors.password_confirmation}
|
||||
className="mt-2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 flex items-center justify-end">
|
||||
<PrimaryButton className="ms-4" disabled={processing}>
|
||||
Reset Password
|
||||
</PrimaryButton>
|
||||
</div>
|
||||
</form>
|
||||
<div className="flex flex-col gap-6">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="text-2xl">Reset Password</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form onSubmit={ submit }>
|
||||
<div className="flex flex-col gap-6">
|
||||
<div className="grid gap-2">
|
||||
<Label htmlFor="email">E-mail Address</Label>
|
||||
<TextInput type="email" id="email" placeholder="me@yumj.in" value={ data.email }
|
||||
onChange={ (e) => setData('email', e.target.value) } required />
|
||||
<InputError message={ errors.email } className="mt-2" />
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<div className="flex items-center">
|
||||
<Label htmlFor="password">Password</Label>
|
||||
</div>
|
||||
<TextInput id="password" type="password" name="password" value={ data.password }
|
||||
onChange={ (e) => setData('password', e.target.value) } />
|
||||
<InputError message={ errors.password } className="mt-2" />
|
||||
</div>
|
||||
<div className="grid gap-2">
|
||||
<div className="flex items-center">
|
||||
<Label htmlFor="password_confirmation">Password Confirmation</Label>
|
||||
</div>
|
||||
<TextInput id="password_confirmation" type="password" name="password_confirmation" value={ data.password_confirmation }
|
||||
onChange={ (e) => setData('password_confirmation', e.target.value) } />
|
||||
<InputError message={ errors.password_confirmation } className="mt-2" />
|
||||
</div>
|
||||
<PrimaryButton type="submit" disabled={ processing }
|
||||
className="w-full">Reset Password</PrimaryButton>
|
||||
</div>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</GuestLayout>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user