log color to fix

containers/api/src/app.controller.ts

@@ -455,6 +455,8 @@ export class AppController {
 	user.sessionNumber-- ;
 	if (!user.sessionNumber)
 		user.status = 0;
+	console.log("quit sessionNUmber :",user.sessionNumber);
+	
 	await this.userService.save(user);
 	console.log("User quit");
   }
@@ -465,6 +467,8 @@ export class AppController {
 
 	const user = await this.userService.findOne(req.user.username);
 	user.sessionNumber++ ;
+	console.log("addSession sessionNUmber :",user.sessionNumber);
+
 	await this.userService.save(user);
   }
 

containers/api/src/auth/login42.ts

@@ -74,14 +74,14 @@ export class loginClass {
 				friends: null,
 				blocked: null,
 				photo: null,
-				sessionNumber: 0,
+				sessionNumber: 1,
 			  };
 			await this.usersService.create(user);
 		}
-		// if (user.status !== 2 || user.status === 0) //super
+		// if (user.status !== 2) //super
 		// 	user.status = 1;
 		// user.sessionNumber++;
-		// console.log(`in login42 user= ${user}`)
+		console.log(user.sessionNumber);
 		const myJSON = JSON.stringify(user);
 		console.log(`in login42 user= ${myJSON}`)
 

containers/api/src/users/users.service.ts

@@ -58,7 +58,7 @@ export class UsersService {
 
 	async getFriends(username: string) {
 		const user = await this.findOne(username)
-		let friendsTab = user.friends
+		let friendsTab = user.friends || []
 		console.log(friendsTab)
 		// friendsTab = ['apommier', 'syd']
 		const friends = await this.userRepository.query("SELECT * FROM \"User\" WHERE username = ANY ($1);", [friendsTab]);

containers/react/interfaces.tsx

@@ -16,6 +16,7 @@ export interface User {
 	partyInvite: Record<string, string>[];
 	friends: string[];
 	blocked: string[];
+	sessionNumber: number;
   }
 
 export interface Conv {

containers/react/src/components/App.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import {Routes, Route, Navigate} from 'react-router-dom';
+import { Routes, Route, Navigate } from 'react-router-dom';
 import HomeLogin from "../pages/LoginButton.tsx";
 
 import Home from "../pages/Home.tsx";
@@ -10,7 +10,7 @@ import Login42 from "../pages/Login42.tsx";
 import Messages from "../pages/Messages.tsx";
 import QrCode from '../pages/QrCode.tsx'
 import { useLocation } from "react-router-dom";
-import {AnimatePresence} from "framer-motion";
+import { AnimatePresence } from "framer-motion";
 
 import SuccessToken from '../script/tokenSuccess.tsx'
 
@@ -22,40 +22,59 @@ import Logout from "./Profile/Logout.tsx";
 import api from "../script/axiosApi.tsx"
 
 
-function AnimatedRoute () {
+function AnimatedRoute() {
 	// const location = useLocation();
 
 	useEffect(() => {
 		const handleBeforeUnload = async (event: { preventDefault: () => void; returnValue: string; }) => {
 			if (!localStorage.getItem('token'))
-				return ;
+				return;
 			try {
 				await api.post("/quit");
-			} catch(err) {
+			} catch (err) {
 				console.log(err);
 			}
 		};
 
-		window.addEventListener('beforeunload', handleBeforeUnload);
 
+		window.addEventListener('beforeunload', handleBeforeUnload);
 		return () => {
-		  window.removeEventListener('beforeunload', handleBeforeUnload);
+			window.removeEventListener('beforeunload', handleBeforeUnload);
 		};
-	  }, []);
+	}, []);
+
+	useEffect(() => {
+
+		const handleLoad = async () => {
+			console.log('Page loaded');
+			console.log("je suis a addSession");
+			if (!localStorage.getItem('token'))
+				return;
+			try {
+				await api.post("/addSession");
+			} catch (err) {
+				console.log(err);
+			}
+		};
+
+		window.addEventListener('load', handleLoad);
+		return () => {
+			window.removeEventListener('load', handleLoad);
+		};
+	}, []);
 
 	const location = useLocation();
-	if (!localStorage.getItem('token'))
-	{
+	if (!localStorage.getItem('token')) {
 		return (
 			<AnimatePresence>
-			<Routes location={location} key={location.pathname}>
-				<Route path="/" element={<HomeLogin/>}/>
-				<Route path="/token" element={<SuccessToken />}/>
+				<Routes location={location} key={location.pathname}>
+					<Route path="/" element={<HomeLogin />} />
+					<Route path="/token" element={<SuccessToken />} />
 
-				{/* <Route path="/404" element={<HomeLogin/>} /> */}
-          		{/* <Route path="*" element={<Navigate to="/404" />} /> */}
-			</Routes>
-		</AnimatePresence>
+					{/* <Route path="/404" element={<HomeLogin/>} /> */}
+					{/* <Route path="*" element={<Navigate to="/404" />} /> */}
+				</Routes>
+			</AnimatePresence>
 		)
 	}
 
@@ -64,26 +83,26 @@ function AnimatedRoute () {
 			<Routes location={location} key={location.pathname}>
 
 				{/* <Route path="/login" element={<HomeLogin/>}/> */}
-				<Route path="/" element={<Home/>}/>
-				<Route path="/profile" element={<Home/>}/>
-				<Route path="/profile/:username" element={<Home/>}/>
-				<Route path="/qr" element={<QrCode/>}/>
+				<Route path="/" element={<Home />} />
+				<Route path="/profile" element={<Home />} />
+				<Route path="/profile/:username" element={<Home />} />
+				<Route path="/qr" element={<QrCode />} />
 
-				<Route path="/2fa" element={<DoubleAuth/>}/>
-				<Route path="/Social" element={<Social/>}/>
+				<Route path="/2fa" element={<DoubleAuth />} />
+				<Route path="/Social" element={<Social />} />
 
-				<Route path="/token" element={<SuccessToken />}/>
-				<Route path="/game" element={<PlayButton />}/>
-				<Route path="/pong" element={<Game />}/>
-				<Route path="/pong/play" element={<Field />}/>
+				<Route path="/token" element={<SuccessToken />} />
+				<Route path="/game" element={<PlayButton />} />
+				<Route path="/pong" element={<Game />} />
+				<Route path="/pong/play" element={<Field />} />
 				{/* <Route path="/profile" element={<PlayButton />}/> */}
 
-				<Route path="/login42" element={<Login42 />}/>
-				<Route path="/logout" element={<Logout />}/>
-				<Route path="/messages" element={<Messages />}/>
+				<Route path="/login42" element={<Login42 />} />
+				<Route path="/logout" element={<Logout />} />
+				<Route path="/messages" element={<Messages />} />
 
 				<Route path="/404" element={<PageNotFound />} />
-          		<Route path="*" element={<Navigate to="/404" />} />
+				<Route path="*" element={<Navigate to="/404" />} />
 			</Routes>
 		</AnimatePresence>
 	)

containers/react/src/components/Messages/GameModal.tsx

@@ -79,10 +79,6 @@ const GameModal = ({ handleClose }: ModalGame) => {
 	  path += 'superpower=true&';
 	}
   
-	const obstacleCheckbox = document.querySelector<HTMLInputElement>('input[value="obstacle"]');
-	if (obstacleCheckbox && obstacleCheckbox.checked) {
-	  path += 'obstacle=true&';
-	}
 
 	const speedCheckbox = document.querySelector<HTMLInputElement>('input[value="speed"]');
 	if (speedCheckbox && speedCheckbox.checked) {
@@ -132,10 +128,9 @@ const GameModal = ({ handleClose }: ModalGame) => {
 			{/* <button onClick={handleButtonClick}>Draw on Canvas</button> */}
 			<div className='checkbox'>
 				<p><input type="checkbox" value="superpower"/> Super Power </p>
-				<p><input type="checkbox" value="obstacle"/> Obstacle </p>
 				<p><input type="checkbox" value="speed"/> Faster and Faster </p>
 			</div>
-			<button className="submit" onClick={handleButtonClick} >Play</button>
+			<button className="playInvite" onClick={handleButtonClick} >Play</button>
           	{/* <button className="submit" onClick={handleClose}>Cancel</button> */}
 		</div>
 

containers/react/src/components/Social/Friend.tsx

@@ -66,6 +66,8 @@ export default function  Friend({currentUser}: UserProps)
 	function getStatus(friend: User)
 	{
 		let status = friend.status		
+		let session =friend.sessionNumber
+		console.log(`session= ${session}`)
 		console.log(`status= ${status}`)
 		let statusColor;
 

containers/react/src/components/Social/FriendRequest.tsx

@@ -94,7 +94,7 @@ export default function  Friend({currentUser}: UserProps)
   	}
 
 	return (
-		<UserChat>
+		<UserChat className="centermargin">
 		{profilePicture ? (
 			<img className="pic-user" src={`data:image/jpeg;base64,${profilePicture}`} />
 		 ) : (

containers/react/src/styles/Messages.css

@@ -222,6 +222,16 @@ p {
 	height: 25px;
 }
 
+.playInvite{
+    margin: 5%;
+    color: ghostwhite;
+    outline: 0;
+    border-radius: 100px;
+    padding: 3%;
+    background-image: linear-gradient(90deg, #5843e4, #5a0760);
+    width: 42%;
+    font-size: x-large;
+}
 .darkSubmit{
 	display: inline-block;
 	color: white;