Browse Source

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

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

* Update jest snapshot
pull/4/head
Eugen Rochko 6 years ago
committed by GitHub
parent
commit
7861c5f108
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 13 additions and 11 deletions
  1. +9
    -7
      app/javascript/mastodon/components/__tests__/__snapshots__/display_name-test.js.snap
  2. +1
    -1
      app/javascript/mastodon/components/display_name.js
  3. +1
    -1
      app/javascript/mastodon/components/status.js
  4. +1
    -1
      app/javascript/mastodon/features/account_timeline/components/moved_note.js
  5. +1
    -1
      app/javascript/mastodon/features/notifications/components/notification.js

+ 9
- 7
app/javascript/mastodon/components/__tests__/__snapshots__/display_name-test.js.snap View File

@ -4,14 +4,16 @@ exports[` renders display name + account name 1`] = `
<span
className="display-name"
>
<strong
className="display-name__html"
dangerouslySetInnerHTML={
Object {
"__html": "<p>Foo</p>",
<bdi>
<strong
className="display-name__html"
dangerouslySetInnerHTML={
Object {
"__html": "<p>Foo</p>",
}
}
}
/>
/>
</bdi>
<span
className="display-name__account"

+ 1
- 1
app/javascript/mastodon/components/display_name.js View File

@ -12,7 +12,7 @@ export default class DisplayName extends React.PureComponent {
return (
<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>
);
}

+ 1
- 1
app/javascript/mastodon/components/status.js View File

@ -162,7 +162,7 @@ export default class Status extends ImmutablePureComponent {
prepend = (
<div className='status__prepend'>
<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>
);

+ 1
- 1
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__message'>
<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>
<a href={to.get('url')} onClick={this.handleAccountClick} className='detailed-status__display-name'>

+ 1
- 1
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 account = notification.get('account');
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} /><pan>/bdi>;
switch(notification.get('type')) {
case 'follow':

Loading…
Cancel
Save