[Glitch] Add explanation as to why unlocked accounts may have follow requests

Port ffd6f3fa8a to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
This commit is contained in:
ThibG 2020-04-04 19:02:10 +02:00 committed by Thibaut Girka
parent 04839f5dda
commit 08e4bed98c
2 changed files with 23 additions and 2 deletions

View file

@ -11,6 +11,7 @@ import { fetchFollowRequests, expandFollowRequests } from 'flavours/glitch/actio
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component'; import ImmutablePureComponent from 'react-immutable-pure-component';
import ScrollableList from 'flavours/glitch/components/scrollable_list'; import ScrollableList from 'flavours/glitch/components/scrollable_list';
import { me } from 'flavours/glitch/util/initial_state';
const messages = defineMessages({ const messages = defineMessages({
heading: { id: 'column.follow_requests', defaultMessage: 'Follow requests' }, heading: { id: 'column.follow_requests', defaultMessage: 'Follow requests' },
@ -19,6 +20,8 @@ const messages = defineMessages({
const mapStateToProps = state => ({ const mapStateToProps = state => ({
accountIds: state.getIn(['user_lists', 'follow_requests', 'items']), accountIds: state.getIn(['user_lists', 'follow_requests', 'items']),
hasMore: !!state.getIn(['user_lists', 'follow_requests', 'next']), hasMore: !!state.getIn(['user_lists', 'follow_requests', 'next']),
locked: !!state.getIn(['accounts', me, 'locked']),
domain: state.getIn(['meta', 'domain']),
}); });
export default @connect(mapStateToProps) export default @connect(mapStateToProps)
@ -30,6 +33,8 @@ class FollowRequests extends ImmutablePureComponent {
dispatch: PropTypes.func.isRequired, dispatch: PropTypes.func.isRequired,
hasMore: PropTypes.bool, hasMore: PropTypes.bool,
accountIds: ImmutablePropTypes.list, accountIds: ImmutablePropTypes.list,
locked: PropTypes.bool,
domain: PropTypes.string,
intl: PropTypes.object.isRequired, intl: PropTypes.object.isRequired,
multiColumn: PropTypes.bool, multiColumn: PropTypes.bool,
}; };
@ -43,7 +48,7 @@ class FollowRequests extends ImmutablePureComponent {
}, 300, { leading: true }); }, 300, { leading: true });
render () { render () {
const { intl, accountIds, hasMore, multiColumn } = this.props; const { intl, accountIds, hasMore, multiColumn, locked, domain } = this.props;
if (!accountIds) { if (!accountIds) {
return ( return (
@ -54,6 +59,15 @@ class FollowRequests extends ImmutablePureComponent {
} }
const emptyMessage = <FormattedMessage id='empty_column.follow_requests' defaultMessage="You don't have any follow requests yet. When you receive one, it will show up here." />; const emptyMessage = <FormattedMessage id='empty_column.follow_requests' defaultMessage="You don't have any follow requests yet. When you receive one, it will show up here." />;
const unlockedPrependMessage = locked ? null : (
<div className='follow_requests-unlocked_explanation'>
<FormattedMessage
id='follow_requests.unlocked_explanation'
defaultMessage='Even though your account is not locked, the {domain} staff thought you might want to review follow requests from these accounts manually.'
values={{ domain: domain }}
/>
</div>
);
return ( return (
<Column bindToDocument={!multiColumn} name='follow-requests' icon='user-plus' heading={intl.formatMessage(messages.heading)}> <Column bindToDocument={!multiColumn} name='follow-requests' icon='user-plus' heading={intl.formatMessage(messages.heading)}>
@ -65,6 +79,7 @@ class FollowRequests extends ImmutablePureComponent {
hasMore={hasMore} hasMore={hasMore}
emptyMessage={emptyMessage} emptyMessage={emptyMessage}
bindToDocument={!multiColumn} bindToDocument={!multiColumn}
prepend={unlockedPrependMessage}
> >
{accountIds.map(id => {accountIds.map(id =>
<AccountAuthorizeContainer key={id} id={id} />, <AccountAuthorizeContainer key={id} id={id} />,

View file

@ -452,7 +452,8 @@
} }
.empty-column-indicator, .empty-column-indicator,
.error-column { .error-column,
.follow_requests-unlocked_explanation {
color: $dark-text-color; color: $dark-text-color;
background: $ui-base-color; background: $ui-base-color;
text-align: center; text-align: center;
@ -482,6 +483,11 @@
} }
} }
.follow_requests-unlocked_explanation {
background: darken($ui-base-color, 4%);
contain: initial;
}
.error-column { .error-column {
flex-direction: column; flex-direction: column;
} }