]> git.localhorst.tv Git - alttp.git/blob - resources/js/components/tournament/SettingsDialog.js
compact keysanity tracker
[alttp.git] / resources / js / components / tournament / SettingsDialog.js
1 import axios from 'axios';
2 import PropTypes from 'prop-types';
3 import React from 'react';
4 import { Button, Col, Modal, Row } from 'react-bootstrap';
5 import { withTranslation } from 'react-i18next';
6 import toastr from 'toastr';
7
8 import DiscordForm from './DiscordForm';
9 import DiscordSelect from '../common/DiscordSelect';
10 import Icon from '../common/Icon';
11 import ToggleSwitch from '../common/ToggleSwitch';
12 import Tournament from '../../helpers/Tournament';
13 import i18n from '../../i18n';
14
15 const open = async tournament => {
16         try {
17                 await axios.post(`/api/tournaments/${tournament.id}/open`);
18                 toastr.success(i18n.t('tournaments.openSuccess'));
19         } catch (e) {
20                 toastr.error(i18n.t('tournaments.openError'));
21         }
22 };
23
24 const close = async tournament => {
25         try {
26                 await axios.post(`/api/tournaments/${tournament.id}/close`);
27                 toastr.success(i18n.t('tournaments.closeSuccess'));
28         } catch (e) {
29                 toastr.error(i18n.t('tournaments.closeError'));
30         }
31 };
32
33 const lock = async tournament => {
34         try {
35                 await axios.post(`/api/tournaments/${tournament.id}/lock`);
36                 toastr.success(i18n.t('tournaments.lockSuccess'));
37         } catch (e) {
38                 toastr.error(i18n.t('tournaments.lockError'));
39         }
40 };
41
42 const unlock = async tournament => {
43         try {
44                 await axios.post(`/api/tournaments/${tournament.id}/unlock`);
45                 toastr.success(i18n.t('tournaments.unlockSuccess'));
46         } catch (e) {
47                 toastr.error(i18n.t('tournaments.unlockError'));
48         }
49 };
50
51 const setDiscord = async (tournament, guild_id) => {
52         try {
53                 await axios.post(`/api/tournaments/${tournament.id}/discord`, { guild_id });
54                 toastr.success(i18n.t('tournaments.discordSuccess'));
55         } catch (e) {
56                 toastr.error(i18n.t('tournaments.discordError'));
57         }
58 };
59
60 const settings = async (tournament, params) => {
61         try {
62                 await axios.post(`/api/tournaments/${tournament.id}/settings`, params);
63                 toastr.success(i18n.t('tournaments.settingsSuccess'));
64         } catch (e) {
65                 toastr.error(i18n.t('tournaments.settingsError'));
66         }
67 };
68
69 const inviteUrl = 'https://discordapp.com/oauth2/authorize?client_id=951113702839549982&scope=bot';
70
71 const SettingsDialog = ({
72         onHide,
73         show,
74         tournament,
75 }) =>
76 <Modal
77         className="settings-dialog"
78         onHide={onHide}
79         show={show}
80         size={tournament.discord ? 'lg' : 'md'}
81 >
82         <Modal.Header closeButton>
83                 <Modal.Title>
84                         {i18n.t('tournaments.settings')}
85                 </Modal.Title>
86         </Modal.Header>
87         <Modal.Body>
88                 <Row>
89                         <Col sm={tournament.discord ? 6 : 12}>
90                                 {Tournament.hasSignup(tournament) ?
91                                         <div className="d-flex align-items-center justify-content-between mb-3">
92                                                 <span>{i18n.t('tournaments.open')}</span>
93                                                 <ToggleSwitch
94                                                         onChange={({ target: { value } }) => value
95                                                                 ? open(tournament) : close(tournament)}
96                                                         value={tournament.accept_applications}
97                                                 />
98                                         </div>
99                                 : null}
100                                 <div className="d-flex align-items-center justify-content-between mb-3">
101                                         <span>{i18n.t('tournaments.locked')}</span>
102                                         <ToggleSwitch
103                                                 onChange={({ target: { value } }) => value
104                                                         ? lock(tournament) : unlock(tournament)}
105                                                 value={tournament.locked}
106                                         />
107                                 </div>
108                                 <div className="d-flex align-items-center justify-content-between mb-3">
109                                         <span>{i18n.t('tournaments.showNumbers')}</span>
110                                         <ToggleSwitch
111                                                 onChange={({ target: { value } }) =>
112                                                         settings(tournament, { show_numbers: value })}
113                                                 value={tournament.show_numbers}
114                                         />
115                                 </div>
116                                 <div className="d-flex align-items-center justify-content-between">
117                                         <div>
118                                                 <p>{i18n.t('tournaments.discord')}</p>
119                                                 {!tournament.discord ?
120                                                         <div>
121                                                                 <Button
122                                                                         href={inviteUrl}
123                                                                         target="_blank"
124                                                                         variant="discord"
125                                                                 >
126                                                                         <Icon.DISCORD />
127                                                                         {' '}
128                                                                         {i18n.t('tournaments.inviteBot')}
129                                                                 </Button>
130                                                         </div>
131                                                 : null}
132                                         </div>
133                                         <DiscordSelect
134                                                 onChange={({ target: { value } }) => setDiscord(tournament, value)}
135                                                 value={tournament.discord}
136                                         />
137                                 </div>
138                         </Col>
139                         {tournament.discord ?
140                                 <Col sm={6}>
141                                         <DiscordForm tournament={tournament} />
142                                 </Col>
143                         : null}
144                 </Row>
145         </Modal.Body>
146         <Modal.Footer>
147                 <Button onClick={onHide} variant="secondary">
148                         {i18n.t('button.close')}
149                 </Button>
150         </Modal.Footer>
151 </Modal>;
152
153 SettingsDialog.propTypes = {
154         onHide: PropTypes.func,
155         show: PropTypes.bool,
156         tournament: PropTypes.shape({
157                 accept_applications: PropTypes.bool,
158                 discord: PropTypes.string,
159                 locked: PropTypes.bool,
160                 show_numbers: PropTypes.bool,
161         }),
162 };
163
164 export default withTranslation()(SettingsDialog);