Front-end Authentication

For the front-end authentication, a simple Reactive Form is used, a great feature of Angular.

User must input his username and his password, plus he has a checkbox allows him to be kept logged in even if he leaves the page.

Username and password fields both have a required validation. If no input is provided, user can't submit a log in request. When both fields are filled, access is granted to user to submit a request.

If Remember me checkbox is checked, the response token is saved in the local storage of the browser. If it is not, the token is saved in session storage. Session storage is cleared when user leaves page.

If user provided wrong credentials, a message will appear on both username and password input, saying that wrong credentials were given.

Since front-end is designed for administrators, only users with ADMIN role will be able to access the resources. If a successful login happens with a simple user, he will be redirected back to login once he is on dashboard page.