Error Handling

[mirmirmirr]

This pull request significantly improves the user experience and error handling across all authentication-related pages (login, register, forgot-password, reset-password, and email confirmation) by replacing disruptive alert dialogs with inline error displays and toast notifications. It also standardizes the use of form components, enhances rate-limit feedback, and centralizes error formatting.

User experience and error handling improvements:

• Replaced all alert calls with inline error messages using the Banner component and toast notifications via the useToast hook, providing a more user-friendly and non-disruptive way to communicate errors and status updates. [1] [2] [3] [4] [5]
• Added granular error state management for each form field and API errors, allowing for more precise and contextual error feedback on all auth pages. [1] [2] [3] [4]

Form and input improvements:

• Updated all authentication forms to use the shared TextInputField component from @/components/text-input-field, ensuring consistent styling and behavior across pages. [1] [2] [3] [4]
• Enhanced input fields with labels, outlined variants, error props, and unique IDs for better accessibility and clarity. [1] [2] [3] [4] [5]

Rate limiting and error feedback:

• Introduced explicit handling and display of rate limit errors using the Banner component, with user-friendly messages and titles to inform users when they need to slow down. [1] [2] [3]
• Improved feedback for specific error scenarios (e.g., password reuse, invalid tokens) and provided more actionable error messages.

Code organization and maintainability:

• Centralized API error formatting by switching to formatApiError from @/lib/utils/api/handle-api-error across all relevant files. [1] [2] [3] [4] [5]
• Unified error handling logic into reusable functions (handleErrors, etc.) for clarity and DRYness. [1] [2] [3] [4]

UI layout enhancements:

• Updated page layouts to use a vertical flex column with spacing (gap-4), improving the visual structure and readability of authentication forms. [1] [2] [3] [4]

[Copilot]

Pull Request Overview

Copilot reviewed 33 out of 34 changed files in this pull request and generated 33 comments.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[jzgom067]

If the endpoint returns 404, it would probably be a better user experience to show an error message that the link is expired, rather than a generic message.

[mirmirmirr]

are all 404 messages from this endpoint only for expired links? Or is 404 also returned for links not found?

[jzgom067]

404 is returned for an invalid reset token, which can be either an expired token or a token that never existed.

[mirmirmirr]

would just saying the the reset token is invalid be better then?

[mirmirmirr]

• Updated with a constant for title length
• Created a universal hook for errors (/lib/hooks/use-form-errors.ts) since error setups are the same across all pages that use them + the rate limit banner