diff --git a/app/soapbox/features/ui/components/pending_status.js b/app/soapbox/features/ui/components/pending_status.js index 35bbfcc31..096855858 100644 --- a/app/soapbox/features/ui/components/pending_status.js +++ b/app/soapbox/features/ui/components/pending_status.js @@ -1,6 +1,7 @@ import classNames from 'classnames'; import React from 'react'; import ImmutablePureComponent from 'react-immutable-pure-component'; +import { FormattedMessage, injectIntl } from 'react-intl'; import { connect } from 'react-redux'; import { Link, NavLink } from 'react-router-dom'; @@ -30,6 +31,7 @@ const mapStateToProps = (state, props) => { }; export default @connect(mapStateToProps) +@injectIntl class PendingStatus extends ImmutablePureComponent { renderMedia = () => { @@ -48,6 +50,56 @@ class PendingStatus extends ImmutablePureComponent { } } + renderReplyMentions = () => { + const { status } = this.props; + + if (!status.get('in_reply_to_id')) { + return null; + } + + const to = status.get('mentions', []); + + if (to.size === 0) { + if (status.get('in_reply_to_account_id') === status.getIn(['account', 'id'])) { + return ( +
+ @{status.getIn(['account', 'username'])}, + more: false, + }} + /> +
+ ); + } else { + return ( +
+ +
+ ); + } + } + + + return ( +
+ (<> + @{account.username} + {' '} + )), + more: to.size > 2 && , + }} + /> +
+ ); + } + render() { const { status, className } = this.props; if (!status) return null; @@ -85,6 +137,8 @@ class PendingStatus extends ImmutablePureComponent { + {this.renderReplyMentions()} + { const getAccount = makeGetAccount(); + const getStatus = makeGetStatus(); const me = state.get('me'); const account = getAccount(state, me); + let mentions; + if (pendingStatus.get('in_reply_to_id')) { + const inReplyTo = getStatus(state, { id: pendingStatus.get('in_reply_to_id') }); + + if (inReplyTo.getIn(['account', 'id']) === me) { + mentions = ImmutableOrderedSet([account.get('acct')]).union(pendingStatus.get('to', [])); + } else { + mentions = pendingStatus.get('to', []); + } + + mentions = mentions.map(mention => ({ + username: mention.split('@')[0], + })); + } + const status = normalizeStatus({ account, application: null, @@ -24,7 +41,7 @@ export const buildStatus = (state, pendingStatus, idempotencyKey) => { in_reply_to_id: pendingStatus.get('in_reply_to_id'), language: null, media_attachments: pendingStatus.get('media_ids').map(id => ({ id })), - mentions: [], + mentions, muted: false, pinned: false, poll: pendingStatus.get('poll', null),