1 import PropTypes from 'prop-types';
2 import React from 'react';
3 import { withTranslation } from 'react-i18next';
5 import EditButton from './EditButton';
6 import LockButton from './LockButton';
7 import SeedButton from './SeedButton';
8 import SeedCode from './SeedCode';
9 import SeedRolledBy from './SeedRolledBy';
10 import List from '../results/List';
11 import ReportButton from '../results/ReportButton';
12 import { mayEditRound, mayReportResult, isRunner } from '../../helpers/permissions';
13 import { isComplete } from '../../helpers/Round';
14 import { hasFinishedRound } from '../../helpers/User';
15 import { withUser } from '../../helpers/UserContext';
16 import i18n from '../../i18n';
18 const getClassName = (round, tournament, user) => {
19 const classNames = ['round'];
21 classNames.push('is-locked');
23 classNames.push('is-unlocked');
25 if (isComplete(tournament, round)) {
26 classNames.push('is-complete');
28 classNames.push('is-incomplete');
30 if (hasFinishedRound(user, round)) {
31 classNames.push('has-finished');
32 } else if (isRunner(user, tournament)) {
33 classNames.push('has-not-finished');
35 return classNames.join(' ');
43 <li className={getClassName(round, tournament, user)}>
45 <h3>{round.title}</h3>
47 <div className="d-flex">
48 <div className="info">
50 {round.number ? `#${round.number} ` : '#?'}
51 {i18n.t('rounds.date', { date: new Date(round.created_at) })}
54 {round.code && round.code.length ?
56 <SeedCode code={round.code} game={round.game || 'alttpr'} />
62 tournament={tournament}
65 <SeedRolledBy round={round} />
67 {mayReportResult(user, tournament) ?
68 <p className="report">
71 tournament={tournament}
76 {tournament.type === 'open-async' && round.results && round.results.length ?
77 <p>{i18n.t('rounds.numberOfResults', { count: round.results.length })}</p>
79 <div className="button-bar">
80 <LockButton round={round} tournament={tournament} />
81 {mayEditRound(user, tournament, round) ?
82 <EditButton round={round} tournament={tournament} />
86 <List round={round} tournament={tournament} />
91 round: PropTypes.shape({
92 code: PropTypes.arrayOf(PropTypes.string),
93 created_at: PropTypes.string,
94 game: PropTypes.string,
95 locked: PropTypes.bool,
96 number: PropTypes.number,
97 results: PropTypes.arrayOf(PropTypes.shape({
99 seed: PropTypes.string,
100 title: PropTypes.string,
102 tournament: PropTypes.shape({
103 participants: PropTypes.arrayOf(PropTypes.shape({
105 type: PropTypes.string,
107 user: PropTypes.shape({
111 export default withTranslation()(withUser(Item));