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

Removed accordion and updated versions

Browse source
This commit is contained in:
KenChanA 2025-04-23 21:41:06 -04:00
parent b1221f0c56
commit 22dc7a5399
4 changed files with 87 additions and 93 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

89
client/src/components/LiveResults/LiveResults.tsx
View file

@ -1,7 +1,6 @@
// LiveResults.tsx
import React, { useState } from 'react';
import { Accordion } from 'react-bootstrap';
import { Socket } from 'socket.io-client';
import { QuestionType } from '../../Types/QuestionType';
import './liveResult.css';
@ -26,59 +25,47 @@ interface LiveResultsProps {
const LiveResults: React.FC<LiveResultsProps> = ({ questions, showSelectedQuestion, students }) => {
const [showUsernames, setShowUsernames] = useState<boolean>(false);
const [showCorrectAnswers, setShowCorrectAnswers] = useState<boolean>(false);
const [activeKey, setActiveKey] = useState<string | null>('0');
const toggleAccordion = () => {
setActiveKey(activeKey === '0' ? null : '0');
};
return (
<Accordion activeKey={activeKey} onSelect={toggleAccordion}>
<Accordion.Item eventKey="0">
<Accordion.Header>
<div className="text-2xl text-bold">{activeKey === '0' ? 'Résultats du quiz' : 'Masquer les résultats'}</div>
</Accordion.Header>
<Accordion.Body>
<div className="action-bar mb-1">
<FormGroup row>
<FormControlLabel
label={<div className="text-sm">Afficher les noms</div>}
control={
<Switch
value={showUsernames}
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
setShowUsernames(e.target.checked)
}
/>
}
/>
<FormControlLabel
label={<div className="text-sm">Afficher les réponses</div>}
control={
<Switch
value={showCorrectAnswers}
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
setShowCorrectAnswers(e.target.checked)
}
/>
}
/>
</FormGroup>
</div>
<div className="table-container">
<LiveResultsTable
students={students}
questions={questions}
showCorrectAnswers={showCorrectAnswers}
showSelectedQuestion={showSelectedQuestion}
showUsernames={showUsernames}
<div>
<div className="action-bar mb-1">
<FormGroup row>
<FormControlLabel
label={<div className="text-sm">Afficher les noms</div>}
control={
<Switch
value={showUsernames}
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
setShowUsernames(e.target.checked)
}
/>
</div>
</Accordion.Body>
</Accordion.Item>
</Accordion>
}
/>
<FormControlLabel
label={<div className="text-sm">Afficher les réponses</div>}
control={
<Switch
value={showCorrectAnswers}
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
setShowCorrectAnswers(e.target.checked)
}
/>
}
/>
</FormGroup>
</div>
<div className="table-container">
<LiveResultsTable
students={students}
questions={questions}
showCorrectAnswers={showCorrectAnswers}
showSelectedQuestion={showSelectedQuestion}
showUsernames={showUsernames}
/>
</div>
</div>
);
};

56
client/src/components/QuestionsDisplay/QuestionDisplay.tsx
View file

@ -1,7 +1,6 @@
import React, { useState } from 'react';
import { Question } from 'gift-pegjs';
import { Accordion } from 'react-bootstrap';
import { FormControlLabel, Switch } from '@mui/material';
import TrueFalseQuestionDisplay from './TrueFalseQuestionDisplay/TrueFalseQuestionDisplay';
@ -37,11 +36,6 @@ const QuestionDisplay: React.FC<QuestionProps> = ({
// }, [isMobile]);
const [showResults, setShowResults] = useState<boolean>(false);
const [activeKey, setActiveKey] = useState<string | null>('0');
const toggleAccordion = () => {
setActiveKey(activeKey === '0' ? null : '0');
};
let questionTypeComponent = null;
switch (question?.type) {
@ -99,38 +93,21 @@ const QuestionDisplay: React.FC<QuestionProps> = ({
}
return (
<>
{showAnswerToggle ? (
<Accordion activeKey={activeKey} onSelect={toggleAccordion}>
<Accordion.Item eventKey="0">
<Accordion.Header>
{activeKey === '0' ? 'Afficher les questions' : 'Masquer les questions'}
</Accordion.Header>
<Accordion.Body>
<FormControlLabel
label={<div className="text-sm">Afficher les résultats</div>}
control={
<Switch
value={showResults}
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
setShowResults(e.target.checked)
}
/>
}
/>
<div className="question-container">
{questionTypeComponent ? (
<>
{questionTypeComponent}
</>
) : (
<div>Question de type inconnue</div>
)}
</div>
</Accordion.Body>
</Accordion.Item>
</Accordion>
) : (
<div className="question-container">
{showAnswerToggle && (
<FormControlLabel
label={<div className="text-sm">Afficher les résultats</div>}
control={
<Switch
value={showResults}
onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
setShowResults(e.target.checked)
}
/>
}
/>
)}
<div className="question-container">
{questionTypeComponent ? (
<>
{questionTypeComponent}
@ -138,8 +115,7 @@ const QuestionDisplay: React.FC<QuestionProps> = ({
) : (
<div>Question de type inconnue</div>
)}
</div>
)}
</div>
</>
);
};

31
package-lock.json generated
View file

@ -5,7 +5,18 @@
"packages": {
"": {
"dependencies": {
"axios-mock-adapter": "^2.1.0"
"@popperjs/core": "^2.11.8",
"axios-mock-adapter": "^2.1.0",
"bootstrap": "^5.3.5"
}
},
"node_modules/@popperjs/core": {
"version": "2.11.8",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/popperjs"
}
},
"node_modules/asynckit": {
@ -37,6 +48,24 @@
"axios": ">= 0.17.0"
}
},
"node_modules/bootstrap": {
"version": "5.3.5",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.5.tgz",
"integrity": "sha512-ct1CHKtiobRimyGzmsSldEtM03E8fcEX4Tb3dGXz1V8faRwM50+vfHwTzOxB3IlKO7m+9vTH3s/3C6T2EAPeTA==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/twbs"
},
{
"type": "opencollective",
"url": "https://opencollective.com/bootstrap"
}
],
"peerDependencies": {
"@popperjs/core": "^2.11.8"
}
},
"node_modules/call-bind-apply-helpers": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",

4
package.json
View file

@ -1,5 +1,7 @@
{
"dependencies": {
"axios-mock-adapter": "^2.1.0"
"@popperjs/core": "^2.11.8",
"axios-mock-adapter": "^2.1.0",
"bootstrap": "^5.3.5"
}
}