From f2d0d2faf8cc9d8e6abb76ea7d5b35f4e6a58904 Mon Sep 17 00:00:00 2001
From: DTieman <djurre.tieman@gmail.com>
Date: Sat, 22 Apr 2023 13:57:18 +0200
Subject: [PATCH] fix

---
 src/layout/pages/Room.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/layout/pages/Room.tsx b/src/layout/pages/Room.tsx
index e29262a..c11db28 100644
--- a/src/layout/pages/Room.tsx
+++ b/src/layout/pages/Room.tsx
@@ -41,6 +41,7 @@ const Room = () => {
         Players: []
     });
     const [chatMessages, setChatMessages] = React.useState<ChatMessage[]>([]);
+    const [chatInput, setChatInput] = React.useState<string>('');
 
     const websocket = useWebSocket(WS_URL, {
         onOpen: () => {
@@ -87,10 +88,10 @@ const Room = () => {
         });
     }
 
-    const handleChat = (Message: string) => {
+    const handleChat = (message: string) => {
         handleSend({
             Type: "CHAT",
-            Payload: { Message }
+            Payload: message
         });
     }
 
@@ -99,6 +100,13 @@ const Room = () => {
             <h1>Room {roomId}</h1>
             <GHButton onClick={handleLeaveRoom}>Leave Room</GHButton>
             <Game gameState={gameState} handleCardSend={handleCardSend} handleDraw={handleDraw}/>
+            <input type="text" placeholder={"Chat"} value={chatInput} onChange={(e) => setChatInput(e.target.value)} />
+            <button onClick={() => handleChat(chatInput)}>Send</button>
+            <ul>
+                {chatMessages.map((message, index) => (
+                    <li key={index}>{message.PlayerName}: {message.Message}</li>
+                ))}
+            </ul>
         </div>
     )
 }