1 import axios from 'axios';
2 import PropTypes from 'prop-types';
3 import React, { useCallback, useEffect, useState } from 'react';
4 import { Form } from 'react-bootstrap';
5 import { withTranslation } from 'react-i18next';
7 import debounce from '../../helpers/debounce';
8 import i18n from '../../i18n';
10 const DiscordChannelSelect = ({
19 const [results, setResults] = useState([]);
22 const fetch = useCallback(debounce(async (guild, types) => {
26 ctrl = new AbortController();
28 const response = await axios.get(`/api/discord-guilds/${guild}/channels`, {
35 setResults(response.data);
41 if (ctrl) ctrl.abort();
47 }, [guild, ...types]);
57 <option value="">{i18n.t('tournaments.discordNoCategory')}</option>
58 {results && results.length ? results.map(result =>
59 <option key={result.id} value={result.channel_id}>{result.name}</option>
64 DiscordChannelSelect.propTypes = {
65 guild: PropTypes.string,
66 isInvalid: PropTypes.bool,
67 name: PropTypes.string,
68 onBlur: PropTypes.func,
69 onChange: PropTypes.func,
70 types: PropTypes.arrayOf(PropTypes.number),
71 value: PropTypes.string,
74 export default withTranslation()(DiscordChannelSelect);