]> git.localhorst.tv Git - alttp.git/blob - resources/js/components/tournament/Detail.js
server calculated scoring
[alttp.git] / resources / js / components / tournament / Detail.js
1 import PropTypes from 'prop-types';
2 import React from 'react';
3 import { Button, Col, Container, Row } from 'react-bootstrap';
4 import { withTranslation } from 'react-i18next';
5
6 import Scoreboard from './Scoreboard';
7 import Protocol from '../protocol/Protocol';
8 import Rounds from '../rounds/List';
9 import Box from '../users/Box';
10 import {
11         isRunner,
12         mayAddRounds,
13         mayViewProtocol,
14 } from '../../helpers/permissions';
15 import {
16         getTournamentAdmins,
17         hasRunners,
18         hasTournamentAdmins,
19 } from '../../helpers/Tournament';
20 import { withUser } from '../../helpers/UserContext';
21 import i18n from '../../i18n';
22
23 const getClassName = (tournament, user) => {
24         const classNames = ['tournament'];
25         if (tournament.locked) {
26                 classNames.push('is-locked');
27         } else {
28                 classNames.push('is-active');
29         }
30         if (isRunner(user, tournament)) {
31                 classNames.push('is-runner');
32         }
33         return classNames.join(' ');
34 };
35
36 const Detail = ({
37         addRound,
38         tournament,
39         user,
40 }) => <Container className={getClassName(tournament, user)} fluid>
41         <Row>
42                 <Col lg={8} xl={9}>
43                         <div className="d-flex align-items-center justify-content-between">
44                                 <h1>{tournament.title}</h1>
45                                 {mayViewProtocol(user, tournament) ?
46                                         <Protocol id={tournament.id} />
47                                 : null}
48                         </div>
49                 </Col>
50         </Row>
51         <Row>
52                 <Col lg={{ order: 2, span: 4 }} xl={{ order: 2, span: 3 }}>
53                         <div className="d-flex align-items-center justify-content-between">
54                                 <h2>{i18n.t('tournaments.scoreboard')}</h2>
55                         </div>
56                         {hasRunners(tournament) ?
57                                 <Scoreboard tournament={tournament} />
58                         : null}
59                         {hasTournamentAdmins(tournament) ?
60                                 <>
61                                         <div className="d-flex align-items-center justify-content-between">
62                                                 <h2>{i18n.t('tournaments.admins')}</h2>
63                                         </div>
64                                         {getTournamentAdmins(tournament).map(p =>
65                                                 <p key={p.id}><Box user={p.user} /></p>
66                                         )}
67                                 </>
68                         : null}
69                 </Col>
70                 <Col lg={{ order: 1, span: 8 }} xl={{ order: 1, span: 9 }}>
71                         <div className="d-flex align-items-center justify-content-between">
72                                 <h2>{i18n.t('rounds.heading')}</h2>
73                                 {addRound && mayAddRounds(user, tournament) ?
74                                         <Button onClick={addRound}>
75                                                 {i18n.t('rounds.new')}
76                                         </Button>
77                                 : null}
78                         </div>
79                         {tournament.rounds ?
80                                 <Rounds rounds={tournament.rounds} tournament={tournament} />
81                         : null}
82                 </Col>
83         </Row>
84 </Container>;
85
86 Detail.propTypes = {
87         addRound: PropTypes.func,
88         tournament: PropTypes.shape({
89                 id: PropTypes.number,
90                 participants: PropTypes.arrayOf(PropTypes.shape({
91                 })),
92                 rounds: PropTypes.arrayOf(PropTypes.shape({
93                 })),
94                 title: PropTypes.string,
95         }),
96         user: PropTypes.shape({
97         }),
98 };
99
100 export default withTranslation()(withUser(Detail));