fixing use of useState

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

@@ -1,4 +1,4 @@
-import React, { useState,useEffect } from 'react';
+import React, { useState, useEffect } from 'react';
 import { gameInfo } from '../../services/ggsh.service';
 import Loading from '../loading.component';
 import PlayerScores from "./player-score-list.component";

client/src/components/pre-game.component/pre-game.component.jsx

@@ -6,12 +6,6 @@ import { createGame, joinGame } from "../../services/ggsh.service";
 
 // TODO set round timer for new game
 
-const initialState = playerName => ({
-  loading: false,
-  gameId: null,
-  playerName,
-});
-
 const NewGame = ({ onCreateGame, cannotCreateGame }) => (
   <button onClick={onCreateGame} disabled={cannotCreateGame}>
     Create New Game
@@ -19,24 +13,25 @@ const NewGame = ({ onCreateGame, cannotCreateGame }) => (
 );
 
 const PreGame = ({ initPlayerName, onGameJoined }) => {
-  const [state, setState] = useState(initialState(initPlayerName));
-  const { loading, gameId, playerName } = state;
+  const [loading, setLoading] = useState(false);
+  const [gameId, setGameId] = useState(null);
+  const [playerName, setPlayerName] = useState(initPlayerName);
 
   if (loading) {
     return <Loading/>
   }
 
-  const onChangePlayerName = ({ target }) => setState({ ...state, playerName: target.value.trim() });
-  const onChangeGameId = ({ target }) => setState({ ...state, gameId: target.value.trim() });
+  const onChangePlayerName = ({ target }) => setPlayerName(target.value);
+  const onChangeGameId = ({ target }) => setGameId(target.value.trim());
   const onCreateGame = async () => {
-    setState({ ...state, loading: true })
+    setLoading(true);
     const gameId = await createGame(playerName, 300);
     onGameJoined({ gameId, playerName });
   };
   const cannotCreateGame = !playerName || playerName.length === 0;
   const onJoinGame = async () => {
     // TODO would like to support re-joining a game you left
-    setState({ ...state, loading: true })
+    setLoading(true);
     await joinGame(gameId, playerName);
     onGameJoined({ gameId, playerName });
   };