Add password confirmation to user creation/edit in Users page

Shows confirm password field when a password is entered. Validates
match before saving.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

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() {
             <input
               type="password"
               value={form.password}
-              onChange={e => 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}
             />
           </div>
 
+          {form.password && (
+            <div>
+              <label className="block text-sm font-medium text-text-primary mb-1">Confirm Password</label>
+              <input
+                type="password"
+                value={confirmPassword}
+                onChange={e => { 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 && (
+                <p className="text-xs text-red-500 mt-1">{passwordError}</p>
+              )}
+            </div>
+          )}
+
           <div>
             <label className="block text-sm font-medium text-text-primary mb-1">Role *</label>
             <div className="grid grid-cols-3 gap-2">