Merge pull request #4588 from matrix-org/t3chguy/kbd1

Add new keyboard shortcuts for jump to unread and upload file

src/accessibility/KeyboardShortcuts.tsx

@@ -34,6 +34,7 @@ export enum Categories {
     CALLS = "Calls",
     COMPOSER = "Composer",
     ROOM_LIST = "Room List",
+    ROOM = "Room",
     AUTOCOMPLETE = "Autocomplete",
 }
 
@@ -142,6 +143,34 @@ const shortcuts: Record<Categories, IShortcut[]> = {
         },
     ],
 
+    [Categories.ROOM]: [
+        {
+            keybinds: [{
+                key: Key.PAGE_UP,
+            }, {
+                key: Key.PAGE_DOWN,
+            }],
+            description: _td("Scroll up/down in the timeline"),
+        }, {
+            keybinds: [{
+                key: Key.ESCAPE,
+            }],
+            description: _td("Dismiss read marker and jump to bottom"),
+        }, {
+            keybinds: [{
+                modifiers: [Modifiers.SHIFT],
+                key: Key.PAGE_UP,
+            }],
+                description: _td("Jump to oldest unread message"),
+        }, {
+            keybinds: [{
+                modifiers: [CMD_OR_CTRL, Modifiers.SHIFT],
+                key: Key.U,
+            }],
+            description: _td("Upload a file"),
+        }
+    ],
+
     [Categories.ROOM_LIST]: [
         {
             keybinds: [{
@@ -181,13 +210,6 @@ const shortcuts: Record<Categories, IShortcut[]> = {
 
     [Categories.NAVIGATION]: [
         {
-            keybinds: [{
-                key: Key.PAGE_UP,
-            }, {
-                key: Key.PAGE_DOWN,
-            }],
-            description: _td("Scroll up/down in the timeline"),
-        }, {
             keybinds: [{
                 modifiers: [Modifiers.ALT, Modifiers.SHIFT],
                 key: Key.ARROW_UP,
@@ -257,10 +279,11 @@ const shortcuts: Record<Categories, IShortcut[]> = {
 
 const categoryOrder = [
     Categories.COMPOSER,
-    Categories.CALLS,
-    Categories.ROOM_LIST,
     Categories.AUTOCOMPLETE,
+    Categories.ROOM,
+    Categories.ROOM_LIST,
     Categories.NAVIGATION,
+    Categories.CALLS,
 ];
 
 interface IModal {

src/components/structures/RoomView.js

@@ -41,7 +41,7 @@ import * as ObjectUtils from '../../ObjectUtils';
 import * as Rooms from '../../Rooms';
 import eventSearch from '../../Searching';
 
-import {isOnlyCtrlOrCmdKeyEvent, Key} from '../../Keyboard';
+import {isOnlyCtrlOrCmdIgnoreShiftKeyEvent, isOnlyCtrlOrCmdKeyEvent, Key} from '../../Keyboard';
 
 import MainSplit from './MainSplit';
 import RightPanel from './RightPanel';
@@ -588,6 +588,18 @@ export default createReactClass({
                     handled = true;
                 }
                 break;
+            case Key.PAGE_UP:
+                if (!ev.altKey && !ev.ctrlKey && ev.shiftKey && !ev.metaKey) {
+                    this.jumpToReadMarker();
+                    handled = true;
+                }
+                break;
+            case Key.U.toUpperCase():
+                if (isOnlyCtrlOrCmdIgnoreShiftKeyEvent(ev) && ev.shiftKey) {
+                    dis.dispatch({ action: "upload_file" })
+                    handled = true;
+                }
+                break;
         }
 
         if (handled) {

src/components/views/rooms/MessageComposer.js

@@ -114,8 +114,19 @@ class UploadButton extends React.Component {
         this.onUploadFileInputChange = this.onUploadFileInputChange.bind(this);
 
         this._uploadInput = createRef();
+        this._dispatcherRef = dis.register(this.onAction);
     }
 
+    componentWillUnmount() {
+        dis.unregister(this._dispatcherRef);
+    }
+
+    onAction = payload => {
+        if (payload.action === "upload_file") {
+            this.onUploadClick();
+        }
+    };
+
     onUploadClick(ev) {
         if (MatrixClientPeg.get().isGuest()) {
             dis.dispatch({action: 'require_registration'});
@@ -128,7 +139,7 @@ class UploadButton extends React.Component {
         if (ev.target.files.length === 0) return;
 
         // take a copy so we can safely reset the value of the form control
-        // (Note it is a FileList: we can't use slice or sesnible iteration).
+        // (Note it is a FileList: we can't use slice or sensible iteration).
         const tfiles = [];
         for (let i = 0; i < ev.target.files.length; ++i) {
             tfiles.push(ev.target.files[i]);

src/i18n/strings/en_EN.json

@@ -2286,13 +2286,16 @@
     "Cancel replying to a message": "Cancel replying to a message",
     "Toggle microphone mute": "Toggle microphone mute",
     "Toggle video on/off": "Toggle video on/off",
+    "Scroll up/down in the timeline": "Scroll up/down in the timeline",
+    "Dismiss read marker and jump to bottom": "Dismiss read marker and jump to bottom",
+    "Jump to oldest unread message": "Jump to oldest unread message",
+    "Upload a file": "Upload a file",
     "Jump to room search": "Jump to room search",
     "Navigate up/down in the room list": "Navigate up/down in the room list",
     "Select room from the room list": "Select room from the room list",
     "Collapse room list section": "Collapse room list section",
     "Expand room list section": "Expand room list section",
     "Clear room list filter field": "Clear room list filter field",
-    "Scroll up/down in the timeline": "Scroll up/down in the timeline",
     "Previous/next unread room or DM": "Previous/next unread room or DM",
     "Previous/next room or DM": "Previous/next room or DM",
     "Toggle the top left menu": "Toggle the top left menu",