diff --git a/src/layout/pages/Room.tsx b/src/layout/pages/Room.tsx index 3806e83..7b4a7f3 100644 --- a/src/layout/pages/Room.tsx +++ b/src/layout/pages/Room.tsx @@ -31,27 +31,26 @@ const Room = () => { const {roomId} = useParams(); - const playerName = localStorage.getItem('playerName') || Math.random().toString(36).substring(7); + const playerName = localStorage.getItem('playerName') ?? Math.random().toString(36).substring(7); const WS_URL = `${process.env.REACT_APP_WEBSOCKET_URL}/room/${roomId}/${playerName}`; const [gameState, setGameState] = React.useState(undefined); const [lobbyState, setLobbyState] = React.useState(""); const [winner, setWinner] = React.useState(undefined); - const [chatScroll, setChatScroll] = React.useState(true); const chatRef = React.useRef(null); - const addChatMessage = (message: {Sender: string, Message: string}) => { - if(!chatRef.current) return; + const addChatMessage = (message: { Sender: string, Message: string }) => { + if (!chatRef.current) return; - const { scrollTop, scrollHeight, clientHeight } = chatRef.current; + const {scrollTop, scrollHeight, clientHeight} = chatRef.current; const newChatElement = document.createElement('li'); newChatElement.innerHTML = `${message.Sender}: ${message.Message}`; chatRef.current.appendChild(newChatElement); const isNearBottom = scrollTop + clientHeight + newChatElement.scrollHeight * 2 >= scrollHeight; - if (chatScroll && isNearBottom) { + if (isNearBottom) { newChatElement.scrollIntoView({behavior: 'smooth'}); } } @@ -132,7 +131,7 @@ const Room = () => { { gameState ? - : + : lobbyState === 'LOBBY' && }