Skip to content

Commit bd02ec6

Browse files
authored
Add indication that you have been blocked in web UI (mastodon#10420)
1 parent 1d62b88 commit bd02ec6

5 files changed

Lines changed: 34 additions & 20 deletions

File tree

app/javascript/mastodon/features/account/components/header.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -94,15 +94,15 @@ class Header extends ImmutablePureComponent {
9494
let menu = [];
9595

9696
if (me !== account.get('id') && account.getIn(['relationship', 'followed_by'])) {
97-
info.push(<span className='relationship-tag'><FormattedMessage id='account.follows_you' defaultMessage='Follows you' /></span>);
97+
info.push(<span key='followed_by' className='relationship-tag'><FormattedMessage id='account.follows_you' defaultMessage='Follows you' /></span>);
9898
} else if (me !== account.get('id') && account.getIn(['relationship', 'blocking'])) {
99-
info.push(<span className='relationship-tag'><FormattedMessage id='account.blocked' defaultMessage='Blocked' /></span>);
99+
info.push(<span key='blocked' className='relationship-tag'><FormattedMessage id='account.blocked' defaultMessage='Blocked' /></span>);
100100
}
101101

102102
if (me !== account.get('id') && account.getIn(['relationship', 'muting'])) {
103-
info.push(<span className='relationship-tag'><FormattedMessage id='account.muted' defaultMessage='Muted' /></span>);
103+
info.push(<span key='muted' className='relationship-tag'><FormattedMessage id='account.muted' defaultMessage='Muted' /></span>);
104104
} else if (me !== account.get('id') && account.getIn(['relationship', 'domain_blocking'])) {
105-
info.push(<span className='relationship-tag'><FormattedMessage id='account.domain_blocked' defaultMessage='Domain hidden' /></span>);
105+
info.push(<span key='domain_blocked' className='relationship-tag'><FormattedMessage id='account.domain_blocked' defaultMessage='Domain hidden' /></span>);
106106
}
107107

108108
if (me !== account.get('id')) {
@@ -111,7 +111,7 @@ class Header extends ImmutablePureComponent {
111111
} else if (account.getIn(['relationship', 'requested'])) {
112112
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.requested)} onClick={this.props.onFollow} />;
113113
} else if (!account.getIn(['relationship', 'blocking'])) {
114-
actionBtn = <Button className={classNames('logo-button', { 'button--destructive': account.getIn(['relationship', 'following']) })} text={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={this.props.onFollow} />;
114+
actionBtn = <Button disabled={account.getIn(['relationship', 'blocked_by'])} className={classNames('logo-button', { 'button--destructive': account.getIn(['relationship', 'following']) })} text={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={this.props.onFollow} />;
115115
} else if (account.getIn(['relationship', 'blocking'])) {
116116
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.unblock, { name: account.get('username') })} onClick={this.props.onBlock} />;
117117
}

app/javascript/mastodon/features/account_timeline/index.js

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,14 +14,17 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
1414
import { FormattedMessage } from 'react-intl';
1515
import { fetchAccountIdentityProofs } from '../../actions/identity_proofs';
1616

17+
const emptyList = ImmutableList();
18+
1719
const mapStateToProps = (state, { params: { accountId }, withReplies = false }) => {
1820
const path = withReplies ? `${accountId}:with_replies` : accountId;
1921

2022
return {
21-
statusIds: state.getIn(['timelines', `account:${path}`, 'items'], ImmutableList()),
22-
featuredStatusIds: withReplies ? ImmutableList() : state.getIn(['timelines', `account:${accountId}:pinned`, 'items'], ImmutableList()),
23+
statusIds: state.getIn(['timelines', `account:${path}`, 'items'], emptyList),
24+
featuredStatusIds: withReplies ? ImmutableList() : state.getIn(['timelines', `account:${accountId}:pinned`, 'items'], emptyList),
2325
isLoading: state.getIn(['timelines', `account:${path}`, 'isLoading']),
24-
hasMore: state.getIn(['timelines', `account:${path}`, 'hasMore']),
26+
hasMore: state.getIn(['timelines', `account:${path}`, 'hasMore']),
27+
blockedBy: state.getIn(['relationships', accountId, 'blocked_by'], false),
2528
};
2629
};
2730

@@ -37,26 +40,31 @@ class AccountTimeline extends ImmutablePureComponent {
3740
isLoading: PropTypes.bool,
3841
hasMore: PropTypes.bool,
3942
withReplies: PropTypes.bool,
43+
blockedBy: PropTypes.bool,
4044
};
4145

4246
componentWillMount () {
4347
const { params: { accountId }, withReplies } = this.props;
4448

4549
this.props.dispatch(fetchAccount(accountId));
4650
this.props.dispatch(fetchAccountIdentityProofs(accountId));
51+
4752
if (!withReplies) {
4853
this.props.dispatch(expandAccountFeaturedTimeline(accountId));
4954
}
55+
5056
this.props.dispatch(expandAccountTimeline(accountId, { withReplies }));
5157
}
5258

5359
componentWillReceiveProps (nextProps) {
5460
if ((nextProps.params.accountId !== this.props.params.accountId && nextProps.params.accountId) || nextProps.withReplies !== this.props.withReplies) {
5561
this.props.dispatch(fetchAccount(nextProps.params.accountId));
5662
this.props.dispatch(fetchAccountIdentityProofs(nextProps.params.accountId));
63+
5764
if (!nextProps.withReplies) {
5865
this.props.dispatch(expandAccountFeaturedTimeline(nextProps.params.accountId));
5966
}
67+
6068
this.props.dispatch(expandAccountTimeline(nextProps.params.accountId, { withReplies: nextProps.params.withReplies }));
6169
}
6270
}
@@ -66,7 +74,7 @@ class AccountTimeline extends ImmutablePureComponent {
6674
}
6775

6876
render () {
69-
const { shouldUpdateScroll, statusIds, featuredStatusIds, isLoading, hasMore } = this.props;
77+
const { shouldUpdateScroll, statusIds, featuredStatusIds, isLoading, hasMore, blockedBy } = this.props;
7078

7179
if (!statusIds && isLoading) {
7280
return (
@@ -76,6 +84,8 @@ class AccountTimeline extends ImmutablePureComponent {
7684
);
7785
}
7886

87+
const emptyMessage = blockedBy ? <FormattedMessage id='empty_column.account_timeline_blocked' defaultMessage='You are blocked' /> : <FormattedMessage id='empty_column.account_timeline' defaultMessage='No toots here!' />;
88+
7989
return (
8090
<Column>
8191
<ColumnBackButton />
@@ -84,13 +94,13 @@ class AccountTimeline extends ImmutablePureComponent {
8494
prepend={<HeaderContainer accountId={this.props.params.accountId} />}
8595
alwaysPrepend
8696
scrollKey='account_timeline'
87-
statusIds={statusIds}
97+
statusIds={blockedBy ? emptyList : statusIds}
8898
featuredStatusIds={featuredStatusIds}
8999
isLoading={isLoading}
90100
hasMore={hasMore}
91101
onLoadMore={this.handleLoadMore}
92102
shouldUpdateScroll={shouldUpdateScroll}
93-
emptyMessage={<FormattedMessage id='empty_column.account_timeline' defaultMessage='No toots here!' />}
103+
emptyMessage={emptyMessage}
94104
/>
95105
</Column>
96106
);

app/javascript/mastodon/features/followers/index.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import ScrollableList from '../../components/scrollable_list';
2020
const mapStateToProps = (state, props) => ({
2121
accountIds: state.getIn(['user_lists', 'followers', props.params.accountId, 'items']),
2222
hasMore: !!state.getIn(['user_lists', 'followers', props.params.accountId, 'next']),
23+
blockedBy: state.getIn(['relationships', props.params.accountId, 'blocked_by'], false),
2324
});
2425

2526
export default @connect(mapStateToProps)
@@ -31,6 +32,7 @@ class Followers extends ImmutablePureComponent {
3132
shouldUpdateScroll: PropTypes.func,
3233
accountIds: ImmutablePropTypes.list,
3334
hasMore: PropTypes.bool,
35+
blockedBy: PropTypes.bool,
3436
};
3537

3638
componentWillMount () {
@@ -50,7 +52,7 @@ class Followers extends ImmutablePureComponent {
5052
}, 300, { leading: true });
5153

5254
render () {
53-
const { shouldUpdateScroll, accountIds, hasMore } = this.props;
55+
const { shouldUpdateScroll, accountIds, hasMore, blockedBy } = this.props;
5456

5557
if (!accountIds) {
5658
return (
@@ -60,7 +62,7 @@ class Followers extends ImmutablePureComponent {
6062
);
6163
}
6264

63-
const emptyMessage = <FormattedMessage id='account.followers.empty' defaultMessage='No one follows this user yet.' />;
65+
const emptyMessage = blockedBy ? <FormattedMessage id='empty_column.account_timeline_blocked' defaultMessage='You are blocked' /> : <FormattedMessage id='account.followers.empty' defaultMessage='No one follows this user yet.' />;
6466

6567
return (
6668
<Column>
@@ -75,7 +77,7 @@ class Followers extends ImmutablePureComponent {
7577
alwaysPrepend
7678
emptyMessage={emptyMessage}
7779
>
78-
{accountIds.map(id =>
80+
{blockedBy ? [] : accountIds.map(id =>
7981
<AccountContainer key={id} id={id} withNote={false} />
8082
)}
8183
</ScrollableList>

app/javascript/mastodon/features/following/index.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import ScrollableList from '../../components/scrollable_list';
2020
const mapStateToProps = (state, props) => ({
2121
accountIds: state.getIn(['user_lists', 'following', props.params.accountId, 'items']),
2222
hasMore: !!state.getIn(['user_lists', 'following', props.params.accountId, 'next']),
23+
blockedBy: state.getIn(['relationships', props.params.accountId, 'blocked_by'], false),
2324
});
2425

2526
export default @connect(mapStateToProps)
@@ -31,6 +32,7 @@ class Following extends ImmutablePureComponent {
3132
shouldUpdateScroll: PropTypes.func,
3233
accountIds: ImmutablePropTypes.list,
3334
hasMore: PropTypes.bool,
35+
blockedBy: PropTypes.bool,
3436
};
3537

3638
componentWillMount () {
@@ -50,7 +52,7 @@ class Following extends ImmutablePureComponent {
5052
}, 300, { leading: true });
5153

5254
render () {
53-
const { shouldUpdateScroll, accountIds, hasMore } = this.props;
55+
const { shouldUpdateScroll, accountIds, hasMore, blockedBy } = this.props;
5456

5557
if (!accountIds) {
5658
return (
@@ -60,7 +62,7 @@ class Following extends ImmutablePureComponent {
6062
);
6163
}
6264

63-
const emptyMessage = <FormattedMessage id='account.follows.empty' defaultMessage="This user doesn't follow anyone yet." />;
65+
const emptyMessage = blockedBy ? <FormattedMessage id='empty_column.account_timeline_blocked' defaultMessage='You are blocked' /> : <FormattedMessage id='account.follows.empty' defaultMessage="This user doesn't follow anyone yet." />;
6466

6567
return (
6668
<Column>
@@ -75,7 +77,7 @@ class Following extends ImmutablePureComponent {
7577
alwaysPrepend
7678
emptyMessage={emptyMessage}
7779
>
78-
{accountIds.map(id =>
80+
{blockedBy ? [] : accountIds.map(id =>
7981
<AccountContainer key={id} id={id} withNote={false} />
8082
)}
8183
</ScrollableList>

app/javascript/styles/mastodon/stream_entries.scss

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -99,9 +99,9 @@
9999
}
100100
}
101101

102-
&:active,
103-
&:focus,
104-
&:hover {
102+
&:active:not(:disabled),
103+
&:focus:not(:disabled),
104+
&:hover:not(:disabled) {
105105
background: lighten($ui-highlight-color, 10%);
106106

107107
svg path:last-child {

0 commit comments

Comments
 (0)