import { useRef } from 'react'; import InputError from '@/Components/InputError'; import InputLabel from '@/Components/InputLabel'; import PrimaryButton from '@/Components/PrimaryButton'; import TextInput from '@/Components/TextInput'; import { useForm } from '@inertiajs/react'; import { Transition } from '@headlessui/react'; export default function UpdatePasswordForm({ className }) { const passwordInput = useRef(); const currentPasswordInput = useRef(); const { data, setData, errors, put, reset, processing, recentlySuccessful } = useForm({ current_password: '', password: '', password_confirmation: '', }); const updatePassword = (e) => { e.preventDefault(); put(route('password.update'), { preserveScroll: true, onSuccess: () => reset(), onError: () => { if (errors.password) { reset('password', 'password_confirmation'); passwordInput.current.focus(); } if (errors.current_password) { reset('current_password'); currentPasswordInput.current.focus(); } }, }); }; return (

Update Password

Ensure your account is using a long, random password to stay secure.

setData('current_password', e.target.value)} type="password" className="mt-1 block w-full" autoComplete="current-password" />
setData('password', e.target.value)} type="password" className="mt-1 block w-full" autoComplete="new-password" />
setData('password_confirmation', e.target.value)} type="password" className="mt-1 block w-full" autoComplete="new-password" />
Save

Saved.

); }