User Authentication Feedback: Functionality

[RosemaryGonzaga]

Hi Simon, your user authentication is working very nicely! There are just a few things to address when it comes to rendering and clearing errors (see my notes below). I have a few more notes regarding styling (minor things), and I'll send those to you first thing tomorrow morning. Great progress so far!

General:

• Don't forget to add your production (Heroku) link to Progress Tracker. This can be done by going to the Final Projects tab -> Edit Your Final Project and then pasting it under “URL”

Clearing errors:

• You clear errors nicely when switching between forms via the provided links ("Sign Up to Tilda" on the login page, and "Log In" on the signup page). Bravo for getting that working so well! However, the errors persist when using the browser's back button. (Trigger the backend errors on the signup page, then hit the back button to see what I mean.) To fix this, dispatch your clearErrors action either when the session form mounts or unmounts.

Login errors:

• Replicate the beautiful frontend validation that you already have for the signup form. On blur of the email field, you should render "Please enter your email address." On blur of the password field, you should render "Please enter your password."
  • This should include not just the error message but showing the input border in a different color too.

Signup errors:

• Render error message when user signs up with an email address that's already in the database: "We're sorry, that email is taken." As discussed, you don't need to render this message before hitting the submit button, but once you submit the form with an already existing email address, that specific error message should render.

Signup form requires matching email addresses

• Technically, on Spotify, signing up requires the user to enter their email address twice, and the two addresses must match.

Nice to have (but don't spend too much time on this):

• Password error on signup form: Error message starts out as one thing ("Enter a password to continue.") and changes once the user starts typing --> "Password too short." Once the password length reaches 8 chars, the error message disappears entirely. You already have the last bit implemented, but if you are able to change the error message once the user starts typing, that would be a nice flourish to show off. (But again, this is relatively trivial and low-priority.)