Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Improve form interaction and code organization in supa_email_auth component #106

Merged
merged 2 commits into from
Jul 10, 2024

Conversation

henry2man
Copy link
Contributor

What kind of change does this PR introduce?

Feature

What is the current behavior?

Currently, the form does not automatically submit when the "Enter" key is pressed. The focus management is also not optimal, and there is no immediate feedback on input validation. The code for button press handlers is also not well organized, affecting readability and maintainability.

What is the new behavior?

  1. Form Submission on Enter Key Press:

    • Added functionality to submit the form automatically when the "Enter" key is pressed, improving user experience.
      onFieldSubmitted: (_) {
        if (_isRecoveringPassword) {
          _passwordRecovery();
        }
      }
  2. Focus Management:

    • Introduced focus management to ensure the email field is focused if validation fails, guiding the user to the correct input field.
      final FocusNode _emailFocusNode = FocusNode();
      ...
      focusNode: _emailFocusNode,
  3. Autovalidate Mode:

    • Enabled AutovalidateMode.onUserInteraction for email and password fields to provide immediate feedback on input validation.
      autovalidateMode: AutovalidateMode.onUserInteraction,
  4. Reorganized Button Press Handlers:

    • Refactored the logic for handling button presses into separate methods _signInSignUp and _passwordRecovery, enhancing readability and maintainability.
      ElevatedButton(
        onPressed: _signInSignUp,
        ...
  5. Code Reorganization:

    • Moved the sign-in/sign-up and password recovery logic into dedicated methods to streamline the widget build method and improve code readability.
      void _signInSignUp() async { ... }
      void _passwordRecovery() async { ... }

Additional context

Benefits:

  • Enhanced User Experience: Automatically submitting the form on "Enter" key press improves the overall user experience.
  • Better Focus Management: Ensures that the user is directed to the correct input field when validation fails.
  • Immediate Feedback: Providing autovalidation feedback as the user interacts with the form fields helps in correcting errors promptly.
  • Improved Code Maintainability: By separating the logic into distinct methods, the code is more modular, readable, and easier to maintain.

…th component

- Automatically submit form on Enter key press for email and password fields.
- Introduced focus management to ensure email field is focused on validation failure.
- Enabled autovalidate mode for email and password fields to provide immediate feedback.
- Reorganized button press handlers into separate methods `_signInSignUp` and `_passwordRecovery`.
- Improved code readability and maintainability by refactoring and reorganizing logic.

Changes:
  - Added FocusNode for email field.
  - Implemented onFieldSubmitted for automatic form submission.
  - Enabled AutovalidateMode.onUserInteraction for immediate validation feedback.
  - Moved sign-in/sign-up and password recovery logic into dedicated methods.
@henry2man henry2man marked this pull request as ready for review July 10, 2024 12:51
Copy link
Member

@dshukertjr dshukertjr left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for this PR! It's amazing! Will release a version that includes this one in a few days.

@dshukertjr dshukertjr merged commit a450e29 into supabase-community:main Jul 10, 2024
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants