These info objects get filled in with data that is streamed from the
server "/events" API. While the page is still loading, we don't want
to brifly see the skeleton of these objects drawn with no real data
inside them.
It's much cleaner to return null instead. This gives a clean result
where these sections of the page only appear when fully formed.
*********************************************************/
function GameInfo(props) {
*********************************************************/
function GameInfo(props) {
+ if (! props.id)
+ return null;
+
return (
<div className="game-info">
<h2>{props.id}</h2>
return (
<div className="game-info">
<h2>{props.id}</h2>
}
function PlayerInfo(props) {
}
function PlayerInfo(props) {
+ if (! props.id)
+ return null;
+
return (
<div className="player-info">
<h2>Player</h2>
return (
<div className="player-info">
<h2>Player</h2>