resources/js/components/tournament/ApplyButton.js

   1 import axios from 'axios';
   2 import PropTypes from 'prop-types';
   3 import React from 'react';
   4 import { Button } from 'react-bootstrap';
   5 import { withTranslation } from 'react-i18next';
   6 import toastr from 'toastr';
   7
   8 import Icon from '../common/Icon';
   9 import { isApplicant, isDeniedApplicant, isRunner, mayApply } from '../../helpers/permissions';
  10 import { withUser } from '../../helpers/UserContext';
  11 import i18n from '../../i18n';
  12
  13 const apply = async tournament => {
  14         try {
  15                 await axios.post(`/api/tournaments/${tournament.id}/apply`);
  16                 toastr.success(i18n.t('tournaments.applySuccess'));
  17         } catch (e) {
  18                 toastr.error(i18n.t('tournaments.applyError'));
  19         }
  20 };
  21
  22 const getTitle = (user, tournament) => {
  23         if (isDeniedApplicant(user, tournament)) {
  24                 return i18n.t('tournaments.applicationDenied');
  25         }
  26         if (isApplicant(user, tournament)) {
  27                 return i18n.t('tournaments.applicationPending');
  28         }
  29         return i18n.t('tournaments.apply');
  30 };
  31
  32 const ApplyButton = ({ tournament, user }) => {
  33         if (!tournament.accept_applications || isRunner(user, tournament)) return null;
  34
  35         return <span className="d-inline-block" title={getTitle(user, tournament)}>
  36                 <Button
  37                         disabled={!mayApply(user, tournament)}
  38                         onClick={() => apply(tournament)}
  39                         variant="primary"
  40                 >
  41                         <Icon.APPLY title="" />
  42                 </Button>
  43         </span>;
  44 };
  45
  46 ApplyButton.propTypes = {
  47         tournament: PropTypes.shape({
  48                 accept_applications: PropTypes.bool,
  49                 id: PropTypes.number,
  50         }),
  51         user: PropTypes.shape({
  52         }),
  53 };
  54
  55 export default withTranslation()(withUser(ApplyButton));