treehouse
/
mastodon
21
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

Surround mid-text display names with bdi tags (#6257) 

* Fix #1095 - Surround mid-text display names with bdi tags

* Update jest snapshot
lolsob-rspec
Eugen Rochko 2018-01-15 18:55:10 +01:00 committed by GitHub
parent 1a90ef9c25
commit 19aaf0e99f
5 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/javascript/mastodon/components/__tests__/__snapshots__/display_name-test.js.snap
View File

@ -4,6 +4,7 @@ exports[`<DisplayName /> renders display name + account name 1`] = `
<span <span
className="display-name" className="display-name"
> >
<bdi>
<strong <strong
className="display-name__html" className="display-name__html"
dangerouslySetInnerHTML={ dangerouslySetInnerHTML={
@ -12,6 +13,7 @@ exports[`<DisplayName /> renders display name + account name 1`] = `
} }
} }
/> />
</bdi>
<span <span
className="display-name__account" className="display-name__account"

2
app/javascript/mastodon/components/display_name.js
View File

@ -12,7 +12,7 @@ export default class DisplayName extends React.PureComponent {
return ( return (
<span className='display-name'> <span className='display-name'>
<strong className='display-name__html' dangerouslySetInnerHTML={displayNameHtml} /> <span className='display-name__account'>@{this.props.account.get('acct')}</span> <bdi><strong className='display-name__html' dangerouslySetInnerHTML={displayNameHtml} /></bdi> <span className='display-name__account'>@{this.props.account.get('acct')}</span>
</span> </span>
); );
} }

2
app/javascript/mastodon/components/status.js
View File

@ -162,7 +162,7 @@ export default class Status extends ImmutablePureComponent {
prepend = ( prepend = (
<div className='status__prepend'> <div className='status__prepend'>
<div className='status__prepend-icon-wrapper'><i className='fa fa-fw fa-retweet status__prepend-icon' /></div> <div className='status__prepend-icon-wrapper'><i className='fa fa-fw fa-retweet status__prepend-icon' /></div>
<FormattedMessage id='status.reblogged_by' defaultMessage='{name} boosted' values={{ name: <a onClick={this.handleAccountClick} data-id={status.getIn(['account', 'id'])} href={status.getIn(['account', 'url'])} className='status__display-name muted'><strong dangerouslySetInnerHTML={display_name_html} /></a> }} /> <FormattedMessage id='status.reblogged_by' defaultMessage='{name} boosted' values={{ name: <a onClick={this.handleAccountClick} data-id={status.getIn(['account', 'id'])} href={status.getIn(['account', 'url'])} className='status__display-name muted'><bdi><strong dangerouslySetInnerHTML={display_name_html} /></bdi></a> }} />
</div> </div>
); );

2
app/javascript/mastodon/features/account_timeline/components/moved_note.js
View File

@ -34,7 +34,7 @@ export default class MovedNote extends ImmutablePureComponent {
<div className='account__moved-note'> <div className='account__moved-note'>
<div className='account__moved-note__message'> <div className='account__moved-note__message'>
<div className='account__moved-note__icon-wrapper'><i className='fa fa-fw fa-suitcase account__moved-note__icon' /></div> <div className='account__moved-note__icon-wrapper'><i className='fa fa-fw fa-suitcase account__moved-note__icon' /></div>
<FormattedMessage id='account.moved_to' defaultMessage='{name} has moved to:' values={{ name: <strong dangerouslySetInnerHTML={displayNameHtml} /> }} /> <FormattedMessage id='account.moved_to' defaultMessage='{name} has moved to:' values={{ name: <bdi><strong dangerouslySetInnerHTML={displayNameHtml} /></bdi> }} />
</div> </div>
<a href={to.get('url')} onClick={this.handleAccountClick} className='detailed-status__display-name'> <a href={to.get('url')} onClick={this.handleAccountClick} className='detailed-status__display-name'>

2
app/javascript/mastodon/features/notifications/components/notification.js
View File

@ -133,7 +133,7 @@ export default class Notification extends ImmutablePureComponent {
const { notification } = this.props; const { notification } = this.props;
const account = notification.get('account'); const account = notification.get('account');
const displayNameHtml = { __html: account.get('display_name_html') }; const displayNameHtml = { __html: account.get('display_name_html') };
const link = <Permalink className='notification__display-name' href={account.get('url')} title={account.get('acct')} to={`/accounts/${account.get('id')}`} dangerouslySetInnerHTML={displayNameHtml} />; const link = <bdi><Permalink className='notification__display-name' href={account.get('url')} title={account.get('acct')} to={`/accounts/${account.get('id')}`} dangerouslySetInnerHTML={displayNameHtml} /></bdi>;
switch(notification.get('type')) { switch(notification.get('type')) {
case 'follow': case 'follow':