cryptide_project/src/Pages/Home.css

@@ -4,7 +4,6 @@
     /* background-color: #D7D4C6; */
     background-color: #fff;
     min-height: 100vh;
-    display: flex;
     font-size: calc(10px + 2vmin);
     /* color: #2A4541; */
 }

cryptide_project/src/Pages/Lobbies.tsx

@@ -28,7 +28,7 @@ class LobbyDataProps {
     }
 }
 
-let cptNavigation = 0
+// let cptNavigation = 0
 
 function Lobbies() {
     const theme=useTheme();
@@ -42,6 +42,8 @@ function Lobbies() {
 
     const [showAvailable, setShowAvailable] = useState(true);
 
+    const [cptNavigation, setCptNavigation] = useState(0);  
+
     const handleShowAllClick = () => {
         setShowAvailable(false);
     };
@@ -50,7 +52,18 @@ function Lobbies() {
         setShowAvailable(true);
     };
 
+    const handleSetFirst = () => {
+        setFirst(false);
+        socket.emit("request lobbies");
+    };
+    
+    const handleSetCptNavigation = () => {
+        setCptNavigation((prevCpt) => prevCpt + 1);
 
+        if (cptNavigation % 2 === 0 && navigationType.toString() === "POP") {
+            socket.emit("player quit");
+        }
+    };
     const filteredLobbies = lobbyData.filter((lobby) =>
         lobby.roomNum.toLowerCase().includes(searchTerm.toLowerCase()) ||
         lobby.headPlayer.pseudo.toLowerCase().includes(searchTerm.toLowerCase())
@@ -59,26 +72,25 @@ function Lobbies() {
     const filteredLobbiesToShow = showAvailable
     ? filteredLobbies.filter((lobby) => lobby.started == false && lobby.nbPlayer < 6) //* retire les lobbies pleins ou commencés
     : filteredLobbies;
-
-
-
+    
+    
+    
     const setFirstData = (first: boolean) => {
         setFirst(first)
     }
 
-    const navigationType = useNavigationType()
-    cptNavigation++
-    if (cptNavigation % 2 == 0){
-        if (navigationType.toString() == "POP"){
-            socket.emit("player quit")
-        }
-    }
+    const navigationType = useNavigationType();
+    
+    
 
+    handleSetCptNavigation();
+    
     if (first){
-        setFirst(false)
-        socket.emit("request lobbies")
+        handleSetFirst();
     }
-
+    
+    
+    
     useEffect(() => {
         socket.on("request lobbies", (map) => {
             const jsonMap = JSON.parse(map)