Full-Stack React Projects - Second Edition

Rendering an option to teach

In the frontend of the classroom application, we can render different options based on whether an educator is currently browsing the application. In this section, we will add the code to conditionally display a link to TEACH on the navigation bar, which will only be visible to the signed-in users who are also educators.

We will update the Menu component, as follows, within the previous code that only renders when a user is signed in.

mern-classroom/client/core/Menu.js:

{auth.isAuthenticated() && (<span>    {auth.isAuthenticated().user.educator &&        (<Link to="/teach/courses">           <Button style={isPartActive(history, "/teach/")}>               <Library/> Teach </Button>        </Link>)    }    ...}

This link, which is only visible to educators, ...