allow admins to lock/unlock rounds

[alttp.git] / resources / js / components / rounds / LockDialog.js

diff --git a/resources/js/components/rounds/LockDialog.js b/resources/js/components/rounds/LockDialog.js
new file mode 100644 (file)
index 0000000..690e85c
--- /dev/null
+++ b/resources/js/components/rounds/LockDialog.js
@@ -0,0 +1,78 @@
+import axios from 'axios';
+import PropTypes from 'prop-types';
+import React from 'react';
+import { Alert, Button, Modal } from 'react-bootstrap';
+import { withTranslation } from 'react-i18next';
+import toastr from 'toastr';
+
+import { isComplete } from '../../helpers/Round';
+import i18n from '../../i18n';
+
+const LockDialog = ({
+       onHide,
+       round,
+       show,
+       tournament,
+}) =>
+<Modal className="lock-dialog" onHide={onHide} show={show}>
+       <Modal.Header closeButton>
+               <Modal.Title>
+                       {i18n.t(round.locked ? 'rounds.unlock' : 'rounds.lock')}
+               </Modal.Title>
+       </Modal.Header>
+       <Modal.Body>
+               <p>{i18n.t(round.locked
+                       ? 'rounds.unlockDescription'
+                       : 'rounds.lockDescription')}
+               </p>
+       {!round.locked && !isComplete(tournament, round) ?
+               <Alert variant="warning">
+                       {i18n.t('rounds.lockIncompleteWarning')}
+               </Alert>
+       : null}
+       </Modal.Body>
+       <Modal.Footer>
+               {onHide ?
+                       <Button onClick={onHide} variant="secondary">
+                               {i18n.t('button.cancel')}
+                       </Button>
+               : null}
+               <Button
+                       onClick={async () => {
+                               if (round.locked) {
+                                       try {
+                                               await axios.post(`/api/rounds/${round.id}/unlock`);
+                                               toastr.success(i18n.t('rounds.unlockSuccess'));
+                                               onHide();
+                                       } catch (e) {
+                                               toastr.error(i18n.t('rounds.unlockError'));
+                                       }
+                               } else {
+                                       try {
+                                               await axios.post(`/api/rounds/${round.id}/lock`);
+                                               toastr.success(i18n.t('rounds.lockSuccess'));
+                                               onHide();
+                                       } catch (e) {
+                                               toastr.error(i18n.t('rounds.lockError'));
+                                       }
+                               }
+                       }}
+                       variant="primary"
+               >
+                       {i18n.t(round.locked ? 'rounds.unlock' : 'rounds.lock')}
+               </Button>
+       </Modal.Footer>
+</Modal>;
+
+LockDialog.propTypes = {
+       onHide: PropTypes.func,
+       round: PropTypes.shape({
+               id: PropTypes.number,
+               locked: PropTypes.bool,
+       }),
+       show: PropTypes.bool,
+       tournament: PropTypes.shape({
+       }),
+};
+
+export default withTranslation()(LockDialog);