import InputError from '@/components/input-error'; import SettingsLayout from '@/layouts/settings/layout'; import { Transition } from '@headlessui/react'; import { Head, useForm } from '@inertiajs/react'; import { Check, Lock, ShieldCheck } from 'lucide-react'; import { FormEventHandler, useRef } from 'react'; export default function Password() { const passwordInput = useRef(null); const currentPasswordInput = useRef(null); const { data, setData, errors, put, reset, processing, recentlySuccessful } = useForm({ current_password: '', password: '', password_confirmation: '', }); const updatePassword: FormEventHandler = (e) => { e.preventDefault(); put(route('password.update'), { preserveScroll: true, onSuccess: () => reset(), onError: (errors) => { if (errors.password) { reset('password', 'password_confirmation'); passwordInput.current?.focus(); } if (errors.current_password) { reset('current_password'); currentPasswordInput.current?.focus(); } }, }); }; return (

Passwort ändern

Verwende ein sicheres, zufälliges Passwort, um deinen Server-Account optimal zu schützen.

{/* Current Password */}
setData('current_password', e.target.value)} type="password" autoComplete="current-password" placeholder="Dein aktuelles Passwort" className="w-full bg-[#050203] border border-[#36131b] rounded-xl px-4 py-2.5 text-xs text-white outline-none focus:border-red-500 font-medium" />
{/* New Password */}
setData('password', e.target.value)} type="password" autoComplete="new-password" placeholder="Mindestens 8 Zeichen" className="w-full bg-[#050203] border border-[#36131b] rounded-xl px-4 py-2.5 text-xs text-white outline-none focus:border-red-500 font-medium" />
{/* Confirm Password */}
setData('password_confirmation', e.target.value)} type="password" autoComplete="new-password" placeholder="Passwort wiederholen" className="w-full bg-[#050203] border border-[#36131b] rounded-xl px-4 py-2.5 text-xs text-white outline-none focus:border-red-500 font-medium" />
Passwort aktualisiert!
); }