reply formatting works correctly

src/lib/formatters.js

@@ -124,17 +124,16 @@ function quotedImage(data) {
 //    onImagePreview: this.handleImagePreview
 //    onFormButtonClick: this.handleFormButtonClick
 //    onQuoteClick: this.handleQuoteClick (optional)
-export function fullFormatter(style, data, values, key) {
+export function fullFormatter(style, data, values, key, stack) {
+  if (stack.includes('QQ')) {
+    return quoteFormatter(style, data, values, key);
+  }
+
   if (!style) {
     // Unformatted.
     return values;
   }
 
-  if (style == 'HD') {
-    // Hidden.
-    return null;
-  }
-
   let el = Drafty.tagName(style);
   const attr = Drafty.attrValue(style, data) || {};
   attr.key = key;
@@ -146,6 +145,10 @@ export function fullFormatter(style, data, values, key) {
       // Highlighted text. Assign class name.
       attr.className = 'highlight';
       break;
+    case 'HD':
+      el = null;
+      values = null;
+      break;
     case 'IM':
       // Additional processing for images
       el = handleImageData.call(this, el, data, attr);
@@ -295,8 +298,8 @@ function inlineImageAttr(attr, data) {
 //    messages: formatjs messages defined with defineMessages.
 //    authorizeURL: this.props.tinode.authorizeURL
 //    onQuoteClick: this.handleQuoteClick (optional)
-export function quoteFormatter(style, data, values, key) {
-  if (['BR', 'EX', 'IM', 'MN', 'QQ'].includes(style)) {
+function quoteFormatter(style, data, values, key) {
+  if (['BR', 'EX', 'IM', 'MN'].includes(style)) {
     let el = Drafty.tagName(style);
     let attr = Drafty.attrValue(style, data) || {};
     attr.key = key;
@@ -318,10 +321,6 @@ export function quoteFormatter(style, data, values, key) {
           attr.className += ' ' + idToColorClass(data.val, false, true);
         }
         break;
-      case 'QQ':
-        attr.className = 'reply-quote';
-        attr.onClick = this.onQuoteClick;
-        break;
       case 'EX':
         let fname;
         if (data) {
@@ -391,11 +390,17 @@ function quoteImage(data) {
 
 // Create a preview of a reply.
 export function replyFormatter(style, data, values, key) {
-  if (style != 'IM') {
-    return quoteFormatter.call(this, style, data, values, key);
+  if (style == 'IM') {
+    const attr = inlineImageAttr.call(this, {key: key}, data);
+    attr.whenDone = cancelablePromise(quoteImage.call(this, data));
+    values = [React.createElement(LazyImage, attr, null), ' ', attr.alt];
+    return React.createElement(React.Fragment, {key: key}, values);
+  } else if (style == 'QQ') {
+    let el = Drafty.tagName('QQ');
+    const attr = Drafty.attrValue('QQ', data) || {};
+    attr.key = key;
+    attr.className = 'reply-quote'
+    return React.createElement(el, attr, values);
   }
-  const attr = inlineImageAttr.call(this, {key: key}, data);
-  attr.whenDone = cancelablePromise(quoteImage.call(this, data));
-  values = [React.createElement(LazyImage, attr, null), ' ', attr.alt];
-  return React.createElement(React.Fragment, {key: key}, values);
+  return quoteFormatter.call(this, style, data, values, key);
 }

src/views/messages-view.jsx

@@ -221,7 +221,6 @@ class MessagesView extends React.Component {
         const preview = nextProps.forwardMessage.preview;
         reply = {
           content: preview,
-          forwarded: nextProps.forwardMessage.head.forwarded,
           seq: null
         };
       }
@@ -852,7 +851,7 @@ class MessagesView extends React.Component {
   // forwarded: true if the source message is also a forwarded message.
   // senderId: UID of the sender of the source message.
   // senderName: full name of the sender of the original message.
-  handlePickReply(seq, content, forwarded, senderId, senderName) {
+  handlePickReply(seq, content, senderId, senderName) {
     this.setState({reply: null});
 
     if (!seq || !content) {
@@ -993,7 +992,6 @@ class MessagesView extends React.Component {
             <ChatMessage
               tinode={this.props.tinode}
               content={msg.content}
-              forwarded={msg.head ? !!msg.head.forwarded : null}
               deleted={msg.hi}
               mimeType={msg.head ? msg.head.mime : null}
               timestamp={msg.ts}

src/widgets/chat-message.jsx

@@ -7,8 +7,8 @@ import Attachment from './attachment.jsx';
 import LetterTile from './letter-tile.jsx';
 import ReceivedMarker from './received-marker.jsx'
 
-import { fullFormatter, quoteFormatter } from '../lib/formatters.js';
-import { sanitizeImageUrl, sanitizeUrl } from '../lib/utils.js';
+import { fullFormatter } from '../lib/formatters.js';
+import { sanitizeUrl } from '../lib/utils.js';
 
 class BaseChatMessage extends React.PureComponent {
   constructor(props) {
@@ -29,7 +29,6 @@ class BaseChatMessage extends React.PureComponent {
     this.handleQuoteClick = this.handleQuoteClick.bind(this);
 
     this.formatterContext = {
-      getFormatter: (tp) => { return tp == 'QQ' ? quoteFormatter : null; },
       formatMessage: props.intl.formatMessage.bind(props.intl),
       viewportWidth: props.viewportWidth,
       authorizeURL: props.tinode.authorizeURL.bind(props.tinode),
@@ -87,7 +86,6 @@ class BaseChatMessage extends React.PureComponent {
       content: this.props.content,
       userFrom: this.props.userFrom,
       userName: this.props.userName,
-      forwarded: this.props.forwarded,
       y: e.pageY,
       x: e.pageX,
       pickReply: this.props.pickReply

src/widgets/context-menu.jsx

@@ -434,7 +434,7 @@ class ContextMenu extends React.Component {
   }
 
   replyToMessage(params, errorHandler) {
-    params.pickReply(params.seq, params.content, params.forwarded, params.userFrom, params.userName, errorHandler);
+    params.pickReply(params.seq, params.content, params.userFrom, params.userName, errorHandler);
   }
 
   render() {

src/widgets/send-message.jsx

@@ -5,7 +5,7 @@ import { Drafty } from 'tinode-sdk';
 
 import { KEYPRESS_DELAY } from '../config.js';
 import { filePasted } from '../lib/blob-helpers.js';
-import { quoteFormatter, replyFormatter } from '../lib/formatters.js';
+import { replyFormatter } from '../lib/formatters.js';
 
 const messages = defineMessages({
   messaging_disabled: {
@@ -82,11 +82,12 @@ class SendMessage extends React.PureComponent {
   }
 
   formatReply() {
-    return this.props.reply ?
+    const fmt = this.props.reply ?
       Drafty.format(this.props.reply.content, replyFormatter, {
         formatMessage: this.props.intl.formatMessage.bind(this.props.intl),
         authorizeURL: this.props.tinode.authorizeURL.bind(this.props.tinode)
       }) : null;
+    return fmt;
   }
 
   handlePasteEvent(e) {