ReactJS: user managment

webapp/src/App.js

@@ -3,14 +3,15 @@ import React, { useState, useEffect } from 'react';
 
 function App() {
 
-  const [joke, setJoke] = useState(null);
+  const [activeGames, setActiveGames] = useState(null);
 
   useEffect(() => {
-    fetch('/api/badjokes')
+    fetch('/api/activegames')
       .then((response) => response.json())
-      .then((data) => {
-        console.log(data.joke);
-        setJoke(data.joke);
+      .then((games) => {
+        console.log(games.ActiveGames.length);
+        console.log("games: " +games.ActiveGames);
+        setActiveGames(games.ActiveGames);
       })
       .catch((err) => {
         console.log(err.message);
@@ -21,7 +22,7 @@ function App() {
     <div className="App">
       <header className="App-header">
         <p>
-          Here is your joke: {joke ? <span>{joke}</span> : <span>Loading...</span>}
+          Here is list of your active games: {activeGames ? <span>{activeGames}</span> : <span>Loading...</span>}
         </p>
       </header>
     </div>