resources/js/components/rounds/LockDialog.js

   1 import axios from 'axios';
   2 import PropTypes from 'prop-types';
   3 import React from 'react';
   4 import { Alert, Button, Modal } from 'react-bootstrap';
   5 import { withTranslation } from 'react-i18next';
   6 import toastr from 'toastr';
   7
   8 import { isComplete } from '../../helpers/Round';
   9 import i18n from '../../i18n';
  10
  11 const LockDialog = ({
  12         onHide,
  13         round,
  14         show,
  15         tournament,
  16 }) =>
  17 <Modal className="lock-dialog" onHide={onHide} show={show}>
  18         <Modal.Header closeButton>
  19                 <Modal.Title>
  20                         {i18n.t(round.locked ? 'rounds.unlock' : 'rounds.lock')}
  21                 </Modal.Title>
  22         </Modal.Header>
  23         <Modal.Body>
  24                 <p>{i18n.t(round.locked
  25                         ? 'rounds.unlockDescription'
  26                         : 'rounds.lockDescription')}
  27                 </p>
  28         {!round.locked && !isComplete(tournament, round) ?
  29                 <Alert variant="warning">
  30                         {i18n.t('rounds.lockIncompleteWarning')}
  31                 </Alert>
  32         : null}
  33         </Modal.Body>
  34         <Modal.Footer>
  35                 {onHide ?
  36                         <Button onClick={onHide} variant="secondary">
  37                                 {i18n.t('button.cancel')}
  38                         </Button>
  39                 : null}
  40                 <Button
  41                         onClick={async () => {
  42                                 if (round.locked) {
  43                                         try {
  44                                                 await axios.post(`/api/rounds/${round.id}/unlock`);
  45                                                 toastr.success(i18n.t('rounds.unlockSuccess'));
  46                                                 onHide();
  47                                         } catch (e) {
  48                                                 toastr.error(i18n.t('rounds.unlockError'));
  49                                         }
  50                                 } else {
  51                                         try {
  52                                                 await axios.post(`/api/rounds/${round.id}/lock`);
  53                                                 toastr.success(i18n.t('rounds.lockSuccess'));
  54                                                 onHide();
  55                                         } catch (e) {
  56                                                 toastr.error(i18n.t('rounds.lockError'));
  57                                         }
  58                                 }
  59                         }}
  60                         variant="primary"
  61                 >
  62                         {i18n.t(round.locked ? 'rounds.unlock' : 'rounds.lock')}
  63                 </Button>
  64         </Modal.Footer>
  65 </Modal>;
  66
  67 LockDialog.propTypes = {
  68         onHide: PropTypes.func,
  69         round: PropTypes.shape({
  70                 id: PropTypes.number,
  71                 locked: PropTypes.bool,
  72         }),
  73         show: PropTypes.bool,
  74         tournament: PropTypes.shape({
  75         }),
  76 };
  77
  78 export default withTranslation()(LockDialog);