Reply to a message by double clicking on its row

This commit is contained in:
Hugo Osvaldo Barrera 2021-01-11 22:43:58 +01:00 committed by Josh Perez
parent d4124abb01
commit 288293795f
2 changed files with 84 additions and 48 deletions

View file

@ -1745,6 +1745,11 @@ export class Message extends React.PureComponent<Props, State> {
: null : null
)} )}
dir={isRTL ? 'rtl' : undefined} dir={isRTL ? 'rtl' : undefined}
onDoubleClick={(event: React.MouseEvent) => {
// Prevent double-click interefering with interactions _inside_
// the bubble.
event.stopPropagation();
}}
> >
<MessageBodyReadMore <MessageBodyReadMore
bodyRanges={bodyRanges} bodyRanges={bodyRanges}
@ -2505,6 +2510,10 @@ export class Message extends React.PureComponent<Props, State> {
role="row" role="row"
onKeyDown={onKeyDown} onKeyDown={onKeyDown}
onClick={this.handleClick} onClick={this.handleClick}
onDoubleClick={ev => {
// Prevent double click from triggering the replyToMessage action
ev.stopPropagation();
}}
tabIndex={-1} tabIndex={-1}
> >
{this.renderAuthor()} {this.renderAuthor()}

View file

@ -290,6 +290,17 @@ export function TimelineMessage(props: Props): JSX.Element {
{i18n('deleteWarning')} {i18n('deleteWarning')}
</ConfirmationDialog> </ConfirmationDialog>
)} )}
<div
onDoubleClick={ev => {
if (!handleReplyToMessage) {
return;
}
ev.stopPropagation();
ev.preventDefault();
handleReplyToMessage();
}}
>
<Message <Message
{...props} {...props}
renderingContext="conversation/TimelineItem" renderingContext="conversation/TimelineItem"
@ -307,7 +318,6 @@ export function TimelineMessage(props: Props): JSX.Element {
onReplyToMessage={handleReplyToMessage} onReplyToMessage={handleReplyToMessage}
onReact={handleReact} onReact={handleReact}
/> />
{reactionPickerRoot && {reactionPickerRoot &&
createPortal( createPortal(
<Popper <Popper
@ -339,6 +349,7 @@ export function TimelineMessage(props: Props): JSX.Element {
</Manager> </Manager>
} }
/> />
</div>
<MessageContextMenu <MessageContextMenu
i18n={i18n} i18n={i18n}
@ -412,6 +423,10 @@ function MessageMenu({
'module-message__buttons__menu', 'module-message__buttons__menu',
`module-message__buttons__download--${direction}` `module-message__buttons__download--${direction}`
)} )}
onDoubleClick={ev => {
// Prevent double click from triggering the replyToMessage action
ev.stopPropagation();
}}
/> />
</ContextMenuTrigger> </ContextMenuTrigger>
</StopPropagation> </StopPropagation>
@ -455,6 +470,10 @@ function MessageMenu({
role="button" role="button"
className="module-message__buttons__react" className="module-message__buttons__react"
aria-label={i18n('reactToMessage')} 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',
`module-message__buttons__download--${direction}` `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__reply',
`module-message__buttons__download--${direction}` `module-message__buttons__download--${direction}`
)} )}
onDoubleClick={ev => {
// Prevent double click from triggering the replyToMessage action
ev.stopPropagation();
}}
/> />
)} )}
</> </>