Skip to content

Commit

Permalink
[MISC] Tweak frontend portal behaviour on enter keypress (#874)
Browse files Browse the repository at this point in the history
Currently the first factor login page has somewhat inconsistent behaviour when pressing enter on a field.

The typical workflow will focus the next field from username -> password -> attempt login.
However if a user wants to tab down and hit spacebar to activate the remember me option, they cannot just hit enter and attempt a login.

This change will attempt a sign-in if the username and password fields both contain data and enter is pressed on either the username, password or remember me fields.
If the first condition is not met the the respective field(s) will error (turn red) and focus will be set to the in sequential order per the normal workflow.
  • Loading branch information
nightah committed Apr 16, 2020
1 parent 02c5558 commit 69c822a
Showing 1 changed file with 23 additions and 1 deletion.
24 changes: 23 additions & 1 deletion web/src/views/LoginPortal/FirstFactor/FirstFactorForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -96,7 +96,14 @@ export default function (props: Props) {
onFocus={() => setUsernameError(false)}
onKeyPress={(ev) => {
if (ev.key === 'Enter') {
passwordRef.current.focus();
if (!username.length) {
setUsernameError(true)
} else if (username.length && password.length) {
handleSignIn();
} else {
setUsernameError(false)
passwordRef.current.focus();
}
}
}} />
</Grid>
Expand All @@ -117,6 +124,11 @@ export default function (props: Props) {
type="password"
onKeyPress={(ev) => {
if (ev.key === 'Enter') {
if (!username.length) {
usernameRef.current.focus();
} else if (!password.length) {
passwordRef.current.focus();
}
handleSignIn();
ev.preventDefault();
}
Expand All @@ -134,6 +146,16 @@ export default function (props: Props) {
disabled={disabled}
checked={rememberMe}
onChange={handleRememberMeChange}
onKeyPress={(ev) => {
if (ev.key === 'Enter') {
if (!username.length) {
usernameRef.current.focus();
} else if (!password.length) {
passwordRef.current.focus();
}
handleSignIn();
}
}}
value="rememberMe"
color="primary"/>
}
Expand Down

0 comments on commit 69c822a

Please sign in to comment.