Confusion avec la navigation dans les questions à rythme de l'enseignant

Fixes #145
This commit is contained in:
JubaAzul 2025-01-21 15:35:07 -05:00
parent a44cded030
commit 3e9152fa5c
3 changed files with 29 additions and 25 deletions

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

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';
@ -261,16 +261,16 @@ const ManageRoom: React.FC = () => {
webSocketService.nextQuestion(roomName, quizQuestions[nextQuestionIndex]);
};
const previousQuestion = () => {
if (!quizQuestions || !currentQuestion || !quiz?.content) return;
// const previousQuestion = () => {
// if (!quizQuestions || !currentQuestion || !quiz?.content) return;
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]);
webSocketService.nextQuestion(roomName, quizQuestions[prevQuestionIndex]);
};
// setCurrentQuestion(quizQuestions[prevQuestionIndex]);
// webSocketService.nextQuestion(roomName, quizQuestions[prevQuestionIndex]);
// };
const initializeQuizQuestion = () => {
const quizQuestionArray = quiz?.content;
@ -461,12 +461,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>
)}
@ -494,10 +494,11 @@ const ManageRoom: React.FC = () => {
{quizMode === 'teacher' && (
<div className="nextQuestionButton">
<Button onClick={nextQuestion} variant="contained">
<Button onClick={nextQuestion} variant="contained" >
Prochaine question
</Button>
</div>
)}
</div>