diff --git a/ts/components/session/conversation/SessionCompositionBox.tsx b/ts/components/session/conversation/SessionCompositionBox.tsx index 6202c3827..c03939d55 100644 --- a/ts/components/session/conversation/SessionCompositionBox.tsx +++ b/ts/components/session/conversation/SessionCompositionBox.tsx @@ -709,6 +709,9 @@ export class SessionCompositionBox extends React.Component { await this.onSendMessage(); } else if (event.key === 'Escape' && this.state.showEmojiPanel) { this.hideEmojiPanel(); + } else if (event.key === 'PageUp' || event.key === 'PageDown') { + // swallow pageUp events if they occurs on the composition box (it breaks the app layout) + event.preventDefault(); } } diff --git a/ts/components/session/conversation/SessionConversation.tsx b/ts/components/session/conversation/SessionConversation.tsx index 700151e9e..e3e082497 100644 --- a/ts/components/session/conversation/SessionConversation.tsx +++ b/ts/components/session/conversation/SessionConversation.tsx @@ -307,6 +307,7 @@ export class SessionConversation extends React.Component { /> */}
{ } // EXIT WHAT ELSE? } - switch (event.key) { - case 'Escape': - if (selectionMode) { - this.resetSelection(); - } - break; - // Scrolling - case 'ArrowUp': - messageContainer.scrollBy(0, -arrowScrollPx); - break; - case 'ArrowDown': - messageContainer.scrollBy(0, arrowScrollPx); - break; - case 'PageUp': - messageContainer.scrollBy(0, -pageScrollPx); - break; - case 'PageDown': - messageContainer.scrollBy(0, pageScrollPx); - break; - default: + if (event.target.classList.contains('conversation-content')) { + switch (event.key) { + case 'Escape': + if (selectionMode) { + this.resetSelection(); + } + break; + // Scrolling + case 'ArrowUp': + messageContainer.scrollBy(0, -arrowScrollPx); + break; + case 'ArrowDown': + messageContainer.scrollBy(0, arrowScrollPx); + break; + case 'PageUp': + messageContainer.scrollBy(0, -pageScrollPx); + break; + case 'PageDown': + messageContainer.scrollBy(0, pageScrollPx); + break; + default: + } } }