Added the ability to choose your cardtype when playing a jack or the newly added joker

src/layout/pages/Room.tsx

@@ -3,15 +3,7 @@ import React from "react";
 import {useNavigate, useParams} from "react-router";
 import {GHButton} from "../components/Button";
 import useTitle from "../../utils/hooks/TitleHook";
-import Game from "../components/Game";
-
-interface GameState {
-    PlayerName: string;
-    Hand: string[];
-    CurrentCard: string;
-    CurrentPlayer: string;
-    Players: string[];
-}
+import Game, {GameState} from "../components/Game";
 
 interface ChatMessage {
     PlayerName: string;
@@ -35,6 +27,7 @@ const Room = () => {
 
     const [gameState, setGameState] = React.useState<GameState>({
         PlayerName: '',
+        CurrentState: '',
         Hand: [],
         CurrentCard: '',
         CurrentPlayer: '',
@@ -78,6 +71,16 @@ const Room = () => {
         })
     }
 
+    const handleChoice = (choice: string) => {
+        handleSend({
+            Type: "GAME",
+            Payload: JSON.stringify({
+                Action: "CHOOSE",
+                Data: choice
+            })
+        });
+    }
+
     const handleDraw = () => {
         handleSend({
             Type: "GAME",
@@ -99,7 +102,7 @@ const Room = () => {
         <div>
             <h1>Room {roomId}</h1>
             <GHButton onClick={handleLeaveRoom}>Leave Room</GHButton>
-            <Game gameState={gameState} handleCardSend={handleCardSend} handleDraw={handleDraw}/>
+            <Game gameState={gameState} handleCardSend={handleCardSend} handleDraw={handleDraw} handleChoice={handleChoice}/>
             <input type="text" placeholder={"Chat"} value={chatInput} onChange={(e) => setChatInput(e.target.value)} />
             <button onClick={() => handleChat(chatInput)}>Send</button>
             <ul>