gmatte/EvalueTonSavoir
1
0
Fork 0
mirror of https://github.com/ets-cfuhrman-pfe/EvalueTonSavoir.git synced 2025-08-11 21:23:54 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #205 from ets-cfuhrman-pfe/JubaAzul/issue145

Browse source 
Juba azul/issue145
This commit is contained in:
Christopher (Cris) Fuhrman 2025-01-22 20:49:54 -05:00 committed by GitHub
commit 4b133400d4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 33 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
client/src/__tests__/pages/Student/StudentModeQuiz/StudentModeQuiz.test.tsx
View file

@ -77,21 +77,5 @@ describe('StudentModeQuiz', () => {
}); });
test('navigates to the previous question', async () => {
act(() => {
fireEvent.click(screen.getByText('Option A'));
});
act(() => {
fireEvent.click(screen.getByText('Répondre'));
});
act(() => {
fireEvent.click(screen.getByText('Question précédente'));
});
expect(screen.getByText('Sample Question 1')).toBeInTheDocument();
expect(screen.getByText('Option B')).toBeInTheDocument();
});
}); });

4
client/src/components/Questions/MultipleChoiceQuestion/MultipleChoiceQuestion.tsx
View file

@ -23,6 +23,7 @@ interface Props {
} }
const MultipleChoiceQuestion: React.FC<Props> = (props) => { const MultipleChoiceQuestion: React.FC<Props> = (props) => {
const { questionStem: questionContent, choices, showAnswer, handleOnSubmitAnswer, globalFeedback } = props; const { questionStem: questionContent, choices, showAnswer, handleOnSubmitAnswer, globalFeedback } = props;
const [answer, setAnswer] = useState<string>(); const [answer, setAnswer] = useState<string>();
@ -73,7 +74,9 @@ const MultipleChoiceQuestion: React.FC<Props> = (props) => {
{globalFeedback && showAnswer && ( {globalFeedback && showAnswer && (
<div className="global-feedback mb-2">{globalFeedback}</div> <div className="global-feedback mb-2">{globalFeedback}</div>
)} )}
{!showAnswer && handleOnSubmitAnswer && ( {!showAnswer && handleOnSubmitAnswer && (
<Button <Button
variant="contained" variant="contained"
onClick={() => onClick={() =>
@ -82,6 +85,7 @@ const MultipleChoiceQuestion: React.FC<Props> = (props) => {
disabled={answer === undefined} disabled={answer === undefined}
> >
Répondre Répondre
</Button> </Button>
)} )}
</div> </div>

25
client/src/components/StudentModeQuiz/StudentModeQuiz.tsx
View file

@ -1,13 +1,12 @@
// StudentModeQuiz.tsx // StudentModeQuiz.tsx
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import QuestionComponent from '../Questions/Question'; import QuestionComponent from '../Questions/Question';
import '../../pages/Student/JoinRoom/joinRoom.css'; import '../../pages/Student/JoinRoom/joinRoom.css';
import { QuestionType } from '../../Types/QuestionType'; import { QuestionType } from '../../Types/QuestionType';
// import { QuestionService } from '../../services/QuestionService'; // import { QuestionService } from '../../services/QuestionService';
import { Button } from '@mui/material'; import { Button } from '@mui/material';
import QuestionNavigation from '../QuestionNavigation/QuestionNavigation'; //import QuestionNavigation from '../QuestionNavigation/QuestionNavigation';
import { ChevronLeft, ChevronRight } from '@mui/icons-material'; //import { ChevronLeft, ChevronRight } from '@mui/icons-material';
import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton'; import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton';
interface StudentModeQuizProps { interface StudentModeQuizProps {
@ -25,10 +24,10 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
const [isAnswerSubmitted, setIsAnswerSubmitted] = useState(false); const [isAnswerSubmitted, setIsAnswerSubmitted] = useState(false);
// const [imageUrl, setImageUrl] = useState(''); // const [imageUrl, setImageUrl] = useState('');
const previousQuestion = () => { // const previousQuestion = () => {
setQuestion(questions[Number(questionInfos.question?.id) - 2]); // setQuestion(questions[Number(questionInfos.question?.id) - 2]);
setIsAnswerSubmitted(false); // setIsAnswerSubmitted(false);
}; // };
useEffect(() => {}, [questionInfos]); useEffect(() => {}, [questionInfos]);
@ -55,12 +54,12 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
<div className="overflow-auto"> <div className="overflow-auto">
<div className="question-component-container"> <div className="question-component-container">
<div className="mb-5"> <div className="mb-5">
<QuestionNavigation {/* <QuestionNavigation
currentQuestionId={Number(questionInfos.question.id)} currentQuestionId={Number(questionInfos.question.id)}
questionsLength={questions.length} questionsLength={questions.length}
previousQuestion={previousQuestion} previousQuestion={previousQuestion}
nextQuestion={nextQuestion} nextQuestion={nextQuestion}
/> /> */}
</div> </div>
<QuestionComponent <QuestionComponent
handleOnSubmitAnswer={handleOnSubmitAnswer} handleOnSubmitAnswer={handleOnSubmitAnswer}
@ -69,7 +68,7 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
/> />
<div className="center-h-align mt-1/2"> <div className="center-h-align mt-1/2">
<div className="w-12"> <div className="w-12">
<Button {/* <Button
variant="outlined" variant="outlined"
onClick={previousQuestion} onClick={previousQuestion}
fullWidth fullWidth
@ -77,14 +76,14 @@ const StudentModeQuiz: React.FC<StudentModeQuizProps> = ({
disabled={Number(questionInfos.question.id) <= 1} disabled={Number(questionInfos.question.id) <= 1}
> >
Question précédente Question précédente
</Button> </Button> */}
</div> </div>
<div className="w-12"> <div className="w-12">
<Button <Button style={{ display: isAnswerSubmitted ? 'block' : 'none' }}
variant="outlined" variant="outlined"
onClick={nextQuestion} onClick={nextQuestion}
fullWidth fullWidth
endIcon={<ChevronRight />} //endIcon={<ChevronRight />}
disabled={Number(questionInfos.question.id) >= questions.length} disabled={Number(questionInfos.question.id) >= questions.length}
> >
Question suivante Question suivante

22
client/src/pages/Teacher/ManageRoom/ManageRoom.tsx
View file

@ -17,7 +17,7 @@ import LoadingCircle from 'src/components/LoadingCircle/LoadingCircle';
import { Refresh, Error } from '@mui/icons-material'; import { Refresh, Error } from '@mui/icons-material';
import StudentWaitPage from 'src/components/StudentWaitPage/StudentWaitPage'; import StudentWaitPage from 'src/components/StudentWaitPage/StudentWaitPage';
import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton'; import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton';
import QuestionNavigation from 'src/components/QuestionNavigation/QuestionNavigation'; //import QuestionNavigation from 'src/components/QuestionNavigation/QuestionNavigation';
import Question from 'src/components/Questions/Question'; import Question from 'src/components/Questions/Question';
import ApiService from '../../../services/ApiService'; import ApiService from '../../../services/ApiService';
@ -267,7 +267,6 @@ const ManageRoom: React.FC = () => {
const prevQuestionIndex = Number(currentQuestion?.question.id) - 2; // -2 because question.id starts at index 1 const prevQuestionIndex = Number(currentQuestion?.question.id) - 2; // -2 because question.id starts at index 1
if (prevQuestionIndex === undefined || prevQuestionIndex < 0) return; if (prevQuestionIndex === undefined || prevQuestionIndex < 0) return;
setCurrentQuestion(quizQuestions[prevQuestionIndex]); setCurrentQuestion(quizQuestions[prevQuestionIndex]);
webSocketService.nextQuestion(roomName, quizQuestions[prevQuestionIndex]); webSocketService.nextQuestion(roomName, quizQuestions[prevQuestionIndex]);
}; };
@ -461,12 +460,12 @@ const ManageRoom: React.FC = () => {
{quizMode === 'teacher' && ( {quizMode === 'teacher' && (
<div className="mb-1"> <div className="mb-1">
<QuestionNavigation {/* <QuestionNavigation
currentQuestionId={Number(currentQuestion?.question.id)} currentQuestionId={Number(currentQuestion?.question.id)}
questionsLength={quizQuestions?.length} questionsLength={quizQuestions?.length}
previousQuestion={previousQuestion} previousQuestion={previousQuestion}
nextQuestion={nextQuestion} nextQuestion={nextQuestion}
/> /> */}
</div> </div>
)} )}
@ -493,12 +492,23 @@ const ManageRoom: React.FC = () => {
</div> </div>
{quizMode === 'teacher' && ( {quizMode === 'teacher' && (
<div className="questionNavigationButtons" style={{ display: 'flex', justifyContent: 'center' }}>
<div className="previousQuestionButton">
<Button onClick={previousQuestion}
variant="contained"
disabled={Number(currentQuestion?.question.id) <= 1}>
Question précédente
</Button>
</div>
<div className="nextQuestionButton"> <div className="nextQuestionButton">
<Button onClick={nextQuestion} variant="contained"> <Button onClick={nextQuestion}
variant="contained"
disabled={Number(currentQuestion?.question.id) >=quizQuestions.length}
>
Prochaine question Prochaine question
</Button> </Button>
</div> </div>
)} </div> )}
</div> </div>