Change sign-in banner to reflect disabled or moved account status (#19773)

This commit is contained in:
Claire 2022-11-05 18:28:13 +01:00 committed by GitHub
parent 0498b106c9
commit 312d616371
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 127 additions and 3 deletions

View file

@ -211,6 +211,11 @@ module ApplicationHelper
state_params[:admin] = Account.find_local(Setting.site_contact_username.strip.gsub(/\A@/, '')) state_params[:admin] = Account.find_local(Setting.site_contact_username.strip.gsub(/\A@/, ''))
end end
if user_signed_in? && !current_user.functional?
state_params[:disabled_account] = current_account
state_params[:moved_to_account] = current_account.moved_to_account
end
if single_user_mode? if single_user_mode?
state_params[:owner] = Account.local.without_suspended.where('id > 0').first state_params[:owner] = Account.local.without_suspended.where('id > 0').first
end end

View file

@ -28,6 +28,7 @@ store.dispatch(fetchCustomEmojis());
const createIdentityContext = state => ({ const createIdentityContext = state => ({
signedIn: !!state.meta.me, signedIn: !!state.meta.me,
accountId: state.meta.me, accountId: state.meta.me,
disabledAccountId: state.meta.disabled_account_id,
accessToken: state.meta.access_token, accessToken: state.meta.access_token,
permissions: state.role ? state.role.permissions : 0, permissions: state.role ? state.role.permissions : 0,
}); });
@ -42,6 +43,7 @@ export default class Mastodon extends React.PureComponent {
identity: PropTypes.shape({ identity: PropTypes.shape({
signedIn: PropTypes.bool.isRequired, signedIn: PropTypes.bool.isRequired,
accountId: PropTypes.string, accountId: PropTypes.string,
disabledAccountId: PropTypes.string,
accessToken: PropTypes.string, accessToken: PropTypes.string,
}).isRequired, }).isRequired,
}; };

View file

@ -0,0 +1,92 @@
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';
import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
import { disabledAccountId, movedToAccountId, domain } from 'mastodon/initial_state';
import { openModal } from 'mastodon/actions/modal';
import { logOut } from 'mastodon/utils/log_out';
const messages = defineMessages({
logoutMessage: { id: 'confirmations.logout.message', defaultMessage: 'Are you sure you want to log out?' },
logoutConfirm: { id: 'confirmations.logout.confirm', defaultMessage: 'Log out' },
});
const mapStateToProps = (state) => ({
disabledAcct: state.getIn(['accounts', disabledAccountId, 'acct']),
movedToAcct: movedToAccountId ? state.getIn(['accounts', movedToAccountId, 'acct']) : undefined,
});
const mapDispatchToProps = (dispatch, { intl }) => ({
onLogout () {
dispatch(openModal('CONFIRM', {
message: intl.formatMessage(messages.logoutMessage),
confirm: intl.formatMessage(messages.logoutConfirm),
closeWhenConfirm: false,
onConfirm: () => logOut(),
}));
},
});
export default @injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class DisabledAccountBanner extends React.PureComponent {
static propTypes = {
disabledAcct: PropTypes.string.isRequired,
movedToAcct: PropTypes.string,
onLogout: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
};
handleLogOutClick = e => {
e.preventDefault();
e.stopPropagation();
this.props.onLogout();
return false;
}
render () {
const { disabledAcct, movedToAcct } = this.props;
const disabledAccountLink = (
<Link to={`/@${disabledAcct}`}>
{disabledAcct}@{domain}
</Link>
);
return (
<div className='sign-in-banner'>
<p>
{movedToAcct ? (
<FormattedMessage
id='moved_to_account_banner.text'
defaultMessage='Your account {disabledAccount} is currently disabled because you moved to {movedToAccount}.'
values={{
disabledAccount: disabledAccountLink,
movedToAccount: <Link to={`/@${movedToAcct}`}>{movedToAcct.includes('@') ? movedToAcct : `${movedToAcct}@{domain}`}</Link>,
}}
/>
) : (
<FormattedMessage
id='disabled_account_banner.text'
defaultMessage='Your account {disabledAccount} is currently disabled.'
values={{
disabledAccount: disabledAccountLink,
}}
/>
)}
</p>
<a href='/auth/edit' className='button button--block'>
<FormattedMessage id='disabled_account_banner.account_settings' defaultMessage='Account settings' />
</a>
<button type='button' className='button button--block button-tertiary' onClick={this.handleLogOutClick}>
<FormattedMessage id='confirmations.logout.confirm' defaultMessage='Log out' />
</button>
</div>
);
}
};

View file

@ -5,6 +5,7 @@ import { Link } from 'react-router-dom';
import Logo from 'mastodon/components/logo'; import Logo from 'mastodon/components/logo';
import { timelinePreview, showTrends } from 'mastodon/initial_state'; import { timelinePreview, showTrends } from 'mastodon/initial_state';
import ColumnLink from './column_link'; import ColumnLink from './column_link';
import DisabledAccountBanner from './disabled_account_banner';
import FollowRequestsColumnLink from './follow_requests_column_link'; import FollowRequestsColumnLink from './follow_requests_column_link';
import ListPanel from './list_panel'; import ListPanel from './list_panel';
import NotificationsCounterIcon from './notifications_counter_icon'; import NotificationsCounterIcon from './notifications_counter_icon';
@ -41,7 +42,7 @@ class NavigationPanel extends React.Component {
render () { render () {
const { intl } = this.props; const { intl } = this.props;
const { signedIn } = this.context.identity; const { signedIn, disabledAccountId } = this.context.identity;
return ( return (
<div className='navigation-panel'> <div className='navigation-panel'>
@ -74,7 +75,7 @@ class NavigationPanel extends React.Component {
{!signedIn && ( {!signedIn && (
<div className='navigation-panel__sign-in-banner'> <div className='navigation-panel__sign-in-banner'>
<hr /> <hr />
<SignInBanner /> { disabledAccountId ? <DisabledAccountBanner /> : <SignInBanner /> }
</div> </div>
)} )}

View file

@ -54,6 +54,7 @@
* @property {boolean} crop_images * @property {boolean} crop_images
* @property {boolean=} delete_modal * @property {boolean=} delete_modal
* @property {boolean=} disable_swiping * @property {boolean=} disable_swiping
* @property {string=} disabled_account_id
* @property {boolean} display_media * @property {boolean} display_media
* @property {string} domain * @property {string} domain
* @property {boolean=} expand_spoilers * @property {boolean=} expand_spoilers
@ -61,6 +62,7 @@
* @property {string} locale * @property {string} locale
* @property {string | null} mascot * @property {string | null} mascot
* @property {string=} me * @property {string=} me
* @property {string=} moved_to_account_id
* @property {string=} owner * @property {string=} owner
* @property {boolean} profile_directory * @property {boolean} profile_directory
* @property {boolean} registrations_open * @property {boolean} registrations_open
@ -104,6 +106,7 @@ export const boostModal = getMeta('boost_modal');
export const cropImages = getMeta('crop_images'); export const cropImages = getMeta('crop_images');
export const deleteModal = getMeta('delete_modal'); export const deleteModal = getMeta('delete_modal');
export const disableSwiping = getMeta('disable_swiping'); export const disableSwiping = getMeta('disable_swiping');
export const disabledAccountId = getMeta('disabled_account_id');
export const displayMedia = getMeta('display_media'); export const displayMedia = getMeta('display_media');
export const domain = getMeta('domain'); export const domain = getMeta('domain');
export const expandSpoilers = getMeta('expand_spoilers'); export const expandSpoilers = getMeta('expand_spoilers');
@ -111,6 +114,7 @@ export const forceSingleColumn = !getMeta('advanced_layout');
export const limitedFederationMode = getMeta('limited_federation_mode'); export const limitedFederationMode = getMeta('limited_federation_mode');
export const mascot = getMeta('mascot'); export const mascot = getMeta('mascot');
export const me = getMeta('me'); export const me = getMeta('me');
export const movedToAccountId = getMeta('moved_to_account_id');
export const owner = getMeta('owner'); export const owner = getMeta('owner');
export const profile_directory = getMeta('profile_directory'); export const profile_directory = getMeta('profile_directory');
export const reduceMotion = getMeta('reduce_motion'); export const reduceMotion = getMeta('reduce_motion');

View file

@ -742,6 +742,20 @@
p { p {
color: $darker-text-color; color: $darker-text-color;
margin-bottom: 20px; margin-bottom: 20px;
a {
color: $secondary-text-color;
text-decoration: none;
unicode-bidi: isolate;
&:hover {
text-decoration: underline;
.fa {
color: lighten($dark-text-color, 7%);
}
}
}
} }
.button { .button {

View file

@ -2,7 +2,8 @@
class InitialStatePresenter < ActiveModelSerializers::Model class InitialStatePresenter < ActiveModelSerializers::Model
attributes :settings, :push_subscription, :token, attributes :settings, :push_subscription, :token,
:current_account, :admin, :owner, :text, :visibility :current_account, :admin, :owner, :text, :visibility,
:disabled_account, :moved_to_account
def role def role
current_account&.user_role current_account&.user_role

View file

@ -57,6 +57,9 @@ class InitialStateSerializer < ActiveModel::Serializer
store[:crop_images] = Setting.crop_images store[:crop_images] = Setting.crop_images
end end
store[:disabled_account_id] = object.disabled_account.id.to_s if object.disabled_account
store[:moved_to_account_id] = object.moved_to_account.id.to_s if object.moved_to_account
if Rails.configuration.x.single_user_mode if Rails.configuration.x.single_user_mode
store[:owner] = object.owner&.id&.to_s store[:owner] = object.owner&.id&.to_s
end end
@ -85,6 +88,8 @@ class InitialStateSerializer < ActiveModel::Serializer
store[object.current_account.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.current_account, serializer: REST::AccountSerializer) if object.current_account store[object.current_account.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.current_account, serializer: REST::AccountSerializer) if object.current_account
store[object.admin.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.admin, serializer: REST::AccountSerializer) if object.admin store[object.admin.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.admin, serializer: REST::AccountSerializer) if object.admin
store[object.owner.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.owner, serializer: REST::AccountSerializer) if object.owner store[object.owner.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.owner, serializer: REST::AccountSerializer) if object.owner
store[object.disabled_account.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.disabled_account, serializer: REST::AccountSerializer) if object.disabled_account
store[object.moved_to_account.id.to_s] = ActiveModelSerializers::SerializableResource.new(object.moved_to_account, serializer: REST::AccountSerializer) if object.moved_to_account
store store
end end