summaryrefslogtreecommitdiff
path: root/frontend/src/components/lobby/PlayerList.jsx
blob: 87887dd084fbce63b7e21670ab2914c10a0bd031 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
//@flow
import { Icon } from '@blueprintjs/core'
import { List } from 'immutable';
import * as React from 'react';
import { Flex } from 'reflexbox';
import { Player } from '../../models/players';

type PlayerListProps = {
  players: List<Player>,
  owner: string,
  currentPlayer: Player,
};

const PlayerListItem = ({player, isOwner, isUser}) => (
  <tr>
    <td>
      <Flex align='center'>
        {isOwner && <Icon icon='badge' title='Game owner'/>}
        {isUser && <Icon icon='user' title='This is you'/>}
      </Flex>
    </td>
    <td>{player.displayName}</td>
    <td>{player.username}</td>
  </tr>
);

export const PlayerList = ({players, owner, currentPlayer}: PlayerListProps) => (
  <table className='pt-html-table'>
    <tbody>
      {players.map(player => <PlayerListItem key={player.username}
                                             player={player}
                                             isOwner={player.username === owner}
                                             isUser={player.username === currentPlayer.username}/>)}
    </tbody>
  </table>
);
bgstack15