Issue #10 Solution

[zacharynoel]

Changes

List Changes Introduced by this PR

1. The fixes from solution 4 are included. This includes the fix to authReducer to properly update state with the user's email, and the fix in OrderForm to properly update 'order_item' and 'quantity' .
2. Nav component has been updated to display the user's email address above the navigation buttons if one is found in state, and displays 'Not logged in!' otherwise. The useSelector hook is being used to pull auth data from state.

Purpose

Describe the problem or feature in addition to a link to the issues.

• Link to issue: Feature Request: User Display in Nav Shift3/react-challenge-project-jan-2022#10
• Description: There is no indication of the user's login status after logging in. It would be appropriate to display their email somewhere in the app to let them know that they have successfully logged in, and the navigation bar is a good spot for the user to easily and quickly notice it.

Approach

How does this change address the problem?

This change displays the user's status directly above the navigation buttons. If the user is logged in, it will display 'Current User: ' followed by their email address. If the user is not logged in (as in, no auth data in state due to navigating to a page directly), it will display 'Current User: Unknown!'.

Pre-Testing TODOs

What needs to be done before testing

• There are no pre-testing steps for this task.

Testing Steps

How do the users test this change?

1. Go to the login page and enter any email address and password then click to login.
2. Make sure you see 'Current User: ' followed by your email address directly above the navigation buttons in the nav bar.
3. Refresh the page to clear state, and make sure it now says 'Current User: Unknown!'.

Learning

Describe the research stage

Prior knowledge from previous tasks on using the useSelector hook to pull auth data from state. Otherwise, there was no research required for this task.

Closes Shift3#10