Implementing Validation and Error Handling in Signup Form

[ayann07]

Pull Request

Related Issues: [List any related issues or reference them using the syntax #issue_number.] Fixes #(issue number) issue number : #229 Description: [Provide a brief description of your changes.] I have implemented validation of password and name fields. Checklist:

• [yes ] I have tested my changes.
• [ yes] My code follows the project's coding standards.
• [ ] I have updated the documentation (if applicable).

Screenshots: [If applicable, include screenshots to help reviewers understand your changes.]

I have worked on this under KWOC 2023.

[vercel[bot]]

Someone is attempting to deploy a commit to a Personal Account owned by @ani1609 on Vercel.

@ani1609 first needs to authorize it.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
spendwise	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 1, 2024 10:06am
spendwise-server	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 1, 2024 10:06am

[ani1609]

@ayann07 seems like there is an error. the error message is show before even filling up the form

https://github.com/ani1609/Spendwise/assets/89239354/896dd962-4dce-4c17-899b-8deee4cbaaf3

[ayann07]

It is not an error message,I just displayed it earlier only so that user knows the conditions while setting the password.

[ayann07]

If you want I can render it afterwards, but I had seen on many sign up forms that the instructions for setting up password are already mentioned for user.

[ani1609]

@ayann07 well, your view is quite logical and yeah we should have a early message to the users. But can you like change the ui, currently this looks like the user is prompted with an error even before filling the form. And also use a delayed animation fr rendering it

[ayann07]

I have now made the necessary changes, please check adn let me know if there require anymore improvement.

[ani1609]

@ayann07 this type of design is causing overflowing issues for screens with lower heights and thats is quite expected if we keep the hint that long. In order to deal with this problem, lets just keep the criteria simpler (only 8 characters required will be the condition) and prompt the hint in password input placeholder and keep the error message same as that of non matched passwords and existing users error.

Consider the following follow ups

[ayann07]

Now I have done the changes, please check.

[ani1609]

@ayann07 your changes have a bug. I just entered an invalid password, it should be the error, but still i got my account created.

[ani1609]

@ayann07 and please try to keep the red coloured error in a single line and as mentioned earlier in the images. Also keep the validation check only for 8 characters and not any uppercase or lowercase or special characters

[ayann07]

Should I remove the upper case lower case validation?

[ayann07]

The issue raised said that the password should incorporate the upper,lower special and numeric characters

[ani1609]

@ayann07 yeah i am very well aware of that but as we saw, fitting such a long prompt is a bit inconvenient. So keep the checking for >=8 characters as of now

[ayann07]

Now you may check, I have removed the bug and implemented the only check for length to the password field.

[ani1609]

@ayann07 appreciated