web/src/layouts/MainLayout/MainLayout.js

@@ -1,6 +1,8 @@
 import { Link, routes } from '@redwoodjs/router'
+import { useAuth } from '@redwoodjs/auth'
 
 const MainLayout = ({ children }) => {
+  const { logIn, logOut, isAuthenticated } = useAuth()
   return (
     <>
       <header>
@@ -18,6 +20,11 @@ const MainLayout = ({ children }) => {
             <li>
               <Link to={routes.contact()}>Contact</Link>
             </li>
+            <li>
+              <a href="#" onClick={isAuthenticated ? logOut : logIn}>
+                {isAuthenticated ? 'Log Out' : 'Log In'}
+              </a>
+            </li>
           </ul>
         </nav>
       </header>