Merge pull request #1995 from ianmacd/pr3

Make the [Home] and [End] keys scroll the conversation.

ts/components/session/conversation/SessionMessagesList.tsx

@@ -23,6 +23,8 @@ export const SessionMessagesList = (props: {
   scrollToQuoteMessage: (options: QuoteClickOptions) => Promise<void>;
   onPageUpPressed: () => void;
   onPageDownPressed: () => void;
+  onHomePressed: () => void;
+  onEndPressed: () => void;
 }) => {
   const messagesProps = useSelector(getSortedMessagesTypesOfSelectedConversation);
 
@@ -34,6 +36,14 @@ export const SessionMessagesList = (props: {
     props.onPageDownPressed();
   });
 
+  useKey('Home', () => {
+    props.onHomePressed();
+  });
+
+  useKey('End', () => {
+    props.onEndPressed();
+  });
+
   return (
     <>
       {messagesProps.map(messageProps => {

ts/components/session/conversation/SessionMessagesListContainer.tsx

@@ -151,6 +151,8 @@ class SessionMessagesListContainerInner extends React.Component<Props> {
           scrollToQuoteMessage={this.scrollToQuoteMessage}
           onPageDownPressed={this.scrollPgDown}
           onPageUpPressed={this.scrollPgUp}
+          onHomePressed={this.scrollTop}
+          onEndPressed={this.scrollEnd}
         />
 
         <SessionScrollButton onClick={this.scrollToBottom} key="scroll-down-button" />
@@ -267,6 +269,24 @@ class SessionMessagesListContainerInner extends React.Component<Props> {
     });
   }
 
+  private scrollTop() {
+    const messageContainer = this.props.messageContainerRef.current;
+    if (!messageContainer) {
+      return;
+    }
+
+    messageContainer.scrollTo(0, -messageContainer.scrollHeight);
+  }
+
+  private scrollEnd() {
+    const messageContainer = this.props.messageContainerRef.current;
+    if (!messageContainer) {
+      return;
+    }
+
+    messageContainer.scrollTo(0, 0);
+  }
+
   private async scrollToQuoteMessage(options: QuoteClickOptions) {
     const { quoteAuthor, quoteId, referencedMessageNotFound } = options;