feat(auth): enhance login page accessibility and form error reset
All checks were successful
Deploy Flowstate to VPS / deploy (push) Successful in 46s

This commit is contained in:
Chneemann 2026-10-12 10:24:18 +02:00
parent c1e2dd4407
commit 3be5077178
No known key found for this signature in database

View file

@ -1,6 +1,6 @@
/**
* @file app/(auth)/login/page.tsx
* @description Client component providing a user login interface utilizing the auth service.
* @description Client component providing a user login interface utilizing the auth service and ActionButton.
*/
"use client";
@ -25,6 +25,15 @@ export default function LoginPage() {
"credentials" | "guest" | null
>(null);
/**
* Clears active error state when user modifies input fields.
*/
const handleInputChange = () => {
if (error) {
setError(null);
}
};
/**
* Performs user authentication via email and password using the auth service.
* Redirects to the summary page upon success or sets an error message on failure.
@ -125,7 +134,11 @@ export default function LoginPage() {
</div>
)}
<form onSubmit={handleSubmit} className="space-y-4">
<form
onSubmit={handleSubmit}
onChange={handleInputChange}
className="space-y-4"
>
<div className="space-y-1.5">
<label
htmlFor="email"
@ -139,6 +152,7 @@ export default function LoginPage() {
type="email"
placeholder="name@example.com"
maxLength={255}
autoComplete="email"
required
className="w-full px-3.5 py-2.5 text-sm rounded-lg border border-border bg-background/50 text-foreground placeholder:text-foreground-muted/50 focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary transition-colors"
/>
@ -157,6 +171,7 @@ export default function LoginPage() {
type="password"
placeholder="••••••••••••"
maxLength={72}
autoComplete="current-password"
required
className="w-full px-3.5 py-2.5 text-sm rounded-lg border border-border bg-background/50 text-foreground placeholder:text-foreground-muted/50 focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary transition-colors"
/>