diff --git a/ts/components/conversation/Message.tsx b/ts/components/conversation/Message.tsx index fec37b8607..af65748e5e 100644 --- a/ts/components/conversation/Message.tsx +++ b/ts/components/conversation/Message.tsx @@ -1745,6 +1745,11 @@ export class Message extends React.PureComponent { : null )} dir={isRTL ? 'rtl' : undefined} + onDoubleClick={(event: React.MouseEvent) => { + // Prevent double-click interefering with interactions _inside_ + // the bubble. + event.stopPropagation(); + }} > { role="row" onKeyDown={onKeyDown} onClick={this.handleClick} + onDoubleClick={ev => { + // Prevent double click from triggering the replyToMessage action + ev.stopPropagation(); + }} tabIndex={-1} > {this.renderAuthor()} diff --git a/ts/components/conversation/TimelineMessage.tsx b/ts/components/conversation/TimelineMessage.tsx index 9e869880e4..c2190a3317 100644 --- a/ts/components/conversation/TimelineMessage.tsx +++ b/ts/components/conversation/TimelineMessage.tsx @@ -290,55 +290,66 @@ export function TimelineMessage(props: Props): JSX.Element { {i18n('deleteWarning')} )} - - +
{ + if (!handleReplyToMessage) { + return; + } - {reactionPickerRoot && - createPortal( - - {({ ref, style }) => - renderReactionPicker({ - ref, - style, - selected: selectedReaction, - onClose: toggleReactionPicker, - onPick: emoji => { - toggleReactionPicker(true); - reactToMessage(id, { - emoji, - remove: emoji === selectedReaction, - }); - }, - renderEmojiPicker, - }) - } - , - reactionPickerRoot - )} - - } - /> + ev.stopPropagation(); + ev.preventDefault(); + handleReplyToMessage(); + }} + > + + + {reactionPickerRoot && + createPortal( + + {({ ref, style }) => + renderReactionPicker({ + ref, + style, + selected: selectedReaction, + onClose: toggleReactionPicker, + onPick: emoji => { + toggleReactionPicker(true); + reactToMessage(id, { + emoji, + remove: emoji === selectedReaction, + }); + }, + renderEmojiPicker, + }) + } + , + reactionPickerRoot + )} + + } + /> +
{ + // Prevent double click from triggering the replyToMessage action + ev.stopPropagation(); + }} /> @@ -455,6 +470,10 @@ function MessageMenu({ role="button" className="module-message__buttons__react" aria-label={i18n('reactToMessage')} + onDoubleClick={ev => { + // Prevent double click from triggering the replyToMessage action + ev.stopPropagation(); + }} /> ); }} @@ -473,6 +492,10 @@ function MessageMenu({ 'module-message__buttons__download', `module-message__buttons__download--${direction}` )} + onDoubleClick={ev => { + // Prevent double click from triggering the replyToMessage action + ev.stopPropagation(); + }} /> )} @@ -494,6 +517,10 @@ function MessageMenu({ 'module-message__buttons__reply', `module-message__buttons__download--${direction}` )} + onDoubleClick={ev => { + // Prevent double click from triggering the replyToMessage action + ev.stopPropagation(); + }} /> )}