const [resolved, setResolved] = useState(null);
const [results, setResults] = useState([]);
const [search, setSearch] = useState('');
const [resolved, setResolved] = useState(null);
const [results, setResults] = useState([]);
const [search, setSearch] = useState('');
if (value) {
return <div className="d-flex align-items-center justify-content-between">
<span>{resolved ? resolved.title : value}</span>
if (value) {
return <div className="d-flex align-items-center justify-content-between">
<span>{resolved ? resolved.title : value}</span>
- <Button
- className="ms-2"
- onClick={() => onChange({ channel: null, target: { value: '' }})}
- title={t('button.unset')}
- variant="outline-danger"
- >
- <Icon.REMOVE title="" />
- </Button>
+ {!readOnly ?
+ <Button
+ className="ms-2"
+ onClick={() => onChange({ channel: null, target: { value: '' }})}
+ title={t('button.unset')}
+ variant="outline-danger"
+ >
+ <Icon.REMOVE title="" />
+ </Button>
+ : null}
name={Math.random().toString(20).substr(2, 10)}
onChange={e => setSearch(e.target.value)}
onFocus={() => setShowResults(true)}
name={Math.random().toString(20).substr(2, 10)}
onChange={e => setSearch(e.target.value)}
onFocus={() => setShowResults(true)}
joinable: PropTypes.bool,
manageable: PropTypes.bool,
onChange: PropTypes.func,
joinable: PropTypes.bool,
manageable: PropTypes.bool,
onChange: PropTypes.func,