modification navbar + info dynamique

cryptide_project/src/App.tsx

@@ -77,10 +77,10 @@ function App() {
             <BrowserRouter>  
               {hasNavbarVisible && <AppNavbar changeLocale={changeLocale} />}
               <Routes>
-                <Route path="/" element={<Home />} />
+                <Route path="/" element={<Play />} />
                 <Route path="/login" element={<Login />} />
                 <Route path="/signup" element={<SignUp />} />
-                <Route path="/play" element={<Play/>} />
+                <Route path="/home" element={<Home/>} />
                 <Route path="/lobby" element={<Lobby/>} />
                 <Route path="/endgame" element={<EndGame/>} />
                 <Route path="/game" element={<InGame locale={locale} changeLocale={changeLocale}/>}/>

cryptide_project/src/Components/NavBar.tsx

@@ -53,12 +53,15 @@ function AppNavbar({changeLocale}) {
                 <Navbar.Toggle aria-controls="basic-navbar-nav" />
                 <Navbar.Collapse id="basic-navbar-nav">
                     <Nav className="me-auto">
-                        <NavDropdown title={<span style={{ color: theme.colors.text }}><FormattedMessage id="play" /></span>} className="navbar-title" id="basic-nav-dropdown">
-                        <NavDropdown.Item href="play"><FormattedMessage id="play_solo" /> </NavDropdown.Item>
-                        <NavDropdown.Divider />
-                        <NavDropdown.Item href="play"><FormattedMessage id="create_room" /> </NavDropdown.Item>
-                        <NavDropdown.Item href="play"><FormattedMessage id="join" /> </NavDropdown.Item>
-                        </NavDropdown>
+                        <Nav.Link href="/" style={{ color: theme.colors.text }}>
+                            Jouer
+                        </Nav.Link>
+                        <Nav.Link href="/home" style={{ color: theme.colors.text }}>
+                            Présentation
+                        </Nav.Link>
+                        <Nav.Link href="/info" style={{ color: theme.colors.text }}>
+                            Info
+                        </Nav.Link>
                     </Nav>
                     <div className='leftdiv'>
                         <Nav className="ml-auto navbar-title-dd">

cryptide_project/src/Pages/InfoPage.tsx

@@ -24,12 +24,13 @@ import Alert from 'react-bootstrap/Alert';
 import MGlass from "../res/icon/magnifying-glass.png";
 import Param from "../res/icon/param.png";
 import Info from "../res/icon/infoGreen.png"; //todo changer la couleur de l'icon
+import { useAuth } from '../Contexts/AuthContext';
+import { useEffect } from 'react';
 
 //@ts-ignore
 function InfoPage({locale, changeLocale}) {    
-    
     const theme = useTheme();
-
+    const {isLoggedIn, login, user, setUserData, manager } = useAuth();
     const styles = {
         roux: { backgroundColor: ColorToHexa(Color.REDHEAD), width: '15px', height: '15px', display: 'inline-block', marginRight: '5px' },
         blond: { backgroundColor: ColorToHexa(Color.BLOND), width: '15px', height: '15px', display: 'inline-block', marginRight: '5px' },
@@ -37,6 +38,20 @@ function InfoPage({locale, changeLocale}) {
         blanc: { backgroundColor: ColorToHexa(Color.WHITE), border: '1px solid #ccc', width: '15px', height: '15px', display: 'inline-block', marginRight: '5px' },
         chatain: { backgroundColor: ColorToHexa(Color.BROWN), width: '15px', height: '15px', display: 'inline-block', marginRight: '5px' },
     };
+
+    useEffect(() => {
+        if (user == null){
+            manager.userService.fetchUserInformation().then(([user, loggedIn]) =>{
+                if (user!=null){
+                    if (loggedIn){
+                        login()
+                        setUserData(user)
+                    }
+                }
+            })
+        }
+    }, [isLoggedIn]);
+
     return (
         //! Il faudra possiblement faire une gestion des mode de jeu, pour modifier les regles en fonction de ce dernier.
     <div className='infoPage'>