[BUG] Le progrès des étudiants n'est pas sauvegardé lorsqu'ils quittent et reviennent dans le quiz.

Fixes #296

client/src/__tests__/pages/ManageRoom/ManageRoom.test.tsx

@@ -293,4 +293,74 @@ describe('ManageRoom', () => {
             expect(screen.queryByText('Student 1')).not.toBeInTheDocument();
         });
     });
+
+    test('handles user joined and leaves but name still seeable', async () => {
+        await act(async () => {
+            render(
+                <MemoryRouter>
+                    <ManageRoom />
+                </MemoryRouter>
+            );
+        });
+
+        await act(async () => {
+            const createSuccessCallback = (mockSocket.on as jest.Mock).mock.calls.find(call => call[0] === 'create-success')[1];
+            createSuccessCallback('Test Room');
+        });
+
+        await act(async () => {
+            const userJoinedCallback = (mockSocket.on as jest.Mock).mock.calls.find(call => call[0] === 'user-joined')[1];
+            userJoinedCallback(mockStudents[0]);
+        });
+        await act(async () => {
+            const userJoinedCallback = (mockSocket.on as jest.Mock).mock.calls.find(call => call[0] === 'user-joined')[1];
+            userJoinedCallback(mockStudents[1]);
+        });
+
+        await waitFor(() => {
+            expect(screen.getByText('Student 1')).toBeInTheDocument();
+
+        });
+        await waitFor(() => {
+            expect(screen.getByText('Student 2')).toBeInTheDocument();
+
+        });
+
+        const launchButton = screen.getByText('Lancer');
+        fireEvent.click(launchButton);
+
+        const rythmeButton = screen.getByText('Rythme du professeur');
+        fireEvent.click(rythmeButton);
+
+        const secondLaunchButton = screen.getAllByText('Lancer');
+        fireEvent.click(secondLaunchButton[1]);
+
+        await waitFor(() => {
+            expect(screen.getByText('2/60')).toBeInTheDocument();
+
+        });
+
+        await act(async () => {
+            const userDisconnectedCallback = (mockSocket.on as jest.Mock).mock.calls.find(call => call[0] === 'user-disconnected')[1];
+            userDisconnectedCallback(mockStudents[1].id);
+        });
+
+
+        await waitFor(() => {
+            expect(screen.getByText('Résultats du quiz')).toBeInTheDocument();
+
+        });
+        const toggleUsernamesSwitch = screen.getByLabelText('Afficher les noms');
+
+        // Toggle the display of usernames back
+        fireEvent.click(toggleUsernamesSwitch);
+
+        expect(screen.getByText('Student 1')).toBeInTheDocument();
+
+        expect(screen.getByText('Student 2')).toBeInTheDocument();
+
+        await waitFor(() => {
+            expect(screen.getByText('1/60')).toBeInTheDocument();
+        });
+    });
 });

client/src/pages/Teacher/ManageRoom/ManageRoom.tsx

@@ -29,8 +29,8 @@ import { AnswerType } from 'src/pages/Student/JoinRoom/JoinRoom';
 const ManageRoom: React.FC = () => {
     const navigate = useNavigate();
     const [socket, setSocket] = useState<Socket | null>(null);
-    const [students, setStudents] = useState<StudentType[]>([]);
+    const [connectedStudents, setConnectedStudents] = useState<StudentType[]>([]);
-    const [allStudents, setAllStudents] = useState<StudentType[]>([]);
+    const [totalStudents, setTotalStudents] = useState<StudentType[]>([]);
     const { quizId = '', roomName = '' } = useParams<{ quizId: string, roomName: string }>();
     const [quizQuestions, setQuizQuestions] = useState<QuestionType[] | undefined>();
     const [quiz, setQuiz] = useState<QuizType | null>(null);
@@ -46,8 +46,8 @@ const ManageRoom: React.FC = () => {
     useEffect(() => {
         if (newlyConnectedUser) {
             console.log(`Handling newly connected user: ${newlyConnectedUser.name}`);
-            setStudents((prevStudents) => [...prevStudents, newlyConnectedUser]);
+            setConnectedStudents((prevStudents) => [...prevStudents, newlyConnectedUser]);
-            setAllStudents((prevStudents) => [...prevStudents, newlyConnectedUser]);
+            setTotalStudents((prevStudents) => [...prevStudents, newlyConnectedUser]);
 
             // only send nextQuestion if the quiz has started
             if (!quizStarted) {
@@ -135,8 +135,8 @@ const ManageRoom: React.FC = () => {
             setSocket(null);
             setQuizQuestions(undefined);
             setCurrentQuestion(undefined);
-            setStudents(new Array<StudentType>());
+            setConnectedStudents(new Array<StudentType>());
-            setAllStudents(new Array<StudentType>());
+            setTotalStudents(new Array<StudentType>());
 
         }
     };
@@ -181,7 +181,7 @@ const ManageRoom: React.FC = () => {
 
         socket.on('user-disconnected', (userId: string) => {
             console.log(`Student left: id = ${userId}`);
-            setStudents((prevUsers) => prevUsers.filter((user) => user.id !== userId));
+            setConnectedStudents((prevUsers) => prevUsers.filter((user) => user.id !== userId));
         });
 
         setSocket(socket);
@@ -202,7 +202,7 @@ const ManageRoom: React.FC = () => {
                 }
 
                 // Update the students state using the functional form of setStudents
-                setStudents((prevStudents) => {
+                setConnectedStudents((prevStudents) => {
                     console.log('Current students:');
                     prevStudents.forEach((student) => {
                         console.log(student.name);
@@ -249,7 +249,7 @@ const ManageRoom: React.FC = () => {
                     }
                     return updatedStudents;
                 });
-                setAllStudents((prevStudents) => {
+                setTotalStudents((prevStudents) => {
                     let foundStudent = false;
                     const updatedStudents = prevStudents.map((student) => {
                         console.log(`Comparing ${student.id} to ${idUser}`);
@@ -304,10 +304,12 @@ const ManageRoom: React.FC = () => {
         if (nextQuestionIndex === undefined || nextQuestionIndex > quizQuestions.length - 1) return;
 
         setCurrentQuestion(quizQuestions[nextQuestionIndex]);
-        webSocketService.nextQuestion({roomName: formattedRoomName, 
+        webSocketService.nextQuestion({
+            roomName: formattedRoomName,
             questions: quizQuestions,
             questionIndex: nextQuestionIndex,
-                                       isLaunch: false});
+            isLaunch: false
+        });
     };
 
     const previousQuestion = () => {
@@ -496,7 +498,7 @@ const ManageRoom: React.FC = () => {
                             style={{ display: "flex", justifyContent: "flex-end" }}
                         >
                             <GroupIcon style={{ marginRight: '5px' }} />
-                            {students.length}/60
+                            {connectedStudents.length}/60
                         </div>
                     )}
                 </div>
@@ -542,7 +544,7 @@ const ManageRoom: React.FC = () => {
                                     socket={socket}
                                     questions={quizQuestions}
                                     showSelectedQuestion={showSelectedQuestion}
-                                    students={allStudents}
+                                    students={totalStudents}
                                 ></LiveResultsComponent>
                             </div>
                         </div>
@@ -578,7 +580,7 @@ const ManageRoom: React.FC = () => {
                     </div>
                 ) : (
                     <StudentWaitPage
-                        students={students}
+                        students={connectedStudents}
                         launchQuiz={launchQuiz}
                         setQuizMode={setQuizMode}
                     />