unresponcive while fetching (#20)

Reviewed-on: http://192.168.8.55:3000/HQLAx/CordaCheckers/pulls/20
This commit is contained in:
djmil 2023-11-01 10:39:39 +01:00
parent 306ecea262
commit c999302cda
2 changed files with 17 additions and 11 deletions

View File

@ -22,7 +22,9 @@
margin: 2px;
}
.game-action.create:hover {
.game-action.create:hover, /* OR */
.game-action.busy
{
background-color:#00b0ff60;
}

View File

@ -14,7 +14,10 @@ export default function Create() {
if (!ctx.hasCurrentUser)
return alert("You must be one of the players");
const request = ctx.get_GameProposalRequest()
if (ctx.fetching === true)
return
const request = ctx.getGameProposalRequest()
ctx.setFetching(true)
@ -28,7 +31,10 @@ export default function Create() {
return (
<button
className={'game-action create' + (ctx.isEnabled ? ' enabled' : ' disabled')}
className={'game-action create'
+ (ctx.enabled ? ' enabled' : ' disabled')
+ (ctx.fetching ? ' busy' : '')
}
onClick={onClick}
>
<Wobler text="Leaderboard" dance={ctx.fetching} />
@ -50,10 +56,8 @@ function Definitions() {
const hasCurrentUser = isCurrentUser(whitePlayerName) || isCurrentUser(blackPlayerName)
const isEnabled = hasPlayers && hasCurrentUser
const get_GameProposalRequest = () => {
const [opponentName, opponentColor] = get_Opponent(isCurrentUser, whitePlayerName, blackPlayerName)
const getGameProposalRequest = () => {
const [opponentName, opponentColor] = getOpponent(isCurrentUser, whitePlayerName, blackPlayerName)
return {
opponentName,
@ -66,17 +70,17 @@ function Definitions() {
return {
hasPlayers,
hasCurrentUser,
isEnabled,
enabled: hasPlayers && hasCurrentUser,
fetching: ctx.newGame.fetching,
setFetching: (status) => { dispatchCtx({ update: "newGame", fetching: status }) },
get_GameProposalRequest,
getGameProposalRequest,
clear_Message2Opponent: () => { dispatchCtx({ update: "newGame", message: '' }) },
}
}
function get_Opponent(isCurrentUser, whitePlayerName, blackPlayerName) {
function getOpponent(isCurrentUser, whitePlayerName, blackPlayerName) {
if (isCurrentUser(whitePlayerName)) {
return [blackPlayerName, BLACK()]
}
@ -102,6 +106,6 @@ async function postData(url = "", data = {}) {
if (response.ok)
return response.json()// parses JSON response into native JavaScript objects
console.log("recponce", response)
console.wrn(response)
return {}
}