fix: show validation error on incomplete login submit
Address Greptile review feedback: - Show "Please fill in all required fields." instead of silently returning when form is submitted with missing fields - Remove pointer-events-none so keyboard users can reach the button and receive the same validation feedback Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
@@ -91,7 +91,11 @@ export function AuthPage() {
|
|||||||
className="mt-6 space-y-4"
|
className="mt-6 space-y-4"
|
||||||
onSubmit={(event) => {
|
onSubmit={(event) => {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
if (!canSubmit || mutation.isPending) return;
|
if (mutation.isPending) return;
|
||||||
|
if (!canSubmit) {
|
||||||
|
setError("Please fill in all required fields.");
|
||||||
|
return;
|
||||||
|
}
|
||||||
mutation.mutate();
|
mutation.mutate();
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
@@ -133,7 +137,7 @@ export function AuthPage() {
|
|||||||
type="submit"
|
type="submit"
|
||||||
disabled={mutation.isPending}
|
disabled={mutation.isPending}
|
||||||
aria-disabled={!canSubmit || mutation.isPending}
|
aria-disabled={!canSubmit || mutation.isPending}
|
||||||
className={`w-full ${!canSubmit ? "opacity-50 pointer-events-none" : ""}`}
|
className={`w-full ${!canSubmit && !mutation.isPending ? "opacity-50" : ""}`}
|
||||||
>
|
>
|
||||||
{mutation.isPending
|
{mutation.isPending
|
||||||
? "Working…"
|
? "Working…"
|
||||||
|
|||||||
Reference in New Issue
Block a user