59 lines
1.4 KiB
JavaScript
59 lines
1.4 KiB
JavaScript
import React from 'react';
|
|
import {Accept, Reject, Cancel} from './GameProposalAction';
|
|
import './GameProposal.css';
|
|
|
|
const State = {
|
|
WaitForOpponent: "GAME_PROPOSAL_WAIT_FOR_OPPONENT",
|
|
WaitForYou: "GAME_PROPOSAL_WAIT_FOR_YOU",
|
|
}
|
|
|
|
const GameProposal = ({games}) => {
|
|
|
|
if (games == null)
|
|
return <p>Loading..</p>
|
|
|
|
// for (const [key, value] of Object.entries(games))
|
|
// console.log(key, value);
|
|
|
|
const waitForYou = games
|
|
.filter(game => game.status === State.WaitForYou)
|
|
.map(game => {
|
|
return <div class="li" key={game.uuid}>
|
|
<p>
|
|
from {game.opponentName}, opponentColor {game.opponentColor}
|
|
<br/>
|
|
<q>{game.message}</q>
|
|
<br/>
|
|
<Accept uuid={game.uuid}/>
|
|
<Reject uuid={game.uuid}/>
|
|
</p>
|
|
</div>
|
|
});
|
|
|
|
const WaitForOpponent = games
|
|
.filter(game => game.status === State.WaitForOpponent)
|
|
.map(game => {
|
|
return <div class="li" key={game.uuid}>
|
|
<p>
|
|
to {game.opponentName}, opponentColor ⛀ ⛂{game.opponentColor}
|
|
<br/>
|
|
<q>{game.message}</q>
|
|
<br/>
|
|
<Cancel uuid={game.uuid}/>
|
|
</p>
|
|
</div>
|
|
});
|
|
|
|
return <div className="GameProposal">
|
|
{waitForYou}
|
|
{WaitForOpponent.length > 0 &&
|
|
<div class="separator">
|
|
waiting for opponent ({WaitForOpponent.length})
|
|
</div>
|
|
}
|
|
{WaitForOpponent}
|
|
</div>
|
|
};
|
|
|
|
export default GameProposal;
|