Add password confirmation field to setup form
All checks were successful
Deploy / deploy (push) Successful in 11s

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
fahed
2026-02-23 15:02:07 +03:00
parent ec640a9bd9
commit fd4d6648b0

View File

@@ -18,6 +18,7 @@ export default function Login() {
const [setupName, setSetupName] = useState('') const [setupName, setSetupName] = useState('')
const [setupEmail, setSetupEmail] = useState('') const [setupEmail, setSetupEmail] = useState('')
const [setupPassword, setSetupPassword] = useState('') const [setupPassword, setSetupPassword] = useState('')
const [setupConfirm, setSetupConfirm] = useState('')
const [setupDone, setSetupDone] = useState(false) const [setupDone, setSetupDone] = useState(false)
useEffect(() => { useEffect(() => {
@@ -42,6 +43,10 @@ export default function Login() {
const handleSetup = async (e) => { const handleSetup = async (e) => {
e.preventDefault() e.preventDefault()
setError('') setError('')
if (setupPassword !== setupConfirm) {
setError('Passwords do not match')
return
}
setLoading(true) setLoading(true)
try { try {
@@ -143,6 +148,23 @@ export default function Login() {
</div> </div>
</div> </div>
{/* Confirm Password */}
<div>
<label className="block text-sm font-medium text-slate-300 mb-2">Confirm Password</label>
<div className="relative">
<Lock className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-slate-500" />
<input
type="password"
value={setupConfirm}
onChange={(e) => setSetupConfirm(e.target.value)}
className="w-full pl-11 pr-4 py-3 bg-slate-900/50 border border-slate-700 rounded-lg text-white placeholder-slate-500 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all"
placeholder="Re-enter your password"
required
minLength={6}
/>
</div>
</div>
{/* Error */} {/* Error */}
{error && ( {error && (
<div className="flex items-center gap-2 p-3 bg-red-500/10 border border-red-500/30 rounded-lg"> <div className="flex items-center gap-2 p-3 bg-red-500/10 border border-red-500/30 rounded-lg">