diff options
Diffstat (limited to 'app/javascript/glitch/components/status/prepend.js')
-rw-r--r-- | app/javascript/glitch/components/status/prepend.js | 29 |
1 files changed, 28 insertions, 1 deletions
diff --git a/app/javascript/glitch/components/status/prepend.js b/app/javascript/glitch/components/status/prepend.js index ef9209e81..d9b04b5ec 100644 --- a/app/javascript/glitch/components/status/prepend.js +++ b/app/javascript/glitch/components/status/prepend.js @@ -23,11 +23,17 @@ import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import escapeTextContentForBrowser from 'escape-html'; +import { defineMessages, injectIntl } from 'react-intl'; import { FormattedMessage } from 'react-intl'; // Mastodon imports // import emojify from '../../../mastodon/emoji'; + +const messages = defineMessages({ + deleteNotification: { id: 'status.dismiss_notification', defaultMessage: 'Dismiss notification' }, +}); + /* * * * */ /* @@ -53,12 +59,16 @@ element. */ +@injectIntl export default class StatusPrepend extends React.PureComponent { static propTypes = { type: PropTypes.string.isRequired, account: ImmutablePropTypes.map.isRequired, parseClick: PropTypes.func.isRequired, + notificationId: PropTypes.number, + onDeleteNotification: PropTypes.func, + intl: PropTypes.object.isRequired, }; /* @@ -77,6 +87,10 @@ an account link is clicked. parseClick(e, `/accounts/${+account.get('id')}`); } + handleNotificationDeleteClick = () => { + this.props.onDeleteNotification(this.props.notificationId); + } + /* #### `<Message>`. @@ -145,7 +159,19 @@ the `<Message>` inside of an <aside>. render () { const { Message } = this; - const { type } = this.props; + const { type, intl } = this.props; + + const dismissTitle = intl.formatMessage(messages.deleteNotification); + const dismiss = this.props.notificationId ? ( + <button + aria-label={dismissTitle} + title={dismissTitle} + onClick={this.handleNotificationDeleteClick} + className='status__prepend-dismiss-button' + > + <i className='fa fa-eraser' /> + </button> + ) : null; return !type ? null : ( <aside className={type === 'reblogged_by' ? 'status__prepend' : 'notification__message'}> @@ -157,6 +183,7 @@ the `<Message>` inside of an <aside>. /> </div> <Message /> + {dismiss} </aside> ); } |