Removed unused hashtag timeilne column settings
non visible functionality to change visiblility of filtering hashtags on hashtag timeline
This commit is contained in:
parent
038e7db5b9
commit
6b5b0dc162
@ -1,113 +0,0 @@
|
|||||||
import React from 'react';
|
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
|
||||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
|
||||||
import Toggle from 'react-toggle';
|
|
||||||
import AsyncSelect from 'react-select/lib/Async';
|
|
||||||
|
|
||||||
const messages = defineMessages({
|
|
||||||
placeholder: { id: 'hashtag.column_settings.select.placeholder', defaultMessage: 'Enter hashtags…' },
|
|
||||||
noOptions: { id: 'hashtag.column_settings.select.no_options_message', defaultMessage: 'No suggestions found' },
|
|
||||||
});
|
|
||||||
|
|
||||||
export default @injectIntl
|
|
||||||
class ColumnSettings extends React.PureComponent {
|
|
||||||
|
|
||||||
static propTypes = {
|
|
||||||
settings: ImmutablePropTypes.map.isRequired,
|
|
||||||
onChange: PropTypes.func.isRequired,
|
|
||||||
onLoad: PropTypes.func.isRequired,
|
|
||||||
intl: PropTypes.object.isRequired,
|
|
||||||
};
|
|
||||||
|
|
||||||
state = {
|
|
||||||
open: this.hasTags(),
|
|
||||||
};
|
|
||||||
|
|
||||||
hasTags () {
|
|
||||||
return ['all', 'any', 'none'].map(mode => this.tags(mode).length > 0).includes(true);
|
|
||||||
}
|
|
||||||
|
|
||||||
tags (mode) {
|
|
||||||
let tags = this.props.settings.getIn(['tags', mode]) || [];
|
|
||||||
|
|
||||||
if (tags.toJSON) {
|
|
||||||
return tags.toJSON();
|
|
||||||
} else {
|
|
||||||
return tags;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
onSelect = mode => value => this.props.onChange(['tags', mode], value);
|
|
||||||
|
|
||||||
onToggle = () => {
|
|
||||||
if (this.state.open && this.hasTags()) {
|
|
||||||
this.props.onChange('tags', {});
|
|
||||||
}
|
|
||||||
|
|
||||||
this.setState({ open: !this.state.open });
|
|
||||||
};
|
|
||||||
|
|
||||||
noOptionsMessage = () => this.props.intl.formatMessage(messages.noOptions);
|
|
||||||
|
|
||||||
modeSelect (mode) {
|
|
||||||
return (
|
|
||||||
<div className='column-settings__row'>
|
|
||||||
<span className='column-settings__section'>
|
|
||||||
{this.modeLabel(mode)}
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<AsyncSelect
|
|
||||||
isMulti
|
|
||||||
autoFocus
|
|
||||||
value={this.tags(mode)}
|
|
||||||
onChange={this.onSelect(mode)}
|
|
||||||
loadOptions={this.props.onLoad}
|
|
||||||
className='column-select__container'
|
|
||||||
classNamePrefix='column-select'
|
|
||||||
name='tags'
|
|
||||||
placeholder={this.props.intl.formatMessage(messages.placeholder)}
|
|
||||||
noOptionsMessage={this.noOptionsMessage}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
modeLabel (mode) {
|
|
||||||
switch(mode) {
|
|
||||||
case 'any':
|
|
||||||
return <FormattedMessage id='hashtag.column_settings.tag_mode.any' defaultMessage='Any of these' />;
|
|
||||||
case 'all':
|
|
||||||
return <FormattedMessage id='hashtag.column_settings.tag_mode.all' defaultMessage='All of these' />;
|
|
||||||
case 'none':
|
|
||||||
return <FormattedMessage id='hashtag.column_settings.tag_mode.none' defaultMessage='None of these' />;
|
|
||||||
default:
|
|
||||||
return '';
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
render () {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div className='column-settings__row'>
|
|
||||||
<div className='setting-toggle'>
|
|
||||||
<Toggle id='hashtag.column_settings.tag_toggle' onChange={this.onToggle} checked={this.state.open} />
|
|
||||||
|
|
||||||
<span className='setting-toggle__label'>
|
|
||||||
<FormattedMessage id='hashtag.column_settings.tag_toggle' defaultMessage='Include additional tags in this column' />
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{this.state.open && (
|
|
||||||
<div className='column-settings__hashtags'>
|
|
||||||
{this.modeSelect('any')}
|
|
||||||
{this.modeSelect('all')}
|
|
||||||
{this.modeSelect('none')}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
@ -1,31 +0,0 @@
|
|||||||
import { connect } from 'react-redux';
|
|
||||||
import ColumnSettings from '../components/column_settings';
|
|
||||||
import { changeColumnParams } from '../../../actions/columns';
|
|
||||||
import api from '../../../api';
|
|
||||||
|
|
||||||
const mapStateToProps = (state, { columnId }) => {
|
|
||||||
const columns = state.getIn(['settings', 'columns']);
|
|
||||||
const index = columns.findIndex(c => c.get('uuid') === columnId);
|
|
||||||
|
|
||||||
if (!(columnId && index >= 0)) {
|
|
||||||
return {};
|
|
||||||
}
|
|
||||||
|
|
||||||
return { settings: columns.get(index).get('params') };
|
|
||||||
};
|
|
||||||
|
|
||||||
const mapDispatchToProps = (dispatch, { columnId }) => ({
|
|
||||||
onChange (key, value) {
|
|
||||||
dispatch(changeColumnParams(columnId, key, value));
|
|
||||||
},
|
|
||||||
|
|
||||||
onLoad (value) {
|
|
||||||
return api().get('/api/v2/search', { params: { q: value } }).then(response => {
|
|
||||||
return (response.data.hashtags || []).map((tag) => {
|
|
||||||
return { value: tag.name, label: `#${tag.name}` };
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
export default connect(mapStateToProps, mapDispatchToProps)(ColumnSettings);
|
|
@ -4,7 +4,6 @@ import PropTypes from 'prop-types';
|
|||||||
import StatusListContainer from '../ui/containers/status_list_container';
|
import StatusListContainer from '../ui/containers/status_list_container';
|
||||||
import Column from '../../components/column';
|
import Column from '../../components/column';
|
||||||
import ColumnHeader from '../../components/column_header';
|
import ColumnHeader from '../../components/column_header';
|
||||||
import ColumnSettingsContainer from './containers/column_settings_container';
|
|
||||||
import { expandHashtagTimeline, clearTimeline } from '../../actions/timelines';
|
import { expandHashtagTimeline, clearTimeline } from '../../actions/timelines';
|
||||||
import { FormattedMessage } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
import { connectHashtagStream } from '../../actions/streaming';
|
import { connectHashtagStream } from '../../actions/streaming';
|
||||||
|
Loading…
x
Reference in New Issue
Block a user