User Creation/Login Page

[cellador]

User authentication is managed via JSON Web Tokens, which are stored in the browser's localstorage

We want to access a separate login and user creation page via the menu, however these should only appear when there is no token present in localstorage.

The pages, when opened, should replace the main map and display a form for the e-mail address, a password and the signup/login button.

If the button is clicked, we POST the data to the user controller ('/auth' for login and '/register' for creation) and receive either

• an error message any cases such as: the email address is already registered, the password does not match the saved password etc. These messages should be displayed accordingly.
• For the successful login/creation, the refresh and access JWT tokens, as well as a scope token, are stored in the localstorage, we display a success message

Since we have regular user and admin accounts, the backend will also send a scope token, which we can use to limit the UI from showing the admin panel for example. However, this has nothing to do with authorization since anyone can change this token to read whatever we want. It's just used for the visibility of elements.

[DaneSpaeth]

I thought we could share the current state and the current issues here: (check out the UserCreation2 branch) I added a first draft of the SignUp form. I also refactored the Modal.js. I removed the state completely as read that you should have a single point of truth, which now is the state param of the SignUp Component. I think, the show state of Modal is thus not necessary but feel free to disagree on this and discuss! Easy things to fix next:

• Make entry in main menu fit with the rest of the entries
• Make the form itself visually more appealing
• Move the close button to the right with a cross (like normal) (Maybe move that all the way down to ModalInner, as this might be the same for all future Modals?)
• Refactor the handleChange Methods in SignUp.js (I did not manage to somehow get the name of the button into a generalized handleChange function such that you could map the keys of the state to the button name. With that you would only need one function for all inputs and not a function per input)
• Link to Backend? Somehow get the accounts into the database etc.
• Finalize Input fields (do we want to have a UserName etc, more Info from the User, maybe a second form)

[cellador]

The lion's share of this task is DONE thanks to @DaneSpaeth! We now got working signup/login/logout forms behind which backend routes can be locked.

I'll keep this issue open mostly because, aside from some minor visual fixes, it would be nice to be able to hide non-accessible menu items such as the upcoming admin panel by checking a role cookie. However there is nothing like this implemented yet.

[cellador]

I've implemented a hiding class for non-accessible menu items in 3e68e8403aea2ebb9ff05cc7a52991b4913cd5a7. Since we've reached everything that we need for the MVP milestone, I'm closing this issue, some things we haven't gotten around to are picked up in #19.