Ready to build profile route page

geneit_app/src/widgets/BaseAuthenticatedPage.tsx

@@ -9,9 +9,10 @@ import Toolbar from "@mui/material/Toolbar";
 import Typography from "@mui/material/Typography";
 import { useSetAtom } from "jotai";
 import * as React from "react";
-import { Outlet, useNavigate } from "react-router-dom";
+import { Link, Outlet, useNavigate } from "react-router-dom";
 import { AuthApi } from "../api/AuthApi";
 import { User, UserApi } from "../api/UserApi";
+import { RouterLink } from "./RouterLink";
 
 export function BaseAuthenticatedPage(): React.ReactElement {
   const [user, setUser] = React.useState<null | User>(null);
@@ -89,13 +90,17 @@ export function BaseAuthenticatedPage(): React.ReactElement {
     );
 
   return (
-    <>
-      <AppBar position="fixed">
+    <div
+      style={{ minHeight: "100vh", display: "flex", flexDirection: "column" }}
+    >
+      <AppBar position="sticky">
         <Toolbar>
           <Icon path={mdiFamilyTree} size={1} style={{ marginRight: "1rem" }} />
+
           <Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
-            GeneIT
+            <RouterLink to="/">GeneIT</RouterLink>
           </Typography>
+
           <div>
             <Button size="large" color="inherit">
               {user.name}
@@ -126,13 +131,18 @@ export function BaseAuthenticatedPage(): React.ReactElement {
               open={Boolean(anchorEl)}
               onClose={handleCloseMenu}
             >
-              <MenuItem onClick={handleCloseMenu}>Profil</MenuItem>
+              <Link
+                to="/profile"
+                style={{ color: "inherit", textDecoration: "none" }}
+              >
+                <MenuItem onClick={handleCloseMenu}>Profil</MenuItem>
+              </Link>
               <MenuItem onClick={signOut}>Déconnexion</MenuItem>
             </Menu>
           </div>
         </Toolbar>
       </AppBar>
       <Outlet />
-    </>
+    </div>
   );
 }