diff options
author | Claire <claire.github-309c@sitedethib.com> | 2022-08-25 14:12:44 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-08-25 14:12:44 +0200 |
commit | acc580fb7d40641e0bb5ba7a3145503bcb8397c3 (patch) | |
tree | 6a2c8ec020a41b4ec011ebff5d8b24afb44d80b0 /app/javascript/flavours/glitch/components | |
parent | 4be626734dfe5d5bb550b117d966aa3f93d0ef38 (diff) | |
parent | 2b03e21d36715705f41669580be8b810ecad644a (diff) |
Merge pull request #1829 from ClearlyClaire/glitch-soc/merge-upstream
Port UI filter changes from upstream
Diffstat (limited to 'app/javascript/flavours/glitch/components')
-rw-r--r-- | app/javascript/flavours/glitch/components/status.js | 25 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/components/status_action_bar.js | 23 |
2 files changed, 30 insertions, 18 deletions
diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js index b2d9acebc..e238456c5 100644 --- a/app/javascript/flavours/glitch/components/status.js +++ b/app/javascript/flavours/glitch/components/status.js @@ -79,6 +79,7 @@ class Status extends ImmutablePureComponent { onOpenMedia: PropTypes.func, onOpenVideo: PropTypes.func, onBlock: PropTypes.func, + onAddFilter: PropTypes.func, onEmbed: PropTypes.func, onHeightChange: PropTypes.func, onToggleHidden: PropTypes.func, @@ -455,8 +456,8 @@ class Status extends ImmutablePureComponent { } handleUnfilterClick = e => { - const { onUnfilter, status } = this.props; - onUnfilter(status.get('reblog') ? status.get('reblog') : status, () => this.setState({ forceFilter: false })); + this.setState({ forceFilter: false }); + e.preventDefault(); } handleFilterClick = () => { @@ -557,8 +558,8 @@ class Status extends ImmutablePureComponent { ); } - const filtered = (status.get('filtered') || status.getIn(['reblog', 'filtered'])) && settings.get('filtering_behavior') !== 'content_warning'; - if (forceFilter === undefined ? filtered : forceFilter) { + const matchedFilters = status.get('matched_filters'); + if (this.state.forceFilter === undefined ? matchedFilters : this.state.forceFilter) { const minHandlers = this.props.muted ? {} : { moveUp: this.handleHotkeyMoveUp, moveDown: this.handleHotkeyMoveDown, @@ -567,13 +568,11 @@ class Status extends ImmutablePureComponent { return ( <HotKeys handlers={minHandlers}> <div className='status__wrapper status__wrapper--filtered focusable' tabIndex='0' ref={this.handleRef}> - <FormattedMessage id='status.filtered' defaultMessage='Filtered' /> - {settings.get('filtering_behavior') !== 'upstream' && ' '} - {settings.get('filtering_behavior') !== 'upstream' && ( - <button className='status__wrapper--filtered__button' onClick={this.handleUnfilterClick}> - <FormattedMessage id='status.show_filter_reason' defaultMessage='(show why)' /> - </button> - )} + <FormattedMessage id='status.filtered' defaultMessage='Filtered' />: {matchedFilters.join(', ')}. + {' '} + <button className='status__wrapper--filtered__button' onClick={this.handleUnfilterClick}> + <FormattedMessage id='status.show_filter_reason' defaultMessage='Show anyway' /> + </button> </div> </HotKeys> ); @@ -789,11 +788,11 @@ class Status extends ImmutablePureComponent { {!isCollapsed || !(muted || !settings.getIn(['collapsed', 'show_action_bar'])) ? ( <StatusActionBar - {...other} status={status} account={status.get('account')} showReplyCount={settings.get('show_reply_count')} - onFilter={this.handleFilterClick} + onFilter={matchedFilters ? this.handleFilterClick : null} + {...other} /> ) : null} {notification ? ( diff --git a/app/javascript/flavours/glitch/components/status_action_bar.js b/app/javascript/flavours/glitch/components/status_action_bar.js index 667afac5a..c0cd496ce 100644 --- a/app/javascript/flavours/glitch/components/status_action_bar.js +++ b/app/javascript/flavours/glitch/components/status_action_bar.js @@ -41,6 +41,7 @@ const messages = defineMessages({ copy: { id: 'status.copy', defaultMessage: 'Copy link to status' }, hide: { id: 'status.hide', defaultMessage: 'Hide toot' }, edited: { id: 'status.edited', defaultMessage: 'Edited {date}' }, + filter: { id: 'status.filter', defaultMessage: 'Filter this post' }, }); export default @injectIntl @@ -67,6 +68,7 @@ class StatusActionBar extends ImmutablePureComponent { onPin: PropTypes.func, onBookmark: PropTypes.func, onFilter: PropTypes.func, + onAddFilter: PropTypes.func, withDismiss: PropTypes.bool, showReplyCount: PropTypes.bool, scrollKey: PropTypes.string, @@ -193,10 +195,14 @@ class StatusActionBar extends ImmutablePureComponent { } } - handleFilterClick = () => { + handleHideClick = () => { this.props.onFilter(); } + handleFilterClick = () => { + this.props.onAddFilter(this.props.status); + } + render () { const { status, intl, withDismiss, showReplyCount, scrollKey } = this.props; @@ -238,6 +244,12 @@ class StatusActionBar extends ImmutablePureComponent { menu.push({ text: intl.formatMessage(messages.mention, { name: status.getIn(['account', 'username']) }), action: this.handleMentionClick }); menu.push({ text: intl.formatMessage(messages.direct, { name: status.getIn(['account', 'username']) }), action: this.handleDirectClick }); menu.push(null); + + if (!this.props.onFilter) { + menu.push({ text: intl.formatMessage(messages.filter), action: this.handleFilterClick }); + menu.push(null); + } + menu.push({ text: intl.formatMessage(messages.mute, { name: status.getIn(['account', 'username']) }), action: this.handleMuteClick }); menu.push({ text: intl.formatMessage(messages.block, { name: status.getIn(['account', 'username']) }), action: this.handleBlockClick }); menu.push({ text: intl.formatMessage(messages.report, { name: status.getIn(['account', 'username']) }), action: this.handleReport }); @@ -271,10 +283,6 @@ class StatusActionBar extends ImmutablePureComponent { <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.share)} icon='share-alt' onClick={this.handleShareClick} /> ); - const filterButton = status.get('filtered') && ( - <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.hide)} icon='eye' onClick={this.handleFilterClick} /> - ); - let replyButton = ( <IconButton className='status__action-bar-button' @@ -309,6 +317,10 @@ class StatusActionBar extends ImmutablePureComponent { reblogTitle = intl.formatMessage(messages.cannot_reblog); } + const filterButton = this.props.onFilter && ( + <IconButton className='status__action-bar-button' title={intl.formatMessage(messages.hide)} icon='eye' onClick={this.handleHideClick} /> + ); + return ( <div className='status__action-bar'> {replyButton} @@ -316,6 +328,7 @@ class StatusActionBar extends ImmutablePureComponent { <IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} pressed={status.get('favourited')} title={intl.formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} /> {shareButton} <IconButton className='status__action-bar-button bookmark-icon' disabled={anonymousAccess} active={status.get('bookmarked')} pressed={status.get('bookmarked')} title={intl.formatMessage(messages.bookmark)} icon='bookmark' onClick={this.handleBookmarkClick} /> + {filterButton} <div className='status__action-bar-dropdown'> |