import PropTypes from 'prop-types';
import React, { useState } from 'react';
import { Button } from 'react-bootstrap';
-import { withTranslation } from 'react-i18next';
+import { useTranslation } from 'react-i18next';
import LockDialog from './LockDialog';
import Icon from '../common/Icon';
import { mayLockRound } from '../../helpers/permissions';
-import { withUser } from '../../helpers/UserContext';
-import i18n from '../../i18n';
+import { useUser } from '../../hooks/user';
const LockButton = ({
round,
tournament,
- user,
}) => {
const [showDialog, setShowDialog] = useState(false);
+ const { t } = useTranslation();
+ const { user } = useUser();
+
if (!mayLockRound(user, tournament, round)) {
if (round.locked) {
- return <Icon.LOCKED title={i18n.t('rounds.locked')} />;
+ return <Icon.LOCKED title={t('rounds.locked')} />;
} else {
- return <Icon.UNLOCKED title={i18n.t('rounds.unlocked')} />;
+ return <Icon.UNLOCKED title={t('rounds.unlocked')} />;
}
}
<Button
onClick={() => setShowDialog(true)}
size="sm"
- title={round.locked ? i18n.t('rounds.locked') : i18n.t('rounds.unlocked') }
+ title={t(round.locked ? 'rounds.locked' : 'rounds.unlocked')}
variant="outline-secondary"
>
{round.locked ?
}),
tournament: PropTypes.shape({
}),
- user: PropTypes.shape({
- }),
};
-export default withTranslation()(withUser(LockButton));
+export default LockButton;