Add antenna excluding settings
This commit is contained in:
KMY
parent
aed51cc7e3
commit
25af09f60b
11 changed files with 627 additions and 74 deletions
|
|
@ -6,7 +6,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
|
|||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import { removeFromAntennaEditor, addToAntennaEditor } from '../../../actions/antennas';
|
||||
import { removeFromAntennaEditor, addToAntennaEditor, removeExcludeFromAntennaEditor, addExcludeToAntennaEditor } from '../../../actions/antennas';
|
||||
import { Avatar } from '../../../components/avatar';
|
||||
import { DisplayName } from '../../../components/display_name';
|
||||
import { IconButton } from '../../../components/icon_button';
|
||||
|
|
@ -20,9 +20,9 @@ const messages = defineMessages({
|
|||
const makeMapStateToProps = () => {
|
||||
const getAccount = makeGetAccount();
|
||||
|
||||
const mapStateToProps = (state, { accountId, added }) => ({
|
||||
const mapStateToProps = (state, { accountId, added, isExclude }) => ({
|
||||
account: getAccount(state, accountId),
|
||||
added: typeof added === 'undefined' ? state.getIn(['antennaEditor', 'accounts', 'items']).includes(accountId) : added,
|
||||
added: typeof added === 'undefined' ? state.getIn(['antennaEditor', isExclude ? 'excludeAccounts' : 'accounts', 'items']).includes(accountId) : added,
|
||||
});
|
||||
|
||||
return mapStateToProps;
|
||||
|
|
@ -31,15 +31,20 @@ const makeMapStateToProps = () => {
|
|||
const mapDispatchToProps = (dispatch, { accountId }) => ({
|
||||
onRemove: () => dispatch(removeFromAntennaEditor(accountId)),
|
||||
onAdd: () => dispatch(addToAntennaEditor(accountId)),
|
||||
onExcludeRemove: () => dispatch(removeExcludeFromAntennaEditor(accountId)),
|
||||
onExcludeAdd: () => dispatch(addExcludeToAntennaEditor(accountId)),
|
||||
});
|
||||
|
||||
class Account extends ImmutablePureComponent {
|
||||
|
||||
static propTypes = {
|
||||
account: ImmutablePropTypes.map.isRequired,
|
||||
isExclude: PropTypes.bool.isRequired,
|
||||
intl: PropTypes.object.isRequired,
|
||||
onRemove: PropTypes.func.isRequired,
|
||||
onAdd: PropTypes.func.isRequired,
|
||||
onExcludeRemove: PropTypes.func.isRequired,
|
||||
onExcludeAdd: PropTypes.func.isRequired,
|
||||
added: PropTypes.bool,
|
||||
};
|
||||
|
||||
|
|
@ -48,14 +53,15 @@ class Account extends ImmutablePureComponent {
|
|||
};
|
||||
|
||||
render () {
|
||||
const { account, intl, onRemove, onAdd, added } = this.props;
|
||||
const { account, intl, isExclude, onRemove, onAdd, onExcludeRemove, onExcludeAdd, added } = this.props;
|
||||
console.dir(isExclude)
|
||||
|
||||
let button;
|
||||
|
||||
if (added) {
|
||||
button = <IconButton icon='times' title={intl.formatMessage(messages.remove)} onClick={onRemove} />;
|
||||
button = <IconButton icon='times' title={intl.formatMessage(messages.remove)} onClick={isExclude ? onExcludeRemove : onRemove} />;
|
||||
} else {
|
||||
button = <IconButton icon='plus' title={intl.formatMessage(messages.add)} onClick={onAdd} />;
|
||||
button = <IconButton icon='plus' title={intl.formatMessage(messages.add)} onClick={isExclude ? onExcludeAdd : onAdd} />;
|
||||
}
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -8,20 +8,20 @@ import { connect } from 'react-redux';
|
|||
|
||||
import spring from 'react-motion/lib/spring';
|
||||
|
||||
import { setupAntennaEditor, clearAntennaSuggestions, resetAntennaEditor } from '../../actions/antennas';
|
||||
import { setupAntennaEditor, setupExcludeAntennaEditor, clearAntennaSuggestions, resetAntennaEditor } from '../../actions/antennas';
|
||||
import Motion from '../ui/util/optional_motion';
|
||||
|
||||
import Account from './components/account';
|
||||
import EditAntennaForm from './components/edit_antenna_form';
|
||||
import Search from './components/search';
|
||||
|
||||
const mapStateToProps = state => ({
|
||||
accountIds: state.getIn(['antennaEditor', 'accounts', 'items']),
|
||||
const mapStateToProps = (state, { isExclude }) => ({
|
||||
accountIds: state.getIn(['antennaEditor', isExclude ? 'excludeAccounts' : 'accounts', 'items']),
|
||||
searchAccountIds: state.getIn(['antennaEditor', 'suggestions', 'items']),
|
||||
});
|
||||
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
onInitialize: antennaId => dispatch(setupAntennaEditor(antennaId)),
|
||||
const mapDispatchToProps = (dispatch, { isExclude }) => ({
|
||||
onInitialize: antennaId => dispatch(isExclude ? setupExcludeAntennaEditor(antennaId) : setupAntennaEditor(antennaId)),
|
||||
onClear: () => dispatch(clearAntennaSuggestions()),
|
||||
onReset: () => dispatch(resetAntennaEditor()),
|
||||
});
|
||||
|
|
@ -30,6 +30,7 @@ class AntennaEditor extends ImmutablePureComponent {
|
|||
|
||||
static propTypes = {
|
||||
antennaId: PropTypes.string.isRequired,
|
||||
isExclude: PropTypes.bool.isRequired,
|
||||
onClose: PropTypes.func.isRequired,
|
||||
intl: PropTypes.object.isRequired,
|
||||
onInitialize: PropTypes.func.isRequired,
|
||||
|
|
@ -50,7 +51,7 @@ class AntennaEditor extends ImmutablePureComponent {
|
|||
}
|
||||
|
||||
render () {
|
||||
const { accountIds, searchAccountIds, onClear } = this.props;
|
||||
const { accountIds, searchAccountIds, onClear, isExclude } = this.props;
|
||||
const showSearch = searchAccountIds.size > 0;
|
||||
|
||||
return (
|
||||
|
|
@ -61,7 +62,7 @@ class AntennaEditor extends ImmutablePureComponent {
|
|||
|
||||
<div className='drawer__pager'>
|
||||
<div className='drawer__inner list-editor__accounts'>
|
||||
{accountIds.map(accountId => <Account key={accountId} accountId={accountId} added />)}
|
||||
{accountIds.map(accountId => <Account key={accountId} accountId={accountId} isExclude={isExclude} added />)}
|
||||
</div>
|
||||
|
||||
{showSearch && <div role='button' tabIndex={-1} className='drawer__backdrop' onClick={onClear} />}
|
||||
|
|
@ -69,7 +70,7 @@ class AntennaEditor extends ImmutablePureComponent {
|
|||
<Motion defaultStyle={{ x: -100 }} style={{ x: spring(showSearch ? 0 : -100, { stiffness: 210, damping: 20 }) }}>
|
||||
{({ x }) => (
|
||||
<div className='drawer__inner backdrop' style={{ transform: x === 0 ? null : `translateX(${x}%)`, visibility: x === -100 ? 'hidden' : 'visible' }}>
|
||||
{searchAccountIds.map(accountId => <Account key={accountId} accountId={accountId} />)}
|
||||
{searchAccountIds.map(accountId => <Account key={accountId} accountId={accountId} isExclude={isExclude} />)}
|
||||
</div>
|
||||
)}
|
||||
</Motion>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,21 @@ import { connect } from 'react-redux';
|
|||
import Select, { NonceProvider } from 'react-select';
|
||||
import Toggle from 'react-toggle';
|
||||
|
||||
import { fetchAntenna, deleteAntenna, updateAntenna, addDomainToAntenna, removeDomainFromAntenna, fetchAntennaDomains, fetchAntennaKeywords, removeKeywordFromAntenna, addKeywordToAntenna } from 'mastodon/actions/antennas';
|
||||
import {
|
||||
fetchAntenna,
|
||||
deleteAntenna,
|
||||
updateAntenna,
|
||||
addDomainToAntenna,
|
||||
removeDomainFromAntenna,
|
||||
addExcludeDomainToAntenna,
|
||||
removeExcludeDomainFromAntenna,
|
||||
fetchAntennaDomains,
|
||||
fetchAntennaKeywords,
|
||||
removeKeywordFromAntenna,
|
||||
addKeywordToAntenna,
|
||||
removeExcludeKeywordFromAntenna,
|
||||
addExcludeKeywordToAntenna
|
||||
} from 'mastodon/actions/antennas';
|
||||
import { addColumn, removeColumn, moveColumn } from 'mastodon/actions/columns';
|
||||
import { fetchLists } from 'mastodon/actions/lists';
|
||||
import { openModal } from 'mastodon/actions/modal';
|
||||
|
|
@ -69,7 +83,9 @@ class AntennaSetting extends PureComponent {
|
|||
|
||||
state = {
|
||||
domainName: '',
|
||||
excludeDomainName: '',
|
||||
keywordName: '',
|
||||
excludeKeywordName: '',
|
||||
rangeRadioValue: null,
|
||||
contentRadioValue: null,
|
||||
};
|
||||
|
|
@ -124,7 +140,14 @@ class AntennaSetting extends PureComponent {
|
|||
handleEditClick = () => {
|
||||
this.props.dispatch(openModal({
|
||||
modalType: 'ANTENNA_EDITOR',
|
||||
modalProps: { antennaId: this.props.params.id },
|
||||
modalProps: { antennaId: this.props.params.id, isExclude: false },
|
||||
}));
|
||||
};
|
||||
|
||||
handleExcludeEditClick = () => {
|
||||
this.props.dispatch(openModal({
|
||||
modalType: 'ANTENNA_EDITOR',
|
||||
modalProps: { antennaId: this.props.params.id, isExclude: true },
|
||||
}));
|
||||
};
|
||||
|
||||
|
|
@ -212,6 +235,24 @@ class AntennaSetting extends PureComponent {
|
|||
|
||||
onKeywordRemove = (value) => this.props.dispatch(removeKeywordFromAntenna(this.props.params.id, value));
|
||||
|
||||
onExcludeDomainNameChanged = (value) => this.setState({ excludeDomainName: value });
|
||||
|
||||
onExcludeDomainAdd = () => {
|
||||
this.props.dispatch(addExcludeDomainToAntenna(this.props.params.id, this.state.excludeDomainName));
|
||||
this.setState({ excludeDomainName: '' });
|
||||
};
|
||||
|
||||
onExcludeDomainRemove = (value) => this.props.dispatch(removeExcludeDomainFromAntenna(this.props.params.id, value));
|
||||
|
||||
onExcludeKeywordNameChanged = (value) => this.setState({ excludeKeywordName: value });
|
||||
|
||||
onExcludeKeywordAdd = () => {
|
||||
this.props.dispatch(addExcludeKeywordToAntenna(this.props.params.id, this.state.excludeKeywordName));
|
||||
this.setState({ excludeKeywordName: '' });
|
||||
};
|
||||
|
||||
onExcludeKeywordRemove = (value) => this.props.dispatch(removeExcludeKeywordFromAntenna(this.props.params.id, value));
|
||||
|
||||
render () {
|
||||
const { columnId, multiColumn, antenna, lists, domains, keywords, intl } = this.props;
|
||||
const { id } = this.props.params;
|
||||
|
|
@ -354,6 +395,7 @@ class AntennaSetting extends PureComponent {
|
|||
|
||||
{!isStl && (
|
||||
<>
|
||||
<h2><FormattedMessage id='antennas.filter' defaultMessage='Filter' /></h2>
|
||||
<RadioPanel values={rangeRadioValues} value={rangeRadioValue} onChange={this.onRangeRadioChanged} />
|
||||
|
||||
{rangeRadioValue.get('value') === 'accounts' && <Button text={intl.formatMessage(messages.editAccounts)} onClick={this.handleEditClick} />}
|
||||
|
|
@ -389,6 +431,32 @@ class AntennaSetting extends PureComponent {
|
|||
)}
|
||||
|
||||
{contentRadioAlert && <div className='alert'><FormattedMessage id='antennas.alert.content_radio' defaultMessage='Simultaneous keyword and tag designation is not recommended.' /></div>}
|
||||
|
||||
<h2><FormattedMessage id='antennas.filter_not' defaultMessage='Filter Not' /></h2>
|
||||
<h3><FormattedMessage id='antennas.exclude_accounts' defaultMessage='Exclude accounts' /></h3>
|
||||
<Button text={intl.formatMessage(messages.editAccounts)} onClick={this.handleExcludeEditClick} />
|
||||
<h3><FormattedMessage id='antennas.exclude_domains' defaultMessage='Exclude domains' /></h3>
|
||||
<TextList
|
||||
onChange={this.onExcludeDomainNameChanged}
|
||||
onAdd={this.onExcludeDomainAdd}
|
||||
onRemove={this.onExcludeDomainRemove}
|
||||
value={this.state.excludeDomainName}
|
||||
values={domains.get('exclude_domains') || ImmutableList()}
|
||||
icon='sitemap'
|
||||
label={intl.formatMessage(messages.addDomainLabel)}
|
||||
title={intl.formatMessage(messages.addDomainTitle)}
|
||||
/>
|
||||
<h3><FormattedMessage id='antennas.exclude_keywords' defaultMessage='Exclude keywords' /></h3>
|
||||
<TextList
|
||||
onChange={this.onExcludeKeywordNameChanged}
|
||||
onAdd={this.onExcludeKeywordAdd}
|
||||
onRemove={this.onExcludeKeywordRemove}
|
||||
value={this.state.excludeKeywordName}
|
||||
values={keywords.get('exclude_keywords') || ImmutableList()}
|
||||
icon='paragraph'
|
||||
label={intl.formatMessage(messages.addKeywordLabel)}
|
||||
title={intl.formatMessage(messages.addKeywordTitle)}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue