User account page and auth functionality

[aejgardner]

• 3 user account components created and functionality added to update and delete user account.
• custom hook and helper function made for front end login / register / forgot password request validation.
• private route component created for protected components.
• combineReducers() no longer used.
• forgot password and password reset components created, functionality added.
• fourohfour component created.
• header component created.
• axios routes corrected.

[kierancott]

Updated Issues

Account registration - error handling, Issue https://github.com/develop-me/bagajob/issues/43

Action:

• extract error message from state and render below form
• create function that clears errors on form load

Result:

Instead of the app crashing due to unprocessable entity, the below error is shown:

Login, Issue https://github.com/develop-me/bagajob/issues/44

Action:

Bearer token has been added to the header of the request.

Result:

200 - OK: API now approves access and loads main page with code 200.

Reset Password, Issue https://github.com/develop-me/bagajob/issues/45

Commit: https://github.com/develop-me/bagajob/commit/201f10d8c076628ff3c3c7c042550c7c56917daf

Action:

• Added useEffect function that clears authResponse on component load
• Rendered authResponse as <p> element below form

Result:

Feedback is given to user while loading, and when email is sent - instructing them to check their inbox.

Reset password (with token), Issue https://github.com/develop-me/bagajob/issues/46

Commit: https://github.com/develop-me/bagajob/pull/42/commits/55630843d1a5c240161331762018bed7dedafe9a

Action:

• Installed use-query-params and query-string npm packages
• Wrapped all React Routes with <QueryParamProvider ReactRouterRoute={Route}>
• Created hooks to extract email and token from URL and dispatch with password

Result:

• Email and token are correctly extracted from the URL and posted to the API in format: {email: "email@email.com", password: "newpassword", token: "tokenstring47HFD98SJNFUIhki93"}

Other issues resolved by this Pull Request:

Logout functionality, Issue https://github.com/develop-me/bagajob/issues/49

Commits https://github.com/develop-me/bagajob/pull/42/commits/3a0938cecb37a54388c621b722b3193f2eb3ef7d https://github.com/develop-me/bagajob/pull/42/commits/fe2857b9a0d84667a245b30efaa334e02709c9cb

Action:

• Created route at api/home/logout
• Created logout reducer to clear user (and thus bearer token) from state
• Redirect user to login page

Result:

Visiting api/home/logout and clicking "Log Out" now clears state and prompts user to return to login

More styling still required.

Single job - user ID undefined, Issue https://github.com/develop-me/bagajob/issues/50

Commit https://github.com/develop-me/bagajob/pull/42/commits/ee491d805cecd146b292fd2ccf8327c06a1dfc17, https://github.com/develop-me/bagajob/pull/42/commits/e09682b977347eefbc961bd925a35025ee07e000

Action:

• user_id is now used correctly in the URL
• Bearer token has been added to the header of the request.

Result:

422 - Unprocessable Entity : API is no longer returning an authorisation error. Bearer token correctly used in header.

[kierancott]

Closed in error.

[kierancott]

Updated Issues

- General feedback - the errors displayed to the User in the front end should be non-programmery, so no mention of status codes, etc. - could be a good one to give to a new person and probably not necessary to fix for MVP since we're short on time.

Moved to separate issue for a later date post-MVP (Issue https://github.com/develop-me/bagajob/issues/55)

- Issue #43 - see issue

Now resolved Commit https://github.com/develop-me/bagajob/pull/42/commits/b68f7d7c0eec210c3aa2d5f9e91c14a6db8006e8

- #46 When resetting password Client doesn't seem to send token, email, password to server.

(Issue https://github.com/develop-me/bagajob/issues/46) Email, token and password now being correctly sent and backend returns 200 OK. Commit https://github.com/develop-me/bagajob/pull/42/commits/b68f7d7c0eec210c3aa2d5f9e91c14a6db8006e8

- When I enter an incorrect password on logging in, I see the error on the screen for a short period then it bombs out:

Now resolved Commit https://github.com/develop-me/bagajob/pull/42/commits/b68f7d7c0eec210c3aa2d5f9e91c14a6db8006e8

- When I get through adding a new job, the post request is bombing out because active and stage are not being sent in the POST request

Now resolved, active and stage are included in the POST request. Commit https://github.com/develop-me/bagajob/pull/42/commits/bc52e8dc009e03c547dc4596b15eba7a53c89212

NB - An issue still remains with this route that would require your attention: https://github.com/develop-me/bagajob-API/issues/23

[kierancott]

Updated Issues

When I register a new user, the POST route for registration works fine, however the Client then makes a GET request for UserID 5's jobs and bombs out... my guess is that state is not getting updated with the User sent back from the backend on successful registration. You might not be seeing it if you're staying in the same browser session and not fully clearing state before trying registration again.

---

Resolution:

Commit https://github.com/develop-me/bagajob/pull/42/commits/9cfcb733717c7c4645573477277570941f1d09b9

When a POST request is made to /register, the bearer token is included in the header, results in status 200 OK when redirected to GET /user/:id/jobs

[nosvalds]

To Do

• User account page doesn't display the logged in user or query the backend appropriately

[kierancott]

Update:

• User's name and initials lifted from state and rendered on account page
• Navbar component completed and user initials rendered in top right corner

[kierancott]

Update:

• Bearer token now included in PATCH & DELETE requests to api/user/:id

• Error message is displayed Request failed with status code 422 if a bad name or email is sent

• Name and initials dynamically update on successful PATCH request

• PATCH api/user/:id - Returns 200 OK

• DELETE api/user/:id - Returns 204 No Content