Score rendering skeleton

ui/src/App.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { createGame, gameInfo, joinGame, getGuesses, sendGuess } from "./services/ggsh.service";
 import GamePanel from "./components/game-panel.component";
 import ApiInfo from "./components/api-info.component";
+import PlayerScores from "./components/player-scores.component";
 import './App.css';
 
 const GameInfo = ({game}) => {
@@ -111,6 +112,7 @@ class Game extends React.Component {
       currentRound: null,
       targetPoint: null,
       selectedPoint: null,
+      playerScores: null,
     }
   }
 
@@ -125,12 +127,22 @@ class Game extends React.Component {
   async updateRoundState() {
     const { gameId, playerName } = this.state;
     const { currentRound } = await getGuesses(gameId, playerName);
+    const { coords, players } = await gameInfo(gameId);
     if (currentRound) {
-      const { coords } = await gameInfo(gameId);
       const targetPoint = coords[currentRound];
-      this.setState({ loading: false, currentRound, targetPoint });
+      this.setState({ 
+        loading: false, 
+        currentRound, 
+        targetPoint 
+      });
     } else {
-      this.setState({ loading: false, gameId: null, currentRound: null, targetPoint: null });
+      this.setState({ 
+        loading: false, 
+        gameId: null, 
+        currentRound: null, 
+        targetPoint: null, 
+        playerScores: players, 
+      });
     }
   }
 
@@ -143,7 +155,7 @@ class Game extends React.Component {
   }
 
   render() {
-    const { loading, selectedPoint, targetPoint } = this.state;
+    const { loading, selectedPoint, targetPoint, playerScores } = this.state;
 
     if (loading) {
       return <p>Loading...</p>
@@ -151,6 +163,7 @@ class Game extends React.Component {
 
     if (!targetPoint) {
       return (<div>
+      {(playerScores ? [<PlayerScores scores={playerScores}/>, <hr/>] : null)}
         <p>No game in progress!</p>
         <button onClick={() => this.handleGameCreate()}>Create New Game</button>
       </div>);

ui/src/components/player-scores.component.jsx

@@ -0,0 +1,10 @@
+import React from 'react';
+
+const PlayerScores = ({scores}) => (
+    <div>
+        <p>Scores from previous game:</p>
+        <p>{JSON.stringify(scores)}</p>
+    </div>
+);
+
+export default PlayerScores;