2021-05-19 10:08:30 +00:00
|
|
|
// @flow
|
|
|
|
|
|
|
|
import React from 'react';
|
2021-05-19 11:05:28 +00:00
|
|
|
import { useTranslation } from 'react-i18next';
|
2021-05-24 11:08:58 +00:00
|
|
|
import { Text, View } from 'react-native';
|
|
|
|
import { Button } from 'react-native-paper';
|
2021-05-19 10:08:30 +00:00
|
|
|
|
|
|
|
import { LobbyParticipantItem } from './LobbyParticipantItem';
|
|
|
|
import { participants } from './participants';
|
2021-05-20 16:06:52 +00:00
|
|
|
import styles from './styles';
|
2021-05-19 10:08:30 +00:00
|
|
|
|
2021-05-19 11:05:28 +00:00
|
|
|
export const LobbyParticipantList = () => {
|
|
|
|
const { t } = useTranslation();
|
|
|
|
|
|
|
|
return (
|
2021-05-24 18:23:41 +00:00
|
|
|
<View style = { styles.lobbyList }>
|
|
|
|
<View style = { styles.lobbyListDetails } >
|
2021-05-24 11:08:58 +00:00
|
|
|
<Text style = { styles.lobbyListDescription }>
|
|
|
|
{t('participantsPane.headings.lobby',
|
|
|
|
{ count: participants.length })}
|
|
|
|
</Text>
|
|
|
|
<View style = { styles.lobbyListActions }>
|
|
|
|
<Button
|
2021-05-24 18:23:41 +00:00
|
|
|
labelStyle = { styles.allParticipantActionsButton }
|
2021-05-24 11:08:58 +00:00
|
|
|
mode = 'text'>
|
|
|
|
{t('lobby.admitAll')}
|
|
|
|
</Button>
|
|
|
|
<Button
|
2021-05-24 18:23:41 +00:00
|
|
|
labelStyle = { styles.allParticipantActionsButton }
|
2021-05-24 11:08:58 +00:00
|
|
|
mode = 'text'>
|
|
|
|
{t('lobby.rejectAll')}
|
|
|
|
</Button>
|
|
|
|
</View>
|
|
|
|
</View>
|
2021-05-20 16:06:52 +00:00
|
|
|
{ participants.map(p => (
|
|
|
|
<LobbyParticipantItem
|
|
|
|
key = { p.id }
|
|
|
|
participant = { p } />)
|
|
|
|
)}
|
2021-05-24 18:23:41 +00:00
|
|
|
</View>
|
2021-05-19 11:05:28 +00:00
|
|
|
);
|
|
|
|
};
|