client/package-lock.json

@@ -27,7 +27,6 @@
                 "katex": "^0.16.11",
                 "marked": "^14.1.2",
                 "nanoid": "^5.1.2",
-                "qrcode.react": "^4.2.0",
                 "react": "^18.3.1",
                 "react-dom": "^18.3.1",
                 "react-modal": "^3.16.3",
@@ -11169,15 +11168,6 @@
             ],
             "license": "MIT"
         },
-        "node_modules/qrcode.react": {
-            "version": "4.2.0",
-            "resolved": "https://registry.npmjs.org/qrcode.react/-/qrcode.react-4.2.0.tgz",
-            "integrity": "sha512-QpgqWi8rD9DsS9EP3z7BT+5lY5SFhsqGjpgW5DY/i3mK4M9DTBNz3ErMi8BWYEfI3L0d8GIbGmcdFAS1uIRGjA==",
-            "license": "ISC",
-            "peerDependencies": {
-                "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
-            }
-        },
         "node_modules/querystringify": {
             "version": "2.2.0",
             "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",

client/package.json

@@ -31,7 +31,6 @@
         "katex": "^0.16.11",
         "marked": "^14.1.2",
         "nanoid": "^5.1.2",
-        "qrcode.react": "^4.2.0",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "react-modal": "^3.16.3",

client/src/__tests__/pages/ManageRoom/ManageRoom.test.tsx

@@ -19,11 +19,6 @@ jest.mock('react-router-dom', () => ({
 }));
 jest.mock('src/pages/Teacher/ManageRoom/RoomContext');
 
-jest.mock('qrcode.react', () => ({
-    __esModule: true,
-    QRCodeCanvas: ({ value }: { value: string }) => <div data-testid="qr-code">{value}</div>,
-}));
-
 const mockSocket = {
     on: jest.fn(),
     off: jest.fn(),
@@ -330,53 +325,5 @@ describe('ManageRoom', () => {
         });
     });
     
-    test("Affiche la modale QR Code lorsqu’on clique sur le bouton", async () => {
-        render(<MemoryRouter><ManageRoom /></MemoryRouter>);
-    
-        const button = screen.getByRole('button', { name: /lien de participation/i });
-        fireEvent.click(button);
-    
-        await waitFor(() => {
-            expect(screen.getByRole('dialog')).toBeInTheDocument();
-        });
-    
-        expect(screen.getByRole('heading', { name: /Rejoindre la salle/i })).toBeInTheDocument();
-        expect(screen.getByText(/Scannez ce QR code ou partagez le lien ci-dessous/i)).toBeInTheDocument();
-        expect(screen.getByTestId('qr-code')).toBeInTheDocument();
-    });
-    
-    test("Ferme la modale QR Code lorsqu’on clique sur le bouton Fermer", async () => {
-        render(<MemoryRouter><ManageRoom /></MemoryRouter>);
-    
-        fireEvent.click(screen.getByRole('button', { name: /lien de participation/i }));
-    
-        await waitFor(() => {
-            expect(screen.getByRole('dialog')).toBeInTheDocument();
-        });
-    
-        fireEvent.click(screen.getByRole('button', { name: /fermer/i }));
-    
-        await waitFor(() => {
-            expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
-        });
-    });
-    
-    test('Affiche le bon lien de participation', () => {
-        render(<MemoryRouter><ManageRoom /></MemoryRouter>);
-        
-        fireEvent.click(screen.getByRole('button', { name: /lien de participation/i }));
-        
-        const roomUrl = `${window.location.origin}/student/join-room?roomName=Test Room`;
-        expect(screen.getByTestId('qr-code')).toHaveTextContent(roomUrl);
-    });
-
-    test('Vérifie que le QR code contient la bonne URL', () => {
-        render(<MemoryRouter><ManageRoom /></MemoryRouter>);
-        
-        fireEvent.click(screen.getByRole('button', { name: /lien de participation/i }));
-        
-        const roomUrl = `${window.location.origin}/student/join-room?roomName=Test Room`;
-        expect(screen.getByTestId('qr-code')).toHaveTextContent(roomUrl);
-    });
 });
 

client/src/pages/Student/JoinRoom/JoinRoom.tsx

@@ -5,7 +5,7 @@ import { ENV_VARIABLES } from 'src/constants';
 
 import StudentModeQuiz from 'src/components/StudentModeQuiz/StudentModeQuiz';
 import TeacherModeQuiz from 'src/components/TeacherModeQuiz/TeacherModeQuiz';
-import webSocketService, {AnswerSubmissionToBackendType} from '../../../services/WebsocketService';
+import webSocketService, { AnswerSubmissionToBackendType } from '../../../services/WebsocketService';
 import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton';
 
 import './joinRoom.css';
@@ -13,10 +13,9 @@ import { QuestionType } from '../../../Types/QuestionType';
 import { TextField } from '@mui/material';
 import LoadingButton from '@mui/lab/LoadingButton';
 
-import LoginContainer from 'src/components/LoginContainer/LoginContainer';
+import LoginContainer from 'src/components/LoginContainer/LoginContainer'
 
-import ApiService from '../../../services/ApiService';
-import { useSearchParams } from 'react-router-dom';
+import ApiService from '../../../services/ApiService'
 
 export type AnswerType = Array<string | number | boolean>;
 
@@ -31,17 +30,6 @@ const JoinRoom: React.FC = () => {
     const [answers, setAnswers] = useState<AnswerSubmissionToBackendType[]>([]);
     const [connectionError, setConnectionError] = useState<string>('');
     const [isConnecting, setIsConnecting] = useState<boolean>(false);
-    const [isQRCodeJoin, setIsQRCodeJoin] = useState(false);
-    const [searchParams] = useSearchParams();
-
-    useEffect(() => {
-        const roomFromUrl = searchParams.get('roomName');
-        if (roomFromUrl) {
-            setRoomName(roomFromUrl);
-            setIsQRCodeJoin(true);
-            console.log('Mode QR Code détecté, salle:', roomFromUrl);
-        }
-    }, [searchParams]);
 
     useEffect(() => {
         handleCreateSocket();
@@ -113,7 +101,7 @@ const JoinRoom: React.FC = () => {
     };
 
     const disconnect = () => {
-        //        localStorage.clear();
+//        localStorage.clear();
         webSocketService.disconnect();
         setSocket(null);
         setQuestion(undefined);
@@ -210,25 +198,21 @@ const JoinRoom: React.FC = () => {
         default:
             return (
                 <LoginContainer
-                    title={isQRCodeJoin ? `Rejoindre la salle ${roomName}` : 'Rejoindre une salle'}
-                    error={connectionError}
-                >
-                    {/* Afficher champ salle SEULEMENT si pas de QR code */}
-                    {!isQRCodeJoin && (
-                        <TextField
-                            type="text"
-                            label="Nom de la salle"
-                            variant="outlined"
-                            value={roomName}
-                            onChange={(e) => setRoomName(e.target.value.toUpperCase())}
-                            placeholder="Nom de la salle"
-                            sx={{ marginBottom: '1rem' }}
-                            fullWidth={true}
-                            onKeyDown={handleReturnKey}
-                        />
-                    )}
+                    title='Rejoindre une salle'
+                    error={connectionError}>
+
+                    <TextField
+                        type="text"
+                        label="Nom de la salle"
+                        variant="outlined"
+                        value={roomName}
+                        onChange={(e) => setRoomName(e.target.value.toUpperCase())}
+                        placeholder="Nom de la salle"
+                        sx={{ marginBottom: '1rem' }}
+                        fullWidth={true}
+                        onKeyDown={handleReturnKey}
+                    />
 
-                    {/* Champ username toujours visible */}
                     <TextField
                         label="Nom d'utilisateur"
                         variant="outlined"
@@ -245,10 +229,9 @@ const JoinRoom: React.FC = () => {
                         onClick={handleSocket}
                         variant="contained"
                         sx={{ marginBottom: `${connectionError && '2rem'}` }}
-                        disabled={!username || (isQRCodeJoin && !roomName)}
-                    >
-                        {isQRCodeJoin ? 'Rejoindre avec QR Code' : 'Rejoindre'}
-                    </LoadingButton>
+                        disabled={!username || !roomName}
+                    >Rejoindre</LoadingButton>
+
                 </LoginContainer>
             );
     }

client/src/pages/Teacher/ManageRoom/ManageRoom.tsx

@@ -9,7 +9,6 @@ import webSocketService, {
 import { QuizType } from '../../../Types/QuizType';
 import GroupIcon from '@mui/icons-material/Group';
 import './manageRoom.css';
-import QRCodeIcon from '@mui/icons-material/QrCode';
 import { ENV_VARIABLES } from 'src/constants';
 import { StudentType, Answer } from '../../../Types/StudentType';
 import LoadingCircle from 'src/components/LoadingCircle/LoadingCircle';
@@ -19,18 +18,8 @@ import DisconnectButton from 'src/components/DisconnectButton/DisconnectButton';
 import QuestionDisplay from 'src/components/QuestionsDisplay/QuestionDisplay';
 import ApiService from '../../../services/ApiService';
 import { QuestionType } from 'src/Types/QuestionType';
-import {
-    Button,
-    Dialog,
-    DialogTitle,
-    DialogContent,
-    DialogContentText,
-    DialogActions
-} from '@mui/material';
+import { Button } from '@mui/material';
 import { checkIfIsCorrect } from './useRooms';
-import { QRCodeCanvas } from 'qrcode.react';
-import ContentCopyIcon from "@mui/icons-material/ContentCopy";
-
 
 const ManageRoom: React.FC = () => {
     const navigate = useNavigate();
@@ -45,16 +34,6 @@ const ManageRoom: React.FC = () => {
     const [quizStarted, setQuizStarted] = useState<boolean>(false);
     const [formattedRoomName, setFormattedRoomName] = useState('');
     const [newlyConnectedUser, setNewlyConnectedUser] = useState<StudentType | null>(null);
-    const roomUrl = `${window.location.origin}/student/join-room?roomName=${roomName}`;
-    const [showQrModal, setShowQrModal] = useState(false);
-    const [copied, setCopied] = useState(false);
-
-    const handleCopy = () => {
-        navigator.clipboard.writeText(roomUrl).then(() => {
-            setCopied(true);
-            setTimeout(() => setCopied(false), 2000);
-        });
-    };
 
     // Handle the newly connected user in useEffect, because it needs state info
     // not available in the socket.on() callback
@@ -98,15 +77,6 @@ const ManageRoom: React.FC = () => {
         verifyLogin();
     }, []);
 
-    useEffect(() => {
-        if (!roomName) {
-            console.error('Room name is missing!');
-            return;
-        }
-
-        console.log(`Joining room: ${roomName}`);
-    }, [roomName]);
-
     useEffect(() => {
         if (!roomName || !quizId) {
             window.alert(
@@ -416,62 +386,7 @@ const ManageRoom: React.FC = () => {
 
     return (
         <div className="room">
-            {/* En-tête avec titre et bouton QR code*/}
-            <div
-                style={{
-                    display: 'flex',
-                    justifyContent: 'space-between',
-                    alignItems: 'center',
-                    marginBottom: '20px'
-                }}
-            >
-                <h1 style={{ margin: 0 }}>Salle : {formattedRoomName}</h1>
-
-                <Button
-                    variant="contained"
-                    color="primary"
-                    onClick={() => setShowQrModal(true)}
-                    startIcon={<QRCodeIcon />}
-                >
-                    Lien de participation
-                </Button>
-            </div>
-
-            {/* Modale QR Code */}
-            <Dialog
-                open={showQrModal}
-                onClose={() => setShowQrModal(false)}
-                aria-labelledby="qr-modal-title"
-            >
-                <DialogTitle id="qr-modal-title">Rejoindre la salle: {formattedRoomName}</DialogTitle>
-                <DialogContent>
-                    <DialogContentText>
-                        Scannez ce QR code ou partagez le lien ci-dessous pour rejoindre la salle :
-                    </DialogContentText>
-
-                    <div style={{ textAlign: 'center', margin: '20px 0' }}>
-                        <QRCodeCanvas value={roomUrl} size={256} />
-                    </div>
-
-                    <div style={{ wordBreak: 'break-all', textAlign: 'center' }}>
-                        <h3>URL de participation :</h3>
-                        <p>{roomUrl}</p>
-                        <Button
-                        variant="contained"
-                        startIcon={<ContentCopyIcon />}
-                        onClick={handleCopy}
-                        style={{ marginTop: '10px' }}
-                    >
-                        {copied ? "Copié !" : "Copier le lien"}
-                    </Button>
-                    </div>
-                </DialogContent>
-                <DialogActions>
-                    <Button onClick={() => setShowQrModal(false)} color="primary">
-                        Fermer
-                    </Button>
-                </DialogActions>
-            </Dialog>
+            <h1>Salle : {formattedRoomName}</h1>
             <div className="roomHeader">
                 <DisconnectButton
                     onReturn={handleReturn}

server/package-lock.json

@@ -24,7 +24,6 @@
         "passport-oauth2": "^1.8.0",
         "passport-openidconnect": "^0.1.2",
         "patch-package": "^8.0.0",
-        "qrcode.react": "^4.2.0",
         "socket.io": "^4.7.2",
         "socket.io-client": "^4.7.2"
       },
@@ -5851,15 +5850,6 @@
         }
       ]
     },
-    "node_modules/qrcode.react": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/qrcode.react/-/qrcode.react-4.2.0.tgz",
-      "integrity": "sha512-QpgqWi8rD9DsS9EP3z7BT+5lY5SFhsqGjpgW5DY/i3mK4M9DTBNz3ErMi8BWYEfI3L0d8GIbGmcdFAS1uIRGjA==",
-      "license": "ISC",
-      "peerDependencies": {
-        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
-      }
-    },
     "node_modules/qs": {
       "version": "6.13.0",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.13.0.tgz",
@@ -5904,16 +5894,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/react": {
-      "version": "19.0.0",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.0.0.tgz",
-      "integrity": "sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==",
-      "license": "MIT",
-      "peer": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/react-is": {
       "version": "18.2.0",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",

server/package.json

@@ -28,7 +28,6 @@
     "passport-oauth2": "^1.8.0",
     "passport-openidconnect": "^0.1.2",
     "patch-package": "^8.0.0",
-    "qrcode.react": "^4.2.0",
     "socket.io": "^4.7.2",
     "socket.io-client": "^4.7.2"
   },