remove info from deactivated account pages
This commit is contained in:
Mary Kate
parent
34bf11f512
commit
9b85b4ad7f
|
|
@ -221,12 +221,12 @@ class Header extends ImmutablePureComponent {
|
|||
const menu = this.makeMenu();
|
||||
|
||||
const headerMissing = (account.get('header').indexOf('/headers/original/missing.png') > -1);
|
||||
|
||||
const avatarSize = isSmallScreen ? 90 : 200;
|
||||
const deactivated = account.getIn(['pleroma', 'deactivated'], false);
|
||||
|
||||
return (
|
||||
<div className={classNames('account__header', { inactive: !!account.get('moved') })}>
|
||||
<div className={classNames('account__header__image', { 'account__header__image--none': headerMissing })}>
|
||||
<div className={classNames('account__header__image', { 'account__header__image--none': headerMissing || deactivated })}>
|
||||
<div className='account__header__info'>
|
||||
{info}
|
||||
</div>
|
||||
|
|
@ -238,56 +238,58 @@ class Header extends ImmutablePureComponent {
|
|||
<div className='account__header__extra'>
|
||||
|
||||
<div className='account__header__avatar'>
|
||||
<Avatar account={account} size={avatarSize} />
|
||||
{ !deactivated && <Avatar account={account} size={avatarSize} /> }
|
||||
</div>
|
||||
|
||||
<div className='account__header__extra__links'>
|
||||
{ !deactivated &&
|
||||
<div className='account__header__extra__links'>
|
||||
|
||||
<NavLink isActive={this.isStatusesPageActive} activeClassName='active' to={`/@${account.get('acct')}`} title={intl.formatNumber(account.get('statuses_count'))}>
|
||||
<span>{shortNumberFormat(account.get('statuses_count'))}</span>
|
||||
<span><FormattedMessage id='account.posts' defaultMessage='Posts' /></span>
|
||||
</NavLink>
|
||||
<NavLink isActive={this.isStatusesPageActive} activeClassName='active' to={`/@${account.get('acct')}`} title={intl.formatNumber(account.get('statuses_count'))}>
|
||||
<span>{shortNumberFormat(account.get('statuses_count'))}</span>
|
||||
<span><FormattedMessage id='account.posts' defaultMessage='Posts' /></span>
|
||||
</NavLink>
|
||||
|
||||
<NavLink exact activeClassName='active' to={`/@${account.get('acct')}/following`} title={intl.formatNumber(account.get('following_count'))}>
|
||||
<span>{shortNumberFormat(account.get('following_count'))}</span>
|
||||
<span><FormattedMessage id='account.follows' defaultMessage='Follows' /></span>
|
||||
</NavLink>
|
||||
<NavLink exact activeClassName='active' to={`/@${account.get('acct')}/following`} title={intl.formatNumber(account.get('following_count'))}>
|
||||
<span>{shortNumberFormat(account.get('following_count'))}</span>
|
||||
<span><FormattedMessage id='account.follows' defaultMessage='Follows' /></span>
|
||||
</NavLink>
|
||||
|
||||
<NavLink exact activeClassName='active' to={`/@${account.get('acct')}/followers`} title={intl.formatNumber(account.get('followers_count'))}>
|
||||
<span>{shortNumberFormat(account.get('followers_count'))}</span>
|
||||
<span><FormattedMessage id='account.followers' defaultMessage='Followers' /></span>
|
||||
</NavLink>
|
||||
<NavLink exact activeClassName='active' to={`/@${account.get('acct')}/followers`} title={intl.formatNumber(account.get('followers_count'))}>
|
||||
<span>{shortNumberFormat(account.get('followers_count'))}</span>
|
||||
<span><FormattedMessage id='account.followers' defaultMessage='Followers' /></span>
|
||||
</NavLink>
|
||||
|
||||
{
|
||||
account.get('id') === me &&
|
||||
<div>
|
||||
<NavLink
|
||||
exact activeClassName='active' to={`/@${account.get('acct')}/favorites`}
|
||||
>
|
||||
{ /* : TODO : shortNumberFormat(account.get('favourite_count')) */ }
|
||||
<span>•</span>
|
||||
<span><FormattedMessage id='navigation_bar.favourites' defaultMessage='Likes' /></span>
|
||||
</NavLink>
|
||||
<NavLink
|
||||
exact activeClassName='active' to={`/@${account.get('acct')}/pins`}
|
||||
>
|
||||
{ /* : TODO : shortNumberFormat(account.get('pinned_count')) */ }
|
||||
<span>•</span>
|
||||
<span><FormattedMessage id='navigation_bar.pins' defaultMessage='Pins' /></span>
|
||||
</NavLink>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
{
|
||||
account.get('id') === me &&
|
||||
<div>
|
||||
<NavLink
|
||||
exact activeClassName='active' to={`/@${account.get('acct')}/favorites`}
|
||||
>
|
||||
{ /* : TODO : shortNumberFormat(account.get('favourite_count')) */ }
|
||||
<span>•</span>
|
||||
<span><FormattedMessage id='navigation_bar.favourites' defaultMessage='Likes' /></span>
|
||||
</NavLink>
|
||||
<NavLink
|
||||
exact activeClassName='active' to={`/@${account.get('acct')}/pins`}
|
||||
>
|
||||
{ /* : TODO : shortNumberFormat(account.get('pinned_count')) */ }
|
||||
<span>•</span>
|
||||
<span><FormattedMessage id='navigation_bar.pins' defaultMessage='Pins' /></span>
|
||||
</NavLink>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
{
|
||||
isSmallScreen &&
|
||||
<div className='account-mobile-container'>
|
||||
<div className={classNames('account-mobile-container', { 'deactivated': deactivated })}>
|
||||
<ProfileInfoPanel username={username} account={account} />
|
||||
</div>
|
||||
}
|
||||
|
||||
{
|
||||
me &&
|
||||
me && !deactivated &&
|
||||
<div className='account__header__extra__buttons'>
|
||||
<ActionButton account={account} />
|
||||
{account.get('id') !== me &&
|
||||
|
|
|
|||
|
|
@ -11,10 +11,12 @@ import VerificationBadge from 'soapbox/components/verification_badge';
|
|||
import Badge from 'soapbox/components/badge';
|
||||
import { List as ImmutableList } from 'immutable';
|
||||
import { acctFull, isAdmin, isModerator } from 'soapbox/utils/accounts';
|
||||
import classNames from 'classnames';
|
||||
|
||||
const messages = defineMessages({
|
||||
linkVerifiedOn: { id: 'account.link_verified_on', defaultMessage: 'Ownership of this link was checked on {date}' },
|
||||
account_locked: { id: 'account.locked_info', defaultMessage: 'This account privacy status is set to locked. The owner manually reviews who can follow them.' },
|
||||
deactivated: { id: 'account.deactivated', defaultMessage: 'Deactivated' },
|
||||
});
|
||||
|
||||
const dateFormatOptions = {
|
||||
|
|
@ -57,36 +59,47 @@ class ProfileInfoPanel extends ImmutablePureComponent {
|
|||
const badge = account.get('bot') ? (<div className='account-role bot'><FormattedMessage id='account.badges.bot' defaultMessage='Bot' /></div>) : null;
|
||||
const content = { __html: account.get('note_emojified') };
|
||||
const fields = account.get('fields');
|
||||
const displayNameHtml = { __html: account.get('display_name_html') };
|
||||
const deactivated = account.getIn(['pleroma', 'deactivated'], false);
|
||||
const displayNameHtml = deactivated ? { __html: intl.formatMessage(messages.deactivated) } : { __html: account.get('display_name_html') };
|
||||
const memberSinceDate = intl.formatDate(account.get('created_at'), { month: 'long', year: 'numeric' });
|
||||
const verified = account.get('pleroma').get('tags').includes('verified');
|
||||
const verified = account.getIn(['pleroma', 'tags'], ImmutableList()).includes('verified');
|
||||
|
||||
return (
|
||||
<div className='profile-info-panel'>
|
||||
<div className={classNames('profile-info-panel', { 'deactivated': deactivated })} >
|
||||
<div className='profile-info-panel__content'>
|
||||
|
||||
<div className='profile-info-panel-content__name'>
|
||||
<h1>
|
||||
<span dangerouslySetInnerHTML={displayNameHtml} />
|
||||
<span dangerouslySetInnerHTML={displayNameHtml} className='profile-info-panel__name-content' />
|
||||
{verified && <VerificationBadge />}
|
||||
{badge}
|
||||
<small>@{acctFull(account)} {lockedIcon}</small>
|
||||
{ !deactivated && <small>@{acctFull(account)} {lockedIcon}</small> }
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div className='profile-info-panel-content__badges'>
|
||||
{isAdmin(account) && <Badge slug='admin' title='Admin' />}
|
||||
{isModerator(account) && <Badge slug='moderator' title='Moderator' />}
|
||||
{account.getIn(['patron', 'is_patron']) && <Badge slug='patron' title='Patron' />}
|
||||
{account.get('acct').includes('@') || <div className='profile-info-panel-content__badges__join-date'>
|
||||
<Icon id='calendar' />
|
||||
{ !deactivated &&
|
||||
<div className='profile-info-panel-content__badges'>
|
||||
{isAdmin(account) && <Badge slug='admin' title='Admin' />}
|
||||
{isModerator(account) && <Badge slug='moderator' title='Moderator' />}
|
||||
{account.getIn(['patron', 'is_patron']) && <Badge slug='patron' title='Patron' />}
|
||||
{account.get('acct').includes('@') || <div className='profile-info-panel-content__badges__join-date'>
|
||||
<Icon id='calendar' />
|
||||
<FormattedMessage
|
||||
id='account.member_since' defaultMessage='Member since {date}' values={{
|
||||
date: memberSinceDate,
|
||||
}}
|
||||
/>
|
||||
</div>}
|
||||
</div>
|
||||
}
|
||||
|
||||
{ deactivated &&
|
||||
<div className='profile-info-panel-content__deactivated'>
|
||||
<FormattedMessage
|
||||
id='account.member_since' defaultMessage='Member since {date}' values={{
|
||||
date: memberSinceDate,
|
||||
}}
|
||||
id='account.deactivated_description' defaultMessage='This account has been deactivated.'
|
||||
/>
|
||||
</div>}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
{
|
||||
(account.get('note').length > 0 && account.get('note') !== '<p></p>') &&
|
||||
|
|
|
|||
|
|
@ -207,6 +207,10 @@
|
|||
padding: 10px 10px 0;
|
||||
&--nonuser {padding: 10px 10px 15px;}
|
||||
}
|
||||
|
||||
.account-mobile-container.deactivated {
|
||||
margin-top: 50px;
|
||||
}
|
||||
}
|
||||
} // end .account__header
|
||||
|
||||
|
|
|
|||
|
|
@ -678,6 +678,7 @@
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 160px;
|
||||
border-radius: 0 0 10px 10px;
|
||||
|
||||
@supports(display: grid) { // hack to fix Chrome <57
|
||||
contain: strict;
|
||||
|
|
|
|||
|
|
@ -128,3 +128,21 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.profile-info-panel.deactivated {
|
||||
.profile-info-panel__name-content {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.profile-info-panel__name-content::before {
|
||||
content: '[';
|
||||
}
|
||||
|
||||
.profile-info-panel__name-content::after {
|
||||
content: ']';
|
||||
}
|
||||
|
||||
.profile-info-panel-content__deactivated {
|
||||
color: var(--primary-text-color--faint);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue