From c89fcb80d24ed35a4a8e487b830da3a6e27554cc Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Fri, 14 Jan 2022 21:35:28 +0000
Subject: [PATCH] Revert "Merge branch 'revert-db7c7b36' into 'develop'"

This reverts merge request !989
---
 .../features/ui/components/pending_status.js  | 54 +++++++++++++++++++
 .../ui/util/pending_status_builder.js         | 20 ++++++-
 2 files changed, 72 insertions(+), 2 deletions(-)

diff --git a/app/soapbox/features/ui/components/pending_status.js b/app/soapbox/features/ui/components/pending_status.js
index 847869457..f21bfe010 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';
 
@@ -29,6 +30,7 @@ const mapStateToProps = (state, props) => {
 };
 
 export default @connect(mapStateToProps)
+@injectIntl
 class PendingStatus extends ImmutablePureComponent {
 
   renderMedia = () => {
@@ -47,6 +49,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 (
+          <div className='reply-mentions'>
+            <FormattedMessage
+              id='reply_mentions.reply'
+              defaultMessage='Replying to {accounts}{more}'
+              values={{
+                accounts: <span className='reply-mentions__account'>@{status.getIn(['account', 'username'])}</span>,
+                more: false,
+              }}
+            />
+          </div>
+        );
+      } else {
+        return (
+          <div className='reply-mentions'>
+            <FormattedMessage id='reply_mentions.reply_empty' defaultMessage='Replying to post' />
+          </div>
+        );
+      }
+    }
+
+
+    return (
+      <div className='reply-mentions'>
+        <FormattedMessage
+          id='reply_mentions.reply'
+          defaultMessage='Replying to {accounts}{more}'
+          values={{
+            accounts: to.slice(0, 2).map(account => (<>
+              <span key={account.username} className='reply-mentions__account'>@{account.username}</span>
+              {' '}
+            </>)),
+            more: to.size > 2 && <FormattedMessage id='reply_mentions.more' defaultMessage='and {count} more' values={{ count: to.size - 2 }} />,
+          }}
+        />
+      </div>
+    );
+  }
+
   render() {
     const { status, className } = this.props;
     if (!status) return null;
@@ -84,6 +136,8 @@ class PendingStatus extends ImmutablePureComponent {
               </div>
             </div>
 
+            {this.renderReplyMentions()}
+
             <StatusContent
               status={status}
               expanded
diff --git a/app/soapbox/features/ui/util/pending_status_builder.js b/app/soapbox/features/ui/util/pending_status_builder.js
index 1c6f33517..ea3cb92ca 100644
--- a/app/soapbox/features/ui/util/pending_status_builder.js
+++ b/app/soapbox/features/ui/util/pending_status_builder.js
@@ -1,14 +1,24 @@
 import { fromJS } from 'immutable';
+import { OrderedSet as ImmutableOrderedSet } from 'immutable';
 
 import { normalizeStatus } from 'soapbox/actions/importer/normalizer';
-import { makeGetAccount } from 'soapbox/selectors';
+import { makeGetAccount, makeGetStatus } from 'soapbox/selectors';
 
 export const buildStatus = (state, pendingStatus, idempotencyKey) => {
   const getAccount = makeGetAccount();
+  const getStatus = makeGetStatus();
 
   const me = state.get('me');
   const account = getAccount(state, me);
 
+  let replyToSelf = false;
+  if (pendingStatus.get('in_reply_to_id')) {
+    const inReplyTo = getStatus(state, { id: pendingStatus.get('in_reply_to_id') });
+
+    if (inReplyTo.getIn(['account', 'id']) === me)
+      replyToSelf = true;
+  }
+
   const status = normalizeStatus({
     account,
     application: null,
@@ -24,7 +34,13 @@ 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: (
+      replyToSelf
+        ? ImmutableOrderedSet([account.get('acct')]).union(pendingStatus.get('to'))
+        : pendingStatus.get('to')
+    ).map(mention => ({
+      username: mention.split('@')[0],
+    })),
     muted: false,
     pinned: false,
     poll: pendingStatus.get('poll', null),