+

client/src/components/LiveResults/LiveResults.tsx

@@ -26,14 +26,17 @@ interface LiveResultsProps {
 const LiveResults: React.FC<LiveResultsProps> = ({ questions, showSelectedQuestion, students }) => {
     const [showUsernames, setShowUsernames] = useState<boolean>(false);
     const [showCorrectAnswers, setShowCorrectAnswers] = useState<boolean>(false);
-    const [isOpen, setIsOpen] = useState<boolean>(true);
+    const [activeKey, setActiveKey] = useState<string | null>('0');
 
+    const toggleAccordion = () => {
+        setActiveKey(activeKey === '0' ? null : '0');
+    };
 
     return (
-        <Accordion defaultActiveKey="0" alwaysOpen>
+        <Accordion activeKey={activeKey} onSelect={toggleAccordion}>
             <Accordion.Item eventKey="0">
-                <Accordion.Header onClick={() => setIsOpen(!isOpen)}>
+                <Accordion.Header>
-                    <div className="text-2xl text-bold">{isOpen ? 'Résultats du quiz' : 'Masquer les résultats'}</div>
+                    <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">

client/src/components/QuestionsDisplay/QuestionDisplay.tsx

@@ -36,8 +36,12 @@ const QuestionDisplay: React.FC<QuestionProps> = ({
     //     return isMobile ? '100%' : '20%';
     // }, [isMobile]);
     
-    const [isOpen, setIsOpen] = useState<boolean>(true);
     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) {
@@ -96,10 +100,10 @@ const QuestionDisplay: React.FC<QuestionProps> = ({
     return (
         <>
             {showAnswerToggle ? (
-                <Accordion defaultActiveKey="0" alwaysOpen>
+                <Accordion activeKey={activeKey} onSelect={toggleAccordion}>
                     <Accordion.Item eventKey="0">
-                        <Accordion.Header onClick={() => setIsOpen(!isOpen)}>
+                        <Accordion.Header>
-                            {isOpen ? 'Afficher les questions' : 'Masquer les questions'}
+                            {activeKey === '0' ? 'Afficher les questions' : 'Masquer les questions'}
                         </Accordion.Header>
                         <Accordion.Body>
                             <FormControlLabel