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

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

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();
});
});

View file

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

View file

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

View file

@ -17,7 +17,7 @@ import LoadingCircle from 'src/components/LoadingCircle/LoadingCircle';
import { Refresh, Error } from '@mui/icons-material';
import StudentWaitPage from 'src/components/StudentWaitPage/StudentWaitPage';
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 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
if (prevQuestionIndex === undefined || prevQuestionIndex < 0) return;
setCurrentQuestion(quizQuestions[prevQuestionIndex]);
webSocketService.nextQuestion(roomName, quizQuestions[prevQuestionIndex]);
};
@ -461,12 +460,12 @@ const ManageRoom: React.FC = () => {
{quizMode === 'teacher' && (
<div className="mb-1">
<QuestionNavigation
{/* <QuestionNavigation
currentQuestionId={Number(currentQuestion?.question.id)}
questionsLength={quizQuestions?.length}
previousQuestion={previousQuestion}
nextQuestion={nextQuestion}
/>
/> */}
</div>
)}
@ -493,12 +492,23 @@ const ManageRoom: React.FC = () => {
</div>
{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">
<Button onClick={nextQuestion} variant="contained">
<Button onClick={nextQuestion}
variant="contained"
disabled={Number(currentQuestion?.question.id) >=quizQuestions.length}
>
Prochaine question
</Button>
</div>
)}
</div> )}
</div>