import './index.css';
import React from 'react';
import {Accept} from './GameProposalAction';
import Reject from './Reject'
import Cancel from './GameProposalCancel'
import { AppData } from "../../context/data"
//import { AppContext } from "../../context/app"
export default function GameProposal() {
const [data] = React.useContext(AppData)
if (data.games == null)
return
Loading..
// for (const [key, value] of Object.entries(data.games))
// console.log(key, value);
const waitForYou = data.games
.filter(game => game.status === Status.WaitForYou)
.map(game => {
return
You {Stone(game.myColor)} vs {game.opponentName} {Stone(oppositeColor(game.myColor))}
{game.message}
});
const WaitForOpponent = data.games
.filter(game => game.status === Status.WaitForOpponent)
.map(game => {
return
You {Stone(game.myColor)} vs {game.opponentName} {Stone(oppositeColor(game.myColor))}
{game.message}
});
return
{waitForYou}
{WaitForOpponent.length > 0 &&
waiting for opponent ({WaitForOpponent.length})
}
{WaitForOpponent}
};
const Status = {
WaitForOpponent: "GAME_PROPOSAL_WAIT_FOR_OPPONENT",
WaitForYou: "GAME_PROPOSAL_WAIT_FOR_YOU",
}
function Stone(color) {
if (color === "WHITE")
return ⛀
if (color === "BLACK")
return ⛂
return {color}
}
function oppositeColor(color) {
if (color === "WHITE")
return "BLACK"
if (color === "BLACK")
return "WHITE"
return color
}