From 77a3bf89a732479f517349680f36e49f8b7d4d71 Mon Sep 17 00:00:00 2001
From: James Ketrenos <james_git@ketrenos.com>
Date: Tue, 16 Sep 2025 10:48:22 -0700
Subject: [PATCH] Only scroll the chatbox not the entire window when new
 messages arrive

---
 client/src/LobbyChat.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/client/src/LobbyChat.tsx b/client/src/LobbyChat.tsx
index b96ad6f..fc1953e 100644
--- a/client/src/LobbyChat.tsx
+++ b/client/src/LobbyChat.tsx
@@ -26,9 +26,12 @@ const LobbyChat: React.FC<LobbyChatProps> = ({ socketUrl, session, lobbyId }) =>
   const [newMessage, setNewMessage] = useState<string>("");
   const [isClearing, setIsClearing] = useState<boolean>(false);
   const messagesEndRef = useRef<HTMLDivElement>(null);
+  const chatMessagesRef = useRef<HTMLDivElement>(null);
 
   const scrollToBottom = () => {
-    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+    if (chatMessagesRef.current) {
+      chatMessagesRef.current.scrollTop = chatMessagesRef.current.scrollHeight;
+    }
   };
 
   const { sendJsonMessage } = useWebSocket(socketUrl, {
@@ -167,7 +170,7 @@ const LobbyChat: React.FC<LobbyChatProps> = ({ socketUrl, session, lobbyId }) =>
         )}
       </Box>
 
-      <Box className="chat-messages" sx={{ flexGrow: 1, overflowY: "auto", mb: 1 }}>
+      <Box className="chat-messages" sx={{ flexGrow: 1, overflowY: "auto", mb: 1 }} ref={chatMessagesRef}>
         <List dense>
           {messages.length === 0 ? (
             <ListItem>