highlight "todo" rounds

[alttp.git] / resources / js / components / tournament / Detail.js

diff --git a/resources/js/components/tournament/Detail.js b/resources/js/components/tournament/Detail.js
index 5b8e7804a5e45e0006c27a4f9bdae44d985bff33..1afcc29f10611a1e434c13f3a035dcfad3da9cee 100644 (file)
--- a/resources/js/components/tournament/Detail.js
+++ b/resources/js/components/tournament/Detail.js
@@ -8,6 +8,7 @@ import Protocol from '../protocol/Protocol';
 import Rounds from '../rounds/List';
 import Box from '../users/Box';
 import {
+       isRunner,
        mayAddRounds,
        mayViewProtocol,
 } from '../../helpers/permissions';
@@ -19,11 +20,24 @@ import {
 import { withUser } from '../../helpers/UserContext';
 import i18n from '../../i18n';
 
+const getClassName = (tournament, user) => {
+       const classNames = ['tournament'];
+       if (tournament.locked) {
+               classNames.push('is-locked');
+       } else {
+               classNames.push('is-active');
+       }
+       if (isRunner(user, tournament)) {
+               classNames.push('is-runner');
+       }
+       return classNames.join(' ');
+};
+
 const Detail = ({
        addRound,
        tournament,
        user,
-}) => <Container fluid>
+}) => <Container className={getClassName(tournament, user)} fluid>
        <Row>
                <Col lg={8} xl={9}>
                        <div className="d-flex align-items-center justify-content-between">