]> git.localhorst.tv Git - alttp.git/blob - resources/js/components/twitch-bot/Command.js
tracker items as svg
[alttp.git] / resources / js / components / twitch-bot / Command.js
1 import PropTypes from 'prop-types';
2 import React from 'react';
3 import { Button } from 'react-bootstrap';
4 import { useTranslation } from 'react-i18next';
5
6 import Icon from '../common/Icon';
7
8 const Command = ({
9         name,
10         onEditCommand,
11         onRemoveCommand,
12         settings,
13 }) => {
14         const { t } = useTranslation();
15
16         const type = (settings && settings.command) || 'none';
17
18         return <tr>
19                 <td>{`!${name}`}</td>
20                 <td>{t(`twitchBot.commandRestrictions.${(settings && settings.restrict) || 'none'}`)}</td>
21                 <td>{t(`twitchBot.commandTypes.${type}`)}</td>
22                 <td className="text-end">
23                         <div className="button-bar">
24                                 {onEditCommand ?
25                                         <Button
26                                                 onClick={() => onEditCommand(name, settings)}
27                                                 title={t('button.edit')}
28                                                 variant="outline-secondary"
29                                         >
30                                                 <Icon.EDIT title="" />
31                                         </Button>
32                                 : null}
33                                 {onRemoveCommand ?
34                                         <Button
35                                                 onClick={() => onRemoveCommand(name)}
36                                                 title={t('button.remove')}
37                                                 variant="outline-danger"
38                                         >
39                                                 <Icon.REMOVE title="" />
40                                         </Button>
41                                 : null}
42                         </div>
43                 </td>
44         </tr>;
45 };
46
47 Command.propTypes = {
48         name: PropTypes.string,
49         onEditCommand: PropTypes.func,
50         onRemoveCommand: PropTypes.func,
51         settings: PropTypes.shape({
52                 command: PropTypes.string,
53                 restrict: PropTypes.string,
54         }),
55 };
56
57 export default Command;