From db9183d2cf78ba35cae7bfb0806688208046e94b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 22:51:21 +0200
Subject: [PATCH 1/9] Improve accessibility of form fields in AddEditUserDialog

See https://mui.com/material-ui/api/text-field/
---
 ui/src/user/AddEditUserDialog.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/ui/src/user/AddEditUserDialog.tsx b/ui/src/user/AddEditUserDialog.tsx
index cad98ce..2ee7812 100644
--- a/ui/src/user/AddEditUserDialog.tsx
+++ b/ui/src/user/AddEditUserDialog.tsx
@@ -56,6 +56,8 @@ export default class AddEditDialog extends Component<IProps, IState> {
                         label="Name *"
                         type="email"
                         value={name}
+                        name="username"
+                        id="username"
                         onChange={this.handleChange.bind(this, 'name')}
                         fullWidth
                     />
@@ -66,6 +68,8 @@ export default class AddEditDialog extends Component<IProps, IState> {
                         value={pass}
                         fullWidth
                         label={isEdit ? 'Pass (empty if no change)' : 'Pass *'}
+                        name="password"
+                        id="password"
                         onChange={this.handleChange.bind(this, 'pass')}
                     />
                     <FormControlLabel

From e3f2696f315ec5dbc8599452ffa9148b65799339 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 22:54:29 +0200
Subject: [PATCH 2/9] Remove `type="email"` from username field in
 AddEditUserDialog

As the username doesn't have to be an email, having email as the type is incorrect.
This change also makes it more consistent with the way it is defined in the login form.
---
 ui/src/user/AddEditUserDialog.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/ui/src/user/AddEditUserDialog.tsx b/ui/src/user/AddEditUserDialog.tsx
index 2ee7812..fb85d09 100644
--- a/ui/src/user/AddEditUserDialog.tsx
+++ b/ui/src/user/AddEditUserDialog.tsx
@@ -54,7 +54,6 @@ export default class AddEditDialog extends Component<IProps, IState> {
                         margin="dense"
                         className="name"
                         label="Name *"
-                        type="email"
                         value={name}
                         name="username"
                         id="username"

From fc84fb3c8b50c28971899bef2f5a065fb49c5ab2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 22:57:27 +0200
Subject: [PATCH 3/9] Make wording of form fields in AddEditUserDialog
 consistent with the login

The login form says username and password and should be consistently used throughout.
---
 ui/src/user/AddEditUserDialog.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/ui/src/user/AddEditUserDialog.tsx b/ui/src/user/AddEditUserDialog.tsx
index fb85d09..731fabf 100644
--- a/ui/src/user/AddEditUserDialog.tsx
+++ b/ui/src/user/AddEditUserDialog.tsx
@@ -53,7 +53,7 @@ export default class AddEditDialog extends Component<IProps, IState> {
                         autoFocus
                         margin="dense"
                         className="name"
-                        label="Name *"
+                        label="Username *"
                         value={name}
                         name="username"
                         id="username"
@@ -66,7 +66,7 @@ export default class AddEditDialog extends Component<IProps, IState> {
                         type="password"
                         value={pass}
                         fullWidth
-                        label={isEdit ? 'Pass (empty if no change)' : 'Pass *'}
+                        label={isEdit ? 'Password (empty if no change)' : 'Password *'}
                         name="password"
                         id="password"
                         onChange={this.handleChange.bind(this, 'pass')}
@@ -92,7 +92,7 @@ export default class AddEditDialog extends Component<IProps, IState> {
                                 ? passPresent
                                     ? ''
                                     : 'password is required'
-                                : 'name is required'
+                                : 'username is required'
                         }>
                         <div>
                             <Button

From 956d9025b4ad67cf1357eb631cd971ca0a53a983 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 23:03:05 +0200
Subject: [PATCH 4/9] Improve accessibility of form fields in Register

See https://mui.com/material-ui/api/text-field/
---
 ui/src/user/Register.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/ui/src/user/Register.tsx b/ui/src/user/Register.tsx
index 9ef3470..34c32d7 100644
--- a/ui/src/user/Register.tsx
+++ b/ui/src/user/Register.tsx
@@ -46,21 +46,25 @@ export default class RegistrationDialog extends Component<IProps, IState> {
                 <DialogContent>
                     <TextField
                         autoFocus
+                        id="register-username"
                         margin="dense"
                         className="name"
                         label="Name *"
+                        name="username"
                         type="email"
                         value={name}
                         onChange={this.handleChange.bind(this, 'name')}
                         fullWidth
                     />
                     <TextField
+                        id="register-password"
                         margin="dense"
                         className="password"
                         type="password"
                         value={pass}
                         fullWidth
                         label="Pass *"
+                        name="password"
                         onChange={this.handleChange.bind(this, 'pass')}
                     />
                 </DialogContent>

From d5ab795e4cdbe3babb91a768aef10f11b4c09d24 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 23:04:39 +0200
Subject: [PATCH 5/9] Remove `type="email"` from username field in Register

As the username doesn't have to be an email, having email as the type is incorrect.
This change also makes it more consistent with the way it is defined in the login form.
---
 ui/src/user/Register.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/ui/src/user/Register.tsx b/ui/src/user/Register.tsx
index 34c32d7..9a11abf 100644
--- a/ui/src/user/Register.tsx
+++ b/ui/src/user/Register.tsx
@@ -51,7 +51,6 @@ export default class RegistrationDialog extends Component<IProps, IState> {
                         className="name"
                         label="Name *"
                         name="username"
-                        type="email"
                         value={name}
                         onChange={this.handleChange.bind(this, 'name')}
                         fullWidth

From eb811e3f740a51b09e0c78e18f92f4fd2eb68951 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 23:06:10 +0200
Subject: [PATCH 6/9] Make wording of form fields in Register consistent with
 the login

The login form says username and password and should be consistently used throughout.
---
 ui/src/user/Register.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/ui/src/user/Register.tsx b/ui/src/user/Register.tsx
index 9a11abf..f261593 100644
--- a/ui/src/user/Register.tsx
+++ b/ui/src/user/Register.tsx
@@ -49,7 +49,7 @@ export default class RegistrationDialog extends Component<IProps, IState> {
                         id="register-username"
                         margin="dense"
                         className="name"
-                        label="Name *"
+                        label="Username *"
                         name="username"
                         value={name}
                         onChange={this.handleChange.bind(this, 'name')}
@@ -62,7 +62,7 @@ export default class RegistrationDialog extends Component<IProps, IState> {
                         type="password"
                         value={pass}
                         fullWidth
-                        label="Pass *"
+                        label="Password *"
                         name="password"
                         onChange={this.handleChange.bind(this, 'pass')}
                     />
@@ -76,7 +76,7 @@ export default class RegistrationDialog extends Component<IProps, IState> {
                                 ? passPresent
                                     ? ''
                                     : 'password is required'
-                                : 'name is required'
+                                : 'username is required'
                         }>
                         <div>
                             <Button

From 97ea32e507a0faaf9737786e8560e12c11a82b78 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 23:13:05 +0200
Subject: [PATCH 7/9] Make wording of form fields in Users consistent with the
 login

The login form says username and password and should be consistently used throughout.
---
 ui/src/user/Users.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/src/user/Users.tsx b/ui/src/user/Users.tsx
index 7e6f665..af5f5fc 100644
--- a/ui/src/user/Users.tsx
+++ b/ui/src/user/Users.tsx
@@ -84,7 +84,7 @@ class Users extends Component<WithStyles<'wrapper'> & Stores<'userStore'>> {
                         <Table id="user-table">
                             <TableHead>
                                 <TableRow style={{textAlign: 'center'}}>
-                                    <TableCell>Name</TableCell>
+                                    <TableCell>Username</TableCell>
                                     <TableCell>Admin</TableCell>
                                     <TableCell />
                                 </TableRow>

From 9f3bbd888b0312955b1e712e3c0bc38421883450 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 23:15:29 +0200
Subject: [PATCH 8/9] Improve accessibility of form fields in Login

See https://mui.com/material-ui/api/text-field/
---
 ui/src/user/Login.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/ui/src/user/Login.tsx b/ui/src/user/Login.tsx
index e400ed8..1580bdb 100644
--- a/ui/src/user/Login.tsx
+++ b/ui/src/user/Login.tsx
@@ -28,17 +28,21 @@ class Login extends Component<Stores<'currentUser'>> {
                         <form onSubmit={this.preventDefault} id="login-form">
                             <TextField
                                 autoFocus
+                                id="username"
                                 className="name"
                                 label="Username"
+                                name="username"
                                 margin="dense"
                                 autoComplete="username"
                                 value={username}
                                 onChange={(e) => (this.username = e.target.value)}
                             />
                             <TextField
+                                id="password"
                                 type="password"
                                 className="password"
                                 label="Password"
+                                name="password"
                                 margin="normal"
                                 autoComplete="current-password"
                                 value={password}

From 629271fdce2c5183aa34b791ecbed38d948d25a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fran=C3=A7ois=20Martin?= <f.martin@fastmail.com>
Date: Wed, 23 Jul 2025 23:20:43 +0200
Subject: [PATCH 9/9] Add autocomplete fields to registration

This ensures password managers can properly save the form field's values.
---
 ui/src/user/Register.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/ui/src/user/Register.tsx b/ui/src/user/Register.tsx
index f261593..7e0dfa4 100644
--- a/ui/src/user/Register.tsx
+++ b/ui/src/user/Register.tsx
@@ -52,6 +52,7 @@ export default class RegistrationDialog extends Component<IProps, IState> {
                         label="Username *"
                         name="username"
                         value={name}
+                        autoComplete="username"
                         onChange={this.handleChange.bind(this, 'name')}
                         fullWidth
                     />
@@ -64,6 +65,7 @@ export default class RegistrationDialog extends Component<IProps, IState> {
                         fullWidth
                         label="Password *"
                         name="password"
+                        autoComplete="new-password"
                         onChange={this.handleChange.bind(this, 'pass')}
                     />
                 </DialogContent>