add link to replay page

src/App.js

@@ -18,7 +18,7 @@ function App() {
             <Navbar className={classes.navBar} gameName={""}/>
             <div style={{marginTop: '75px'}}>
                 <Route exact path="/">
-                    <Redirect to="/leaderboard" />
+                    <Redirect to="/leaderboard?type=game&name=leduc-holdem" />
                 </Route>
                 <Route path="/leaderboard" component={LeaderBoard} />
                 <Route path="/replay/doudizhu" component={DoudizhuGameView} />

src/view/GameView/DoudizhuGameView.js

@@ -23,6 +23,7 @@ import DialogContent from "@material-ui/core/DialogContent";
 import DialogContentText from "@material-ui/core/DialogContentText";
 import DialogActions from "@material-ui/core/DialogActions";
 import Dialog from "@material-ui/core/Dialog";
+import qs from "query-string";
 
 class DoudizhuGameView extends React.Component {
     constructor(props) {
@@ -174,12 +175,12 @@ class DoudizhuGameView extends React.Component {
     }
 
     startReplay() {
-        // for test use
+        const { name, agent0, agent1, index } = qs.parse(window.location.search);
-        const replayId  = 0;
+        const requestUrl = `${apiUrl}/tournament/replay?name=${name}&agent0=${agent0}&agent1=${agent1}&index=${index}`;
 
         // start full screen loading
         this.setState({fullScreenLoading: true});
-        axios.get(`${apiUrl}/replay/doudizhu/${replayId}`)
+        axios.get(requestUrl)
             .then(res => {
                 res = res.data;
                 // init replay info

src/view/GameView/LeducHoldemGameView.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import axios from 'axios';
+import qs from 'query-string';
 import '../../assets/gameview.scss';
 import {LeducHoldemGameBoard} from '../../components/GameBoard';
 import Navbar from '../../components/Navbar';
@@ -32,7 +33,6 @@ class LeducHoldemGameView extends React.Component {
         this.initConsiderationTime = 2000;
         this.considerationTimeDeduction = 100;
         this.gameStateTimeout = null;
-        this.apiUrl = apiUrl;
         this.moveHistory = [];
         this.moveHistoryTotalLength = null;
         this.gameStateHistory = [[],[]];
@@ -195,12 +195,12 @@ class LeducHoldemGameView extends React.Component {
     }
 
     startReplay() {
-        // for test use
+        const { name, agent0, agent1, index } = qs.parse(window.location.search);
-        const testUrl = '/tournament/replay?name=leduc-holdem&agent0=leduc-holdem-random&agent1=leduc-holdem-cfr&index=1';
+        const requestUrl = `${apiUrl}/tournament/replay?name=${name}&agent0=${agent0}&agent1=${agent1}&index=${index}`;
 
         // start full screen loading
         this.setState({fullScreenLoading: true});
-        axios.get(`${this.apiUrl}${testUrl}`)
+        axios.get(requestUrl)
             .then(res => {
                 res = res.data;
                 // init replay info

src/view/LeaderBoard.js

@@ -72,7 +72,8 @@ function createData(resData) {
         agent0: resData.fields.agent0,
         agent1: resData.fields.agent1,
         win: resData.fields.win ? 'Win' : 'Lose',
-        payoff: resData.fields.payoff
+        payoff: resData.fields.payoff,
+        replayUrl: `/replay/${resData.fields.name}?name=${resData.fields.name}&agent0=${resData.fields.agent0}&agent1=${resData.fields.agent1}&index=${resData.fields.index}`
     };
 }
 
@@ -82,7 +83,8 @@ const headCells = [
     { id: 'agent0', numeric: false, disablePadding: false, label: 'Agent 0' },
     { id: 'agent1', numeric: false, disablePadding: false, label: 'Agent 1' },
     { id: 'win', numeric: false, disablePadding: false, label: 'Result' },
-    { id: 'payoff', numeric: false, disablePadding: false, label: 'Payoff' }
+    { id: 'payoff', numeric: false, disablePadding: false, label: 'Payoff' },
+    { id: 'replay', numeric: false, disablePadding: false, label: 'Replay' }
 ];
 
 const StyledTableCell = withStyles((theme) => ({
@@ -261,6 +263,7 @@ const EnhancedTable = (props) => {
                                             <TableCell>{row.agent1}</TableCell>
                                             <TableCell>{row.win}</TableCell>
                                             <TableCell>{row.payoff}</TableCell>
+                                            <TableCell><a style={{display: "table-cell"}} href={row.replayUrl} target="_blank">Replay</a></TableCell>
                                         </TableRow>
                                     );
                                 })}