add login with enter key
This commit is contained in:
parent
97b0e5bdd3
commit
a224397079
3 changed files with 16 additions and 1 deletions
|
|
@ -33,6 +33,15 @@ export default function LoginPage() {
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Catch key events in order to trigger login on enter
|
||||
*/
|
||||
const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
|
||||
if (event.key === "Enter") {
|
||||
executeLogin();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="app-bg">
|
||||
<div className="flex flex-col gap-3 max-w-sm w-full mx-auto p-6 bg-white rounded-2xl shadow-md">
|
||||
|
|
@ -43,12 +52,15 @@ export default function LoginPage() {
|
|||
placeholder="Benutzername"
|
||||
value={userName}
|
||||
onChange={(e) => setUserName(e.target.value)}
|
||||
onKeyDown={handleKeyDown}
|
||||
/>
|
||||
|
||||
<PasswordField
|
||||
onPasswordChanged = {setPassword}
|
||||
onKeyDown={handleKeyDown}
|
||||
/>
|
||||
|
||||
{/* error message */}
|
||||
{errorMessage && (
|
||||
<p className="error-text text-center">{errorMessage}</p>
|
||||
)}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue