diff --git a/src/layout/components/Hand.tsx b/src/layout/components/Hand.tsx index 5d82b30..32c05a6 100644 --- a/src/layout/components/Hand.tsx +++ b/src/layout/components/Hand.tsx @@ -8,12 +8,16 @@ interface Props { } const Hand: FunctionComponent = ({hand, actionOnClick, isHidden}) => { + + const isMyHand = !isHidden; + return (
{ hand.map((card, index) => { return ( - + ) }) } diff --git a/src/layout/pages/Room.tsx b/src/layout/pages/Room.tsx index b6cea81..1d13118 100644 --- a/src/layout/pages/Room.tsx +++ b/src/layout/pages/Room.tsx @@ -7,8 +7,11 @@ import Card from "../components/Card"; import Hand from "../components/Hand"; interface GameState { + PlayerName: string; Hand: string[]; CurrentCard: string; + CurrentPlayer: string; + Players: string[]; } const Room = () => { @@ -19,7 +22,7 @@ const Room = () => { const WS_URL = `ws://${process.env.REACT_APP_API_URL}/room/${roomId}`; - const [gameState, setGameState] = React.useState({Hand: [], CurrentCard: ''}); + const [gameState, setGameState] = React.useState({PlayerName: '', Hand: [], CurrentCard: '', CurrentPlayer: '', Players: []}); const websocket = useWebSocket(WS_URL, { onOpen: () => { @@ -46,9 +49,16 @@ const Room = () => { Leave Room { gameState.CurrentCard && - + } +
    + { + gameState.Players.map((player, index) => { + return
  • {player} {player === gameState.PlayerName && '(You)'}
  • + }) + } +
) }