front: leaderboard

This commit is contained in:
djmil 2023-10-11 10:36:29 +02:00
parent 5168e38710
commit 992a1f3a23
4 changed files with 90 additions and 11 deletions

View File

@ -0,0 +1,34 @@
package djmil.cordacheckers.api;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import djmil.cordacheckers.cordaclient.CordaClient;
import djmil.cordacheckers.cordaclient.dao.Rank;
import djmil.cordacheckers.user.HoldingIdentityResolver;
@RestController
@RequestMapping("api/leaderboard")
public class LeaderboardController {
@Autowired
HoldingIdentityResolver holdingIdentityResolver;
@Autowired
CordaClient cordaClient;
@GetMapping
public ResponseEntity<Map<String, Rank>> getLeaderboard() {
final var hiCustodian = holdingIdentityResolver.getCustodian();
final Map<String, Rank> leaderboard = cordaClient.fetchRanking(hiCustodian);
return ResponseEntity.ok(leaderboard);
}
}

View File

@ -2,7 +2,7 @@
trust.store=classpath:keystore/truststore.p12 trust.store=classpath:keystore/truststore.p12
trust.store.password=test123 trust.store.password=test123
corda.host=https://localhost corda.host=https://192.168.10.8
corda.port=8888 corda.port=8888
corda.root.login=admin corda.root.login=admin
corda.root.passw=admin corda.root.passw=admin

View File

@ -1,17 +1,15 @@
import './App.css'; import './App.css';
import Leaderboard from "./Leaderboard";
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
function App() { function App() {
const [data, setData] = useState(null);
const [activeGames, setActiveGames] = useState(null);
useEffect(() => { useEffect(() => {
fetch('/api/activegames') fetch('/api/leaderboard')
.then((response) => response.json()) .then((response) => response.json())
.then((games) => { .then((data) => {
console.log(games.ActiveGames.length); setData(data);
console.log("games: " +games.ActiveGames);
setActiveGames(games.ActiveGames);
}) })
.catch((err) => { .catch((err) => {
console.log(err.message); console.log(err.message);
@ -21,9 +19,10 @@ function App() {
return ( return (
<div className="App"> <div className="App">
<header className="App-header"> <header className="App-header">
<p> <h1>Leaderboard</h1>
Here is list of your active games: {activeGames ? <span>{activeGames}</span> : <span>Loading...</span>} {
</p> data ? <Leaderboard hashmap={data} /> : <span>Loading...</span>
}
</header> </header>
</div> </div>
); );

46
webapp/src/Leaderboard.js Normal file
View File

@ -0,0 +1,46 @@
import React from "react";
//const Leaderboard = ({hashmap}) => {
// var listItems = Object.keys(hashmap).map(playerName => {
// var rank = hashmap[playerName];
// return <li key={playerName}>
// {playerName}: played {rank.gamesPlayed}, won {rank.gamesWon}, draw {rank.gamesDraw}
// </li>
// });
// return <ul>{listItems}</ul>;
const Leaderboard = ({ hashmap }) => {
const tableRows = Object.keys(hashmap).map(playerName => {
var rank = hashmap[playerName];
return <tr key={playerName}>
<td>{playerName}</td>
<td>{rank.gamesPlayed}</td>
<td>{rank.gamesWon}</td>
<td>{rank.gamesDraw}</td>
</tr>
});
return <div>
<table>
<thead>
<tr>
<th>Name</th>
<th>Played</th>
<th>Won</th>
<th>Draw</th>
</tr>
</thead>
<tbody>
{ tableRows }
</tbody>
</table>
</div>
};
export default Leaderboard;