diff --git a/client/src/pages/Users.jsx b/client/src/pages/Users.jsx index ec50294..454717f 100644 --- a/client/src/pages/Users.jsx +++ b/client/src/pages/Users.jsx @@ -34,6 +34,8 @@ export default function Users() { const [form, setForm] = useState(EMPTY_FORM) const [showDeleteConfirm, setShowDeleteConfirm] = useState(false) const [userToDelete, setUserToDelete] = useState(null) + const [confirmPassword, setConfirmPassword] = useState('') + const [passwordError, setPasswordError] = useState('') useEffect(() => { loadUsers() }, []) @@ -49,6 +51,11 @@ export default function Users() { } const handleSave = async () => { + setPasswordError('') + if (form.password && form.password !== confirmPassword) { + setPasswordError('Passwords do not match') + return + } try { const data = { name: form.name, @@ -87,12 +94,16 @@ export default function Users() { role: user.role || 'contributor', avatar: user.avatar || '', }) + setConfirmPassword('') + setPasswordError('') setShowModal(true) } const openNew = () => { setEditingUser(null) setForm(EMPTY_FORM) + setConfirmPassword('') + setPasswordError('') setShowModal(true) } @@ -253,13 +264,29 @@ export default function Users() { setForm(f => ({ ...f, password: e.target.value }))} + onChange={e => { setForm(f => ({ ...f, password: e.target.value })); setPasswordError('') }} className="w-full px-3 py-2 text-sm border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-brand-primary/20 focus:border-brand-primary" placeholder="••••••••" required={!editingUser} /> + {form.password && ( +
+ + { setConfirmPassword(e.target.value); setPasswordError('') }} + className="w-full px-3 py-2 text-sm border border-border rounded-lg focus:outline-none focus:ring-2 focus:ring-brand-primary/20 focus:border-brand-primary" + placeholder="••••••••" + /> + {passwordError && ( +

{passwordError}

+ )} +
+ )} +