GrossesMitaines/grosses-mitaines-ui/src/components/Topbar.js

@@ -2,18 +2,28 @@ import React, { useEffect, useState } from "react";
 import Container from 'react-bootstrap/Container';
 import Nav from 'react-bootstrap/Nav';
 import Navbar from 'react-bootstrap/Navbar';
+import Button from 'react-bootstrap/Button';
 import { Link } from "react-router-dom";
 import Dropdown from "react-bootstrap/Dropdown";
 import { useCookies } from "react-cookie";
 
 const Topbar = () => {
-    const [cookies, setCookie] = useCookies(['name']);
-    var user = cookies.GMGM ?? null;
+    const [cookies, setCookie, removeCookie] = useCookies(['name']);
+    const [user, setLogin] = useState(null);
     useEffect(() => {
-        if (cookies.GMGM !== user)
-            user = cookies.GMGM;
+        setLogin(cookies.GMGM ?? null);
     });
 
+    function logOut() {
+        const response = fetch(`https://localhost:7292/api/Logout`, {
+            method: 'POST',
+            credentials: 'include'
+    })  
+
+    removeCookie("GMGM");
+    setLogin(null); // Y U NO WORK?!?
+    }
+
     return (
         <Navbar expand="sm" className="topbar-container">
             <Container>
@@ -70,9 +80,9 @@ const Topbar = () => {
                                 </Link>
                             </Dropdown.Item>
                             <Dropdown.Item>
-                                <Link className="nav-link" to="/logout" >
+                                <Button className="nav-link" onClick={() => logOut()}>
                                     Déconnexion
-                                </Link>
+                                </Button>
                             </Dropdown.Item>
                             {user.role === "Administrateur" &&
                             <Container>