Change design of role badges in web UI (#26281)
Co-authored-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
parent
01f0cffc2c
commit
2cbdff97ce
7 changed files with 491 additions and 31 deletions
|
@ -10,6 +10,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
|
|||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||
|
||||
import { Avatar } from 'mastodon/components/avatar';
|
||||
import { Badge, AutomatedBadge, GroupBadge } from 'mastodon/components/badge';
|
||||
import Button from 'mastodon/components/button';
|
||||
import { FollowersCounter, FollowingCounter, StatusesCounter } from 'mastodon/components/counters';
|
||||
import { Icon } from 'mastodon/components/icon';
|
||||
|
@ -373,28 +374,13 @@ class Header extends ImmutablePureComponent {
|
|||
const badges = [];
|
||||
|
||||
if (account.get('bot')) {
|
||||
badges.push(
|
||||
<div key='bot-badge' className='account-role bot'>
|
||||
<Icon id='cogs' /> { ' ' }
|
||||
<FormattedMessage id='account.badges.bot' defaultMessage='Automated' />
|
||||
</div>
|
||||
);
|
||||
badges.push(<AutomatedBadge key='bot-badge' />);
|
||||
} else if (account.get('group')) {
|
||||
badges.push(
|
||||
<div key='group-badge' className='account-role group'>
|
||||
<Icon id='users' /> { ' ' }
|
||||
<FormattedMessage id='account.badges.group' defaultMessage='Group' />
|
||||
</div>
|
||||
);
|
||||
badges.push(<GroupBadge key='group-badge' />);
|
||||
}
|
||||
|
||||
account.get('roles', []).forEach((role) => {
|
||||
badges.push(
|
||||
<div key={`role-badge-${role.get('id')}`} className={`account-role user-role-${account.getIn(['roles', 0, 'id'])}`}>
|
||||
<Icon id='circle' /> { ' ' }
|
||||
<span>{role.get('name')} ({domain})</span>
|
||||
</div>
|
||||
);
|
||||
badges.push(<Badge key={`role-badge-${role.get('id')}`} label={<span>{role.get('name')}</span>} domain={domain} />);
|
||||
});
|
||||
|
||||
return (
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue