FEAT: Sign Up flow

[nikita-remeslov]

What feature?

• Add /sign-up route
• Add sign-up form
• Add sign-up action flow
• After form submission, the user is redirected to the app /
• Save an authenticated user to the redux store
• Add form validation
• "Log in" link should navigate to the Sign In page

P.S. Sign In/Sing Up pages can use one layout

Add screenshots

Acceptance criteria

Following this Test Cases: https://docs.google.com/spreadsheets/d/1b-xRyyn39r4N9k-P7zC618jotIVunZbbz1Vv9ipHNOM/edit?gid=1854802596#gid=1854802596

• Add a new route /sign-up to the application's routing configuration and ensure that navigating to /sign-up renders the sign-up form.
• Develop a sign-up form that includes fields for user input, such as email, password, and any additional required fields (e.g., Full Name).
• Ensure the form is styled consistently with the application's design and UX guidelines.
• The sign-up form should be user-friendly and aligned with the layout used on the Sign In page if they share the same layout.
• Implement the functionality to handle form submission, including sending the data to the backend API for user registration.
• Upon successful form submission and authentication, the user should be redirected to the app's main page
• Implement client-side validation for the sign-up form fields to ensure that all required fields are correctly filled out and that the input data meets the validation criteria
• Display appropriate error messages for invalid input or failed sign-up attempts.

[DaniellaZambrano]

There is a visual issue the first time I type in the "Repeat Password" field: another eye icon appears, which is duplicated, and the color and shape are incorrect. This needs to be fixed

Steps to reproduce the issue: (Browser: Microsoft Edge Version 127.0.2651.105 (Official build) (64-bit))

1. Open http://localhost:3000/sign-up
2. Fill the "Repeat Password" field, since the first word the icon appears

Image with the issue:

[DaniellaZambrano]

@lfelix3011 I'll be waiting for your response, thanks!

[lfelix3011]

@DaniellaZambrano Thanks for the review, and QA, doing an amazing job looking for all the details and requirements.

I thinks that may be due to the browser, IE and Edge has a build in show and hide for input type password, but Firefox and Chrome don't have it.

If the theory is correct it should happens for all the inputs type password for that specific browser. Even though, tomorrow i will be confirming this, and implementing a solution, maybe using a pseudo element of css to hide that build in action of certain browsers, you can check the images that were taken when the task was completed in the link to the pull request below.

#20

Note: When the images was capture I was using Chrome

[DaniellaZambrano]

Yes you're right I forgot to put my browser sorry, I already update it

[lfelix3011]

@DaniellaZambrano Here is the implementation to hide the default reveal icon

Here is the Pull Request #68

[DaniellaZambrano]

Hi @lfelix3011 , I don't think this message should be appears to an user

Edge:

Opera:

[DaniellaZambrano]

@lfelix3011 Thanks for the feature at moment everything was ok!