frontend/src/components/Navbar.js

@@ -1,7 +1,6 @@
 import React, { useState, useEffect } from "react";
-import { Button } from "./Button";
 import { Link } from "react-router-dom";
-import { useAuth } from "../auth/AuthProvider";
+import { useAuth, logout } from "../auth/AuthProvider";
 import "./Navbar.css";
 import "@fortawesome/fontawesome-free/css/all.css";
 
@@ -20,7 +19,7 @@ function Navbar() {
     }
   };
 
-  const isLoggedIn = useAuth();
+  const [isLoggedIn] = useAuth();
 
   /* Shows the button after resizing the screen */
   useEffect(() => {
@@ -59,9 +58,25 @@ function Navbar() {
               </Link>
             </li>
             {isLoggedIn ? (
-              console.log("Eingeloggt")
-            ): (
-              console.log("Nicht eingeloggt")
+              <li className="nav-item">
+                <Link
+                  to="/logout"
+                  className="nav-links"
+                  onClick={() => logout()}
+                >
+                  Abmelden
+                </Link>
+              </li>
+            ) : (
+              <li className="nav-item">
+                <Link
+                  to="/login"
+                  className="nav-links"
+                  onClick={closeMobileMenu}
+                >
+                  Anmelden
+                </Link>
+              </li>
             )}
             <li>
               <Link
@@ -73,7 +88,6 @@ function Navbar() {
               </Link>
             </li>
           </ul>
-          {button && <Button buttonStyle="btn--outline">SIGN UP</Button>}
         </div>
       </nav>
     </>