1qk1 / productivity-platform

Open Source productivity platform in the making
https://prodapp.xyz/
MIT License
3 stars 0 forks source link

improve error messages and handling #99

Closed 1qk1 closed 4 years ago

ghost commented 5 years ago

What kind of error messages are you referring to here? I think it would be nice to have flash messages for when registration succeeds or fails, and a flash message for login failure.

1qk1 commented 5 years ago

I am reffering to what the error messages say and at what cases it will send an error (I rushed through them a little bit and the errors weren't very descriptive, they are way better now) for example when the backend can't reach the database, or if there is a duplicate or something like that, because I think I haven't covered all cases. Also I was thinking of adding a client side error through an axios interceptor when the user's network is down and can't reach the server.

For the flash messages in general, the project is already using react-toastify for confirmations and errors in some places, like the pomodoro page (when a pomodoro is completed or an error when it can't send that request) so that can be used easily in other places too (it's super simple to use). Also the toastify container is only in the logged in page so that will have to be moved in App.js to cover all pages.

For the fail registration/login flash messages, I think it's better to show the error on the form itself because it's more expected from a user perspective than trying to be kinda flashy with the flash messages and use them a lot. For the register success though I think it would look nice, like some websites that say "Registration successful, you will be redirected in x seconds" because it makes the user know what's happening and where the page will take him or something. Just my thoughts, I'm open for discussion.

Also sorry for replying slow, I've been busy.

ghost commented 5 years ago

In previous project I have had the back-end respond with an error object consisting of each field in the form, and a description of the error. Then redux would dispatch the change to display the errors returned from an axios call. This way each field has its own error message. Is this something you would be interested in implementing? An example of a response would be the following.

{
  "username": "Username is required.",
  "email": "Invalid email",
  "password": "password must be at least 6 characters"
}

Then react will display each error under the corresponding field.
(Also I like that the title of the page changes when the pomodoro app is running. Nice touch!)

1qk1 commented 5 years ago

Basically you're talking about form validation, right? Yes that's an important improvement, I wanted to do that some time. I will get back on the project and do a lot of things when I finish with my portoflio!

(Thank you, I want to improve it and make this using react-helmet soon too!)