diff options
Diffstat (limited to 'app/javascript/glitch/components/notification')
-rw-r--r-- | app/javascript/glitch/components/notification/follow.js | 84 |
1 files changed, 16 insertions, 68 deletions
diff --git a/app/javascript/glitch/components/notification/follow.js b/app/javascript/glitch/components/notification/follow.js index d340e83c8..e2c21bf35 100644 --- a/app/javascript/glitch/components/notification/follow.js +++ b/app/javascript/glitch/components/notification/follow.js @@ -1,106 +1,54 @@ -/* +// `<NotificationFollow>` +// ====================== -`<NotificationFollow>` -====================== +// * * * * * * * // -This component renders a follow notification. +// Imports +// ------- -__Props:__ - - - __`id` (`PropTypes.number.isRequired`) :__ - This is the id of the notification. - - - __`onDeleteNotification` (`PropTypes.func.isRequired`) :__ - The function to call when a notification should be - dismissed/deleted. - - - __`account` (`PropTypes.object.isRequired`) :__ - The account associated with the follow notification, ie the account - which followed the user. - - - __`intl` (`PropTypes.object.isRequired`) :__ - Our internationalization object, inserted by `@injectIntl`. - -*/ - -// * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - -/* - -Imports: --------- - -*/ - -// Package imports // +// Package imports. import React from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import { FormattedMessage } from 'react-intl'; -import escapeTextContentForBrowser from 'escape-html'; import ImmutablePureComponent from 'react-immutable-pure-component'; -// Mastodon imports // -import emojify from '../../../mastodon/emoji'; +// Mastodon imports. import Permalink from '../../../mastodon/components/permalink'; import AccountContainer from '../../../mastodon/containers/account_container'; -// Our imports // +// Our imports. import NotificationOverlayContainer from '../notification/overlay/container'; -// * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * - -/* +// * * * * * * * // -Implementation: ---------------- - -*/ +// Implementation +// -------------- export default class NotificationFollow extends ImmutablePureComponent { static propTypes = { - id : PropTypes.number.isRequired, + id : PropTypes.string.isRequired, account : ImmutablePropTypes.map.isRequired, notification : ImmutablePropTypes.map.isRequired, }; -/* - -### `render()` - -This actually renders the component. - -*/ - render () { const { account, notification } = this.props; -/* - -`link` is a container for the account's `displayName`, which links to -the account timeline using a `<Permalink>`. - -*/ - - const displayName = account.get('display_name') || account.get('username'); - const displayNameHTML = { __html: emojify(escapeTextContentForBrowser(displayName)) }; + // Links to the display name. + const displayName = account.get('display_name_html') || account.get('username'); const link = ( <Permalink className='notification__display-name' href={account.get('url')} title={account.get('acct')} to={`/accounts/${account.get('id')}`} - dangerouslySetInnerHTML={displayNameHTML} + dangerouslySetInnerHTML={{ __html: displayName }} /> ); -/* - -We can now render our component. - -*/ - + // Renders. return ( <div className='notification notification-follow'> <div className='notification__message'> |