stuff

src/hooks/useRoom.js

@@ -2,7 +2,7 @@ import { useState, useEffect, useCallback } from 'react';
 import { roomsApi } from '../services/api';
 import socketService from '../services/socket';
 
-export const useRoom = (roomCode) => {
+export const useRoom = (roomCode, onGameStarted = null) => {
   const [room, setRoom] = useState(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
@@ -45,6 +45,10 @@ export const useRoom = (roomCode) => {
 
     const handleGameStarted = (updatedRoom) => {
       setRoom(updatedRoom);
+      // Вызываем callback для навигации на страницу игры
+      if (onGameStarted) {
+        onGameStarted(updatedRoom);
+      }
     };
 
     const handleAnswerRevealed = (data) => {
@@ -86,7 +90,7 @@ export const useRoom = (roomCode) => {
       socketService.off('questionChanged', handleQuestionChanged);
       socketService.off('gameEnded', handleGameEnded);
     };
-  }, [roomCode]);
+  }, [roomCode, onGameStarted]);
 
   const createRoom = useCallback(async (hostId, questionPackId, settings = {}) => {
     try {

src/pages/RoomPage.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useCallback } from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
 import { useAuth } from '../context/AuthContext';
 import { useRoom } from '../hooks/useRoom';
@@ -11,6 +11,12 @@ const RoomPage = () => {
   const { roomCode } = useParams();
   const navigate = useNavigate();
   const { user, loginAnonymous, loading: authLoading } = useAuth();
+
+  // Callback для автоматической навигации при старте игры
+  const handleGameStartedEvent = useCallback(() => {
+    navigate(`/game/${roomCode}`);
+  }, [navigate, roomCode]);
+
   const {
     room,
     participants,
@@ -19,7 +25,7 @@ const RoomPage = () => {
     joinRoom,
     startGame,
     updateQuestionPack,
-  } = useRoom(roomCode);
+  } = useRoom(roomCode, handleGameStartedEvent);
   const [qrCode, setQrCode] = useState('');
   const [joined, setJoined] = useState(false);
   const [isQRModalOpen, setIsQRModalOpen] = useState(false);