Main View keybindings (#463)

* added all mainviews except session

* add session keybindings

* finished session keybindings

* organized by layer

* remove some webshare code and remove unused session cancel fn

* fixed checkkeypressed bug

* fixed kwargs, bug

assets/default-keybindings.json

@@ -87,39 +87,48 @@
     },
     {
       "command": "app:selectTab-1",
-      "keys": ["Cmd:1"]
+      "keys": ["Cmd:1"],
+      "commandStr":"/screen 1"
     },
     {
       "command": "app:selectTab-2",
-      "keys": ["Cmd:2"]
+      "keys": ["Cmd:2"],
+      "commandStr":"/screen 2"
     },
     {
       "command": "app:selectTab-3",
-      "keys": ["Cmd:3"]
+      "keys": ["Cmd:3"],
+      "commandStr":"/screen 3"
     },
     {
       "command": "app:selectTab-4",
-      "keys": ["Cmd:4"]
+      "keys": ["Cmd:4"],
+      "commandStr":"/screen 4"
     },
     {
       "command": "app:selectTab-5",
-      "keys": ["Cmd:5"]
+      "keys": ["Cmd:5"],
+      "commandStr":"/screen 5"
     },
     {
       "command": "app:selectTab-6",
-      "keys": ["Cmd:6"]
+      "keys": ["Cmd:6"],
+      "commandStr":"/screen 6"
     },
     {
       "command": "app:selectTab-7",
-      "keys": ["Cmd:7"]
+      "keys": ["Cmd:7"],
+      "commandStr":"/screen 7"
     },
     {
       "command": "app:selectTab-8",
-      "keys": ["Cmd:8"]
+      "keys": ["Cmd:8"],
+      "commandStr":"/screen 8"
     },
     {
       "command": "app:selectTab-9",
-      "keys": ["Cmd:9"]
+      "keys": ["Cmd:9"],
+      "commandStr":"/screen 9"
     },
     {
       "command": "app:selectTabLeft",

src/app/clientsettings/clientsettings.tsx

@@ -5,6 +5,7 @@ import * as React from "react";
 import * as mobxReact from "mobx-react";
 import * as mobx from "mobx";
 import { boundMethod } from "autobind-decorator";
+import { If } from "tsx-control-statements/components";
 import { GlobalModel, GlobalCommandRunner, RemotesModel, getApi } from "@/models";
 import { Toggle, InlineSettingsTextEdit, SettingsError, Dropdown } from "@/common/elements";
 import { commandRtnHandler, isBlank } from "@/util/util";
@@ -13,6 +14,25 @@ import * as appconst from "@/app/appconst";
 import "./clientsettings.less";
 import { MainView } from "../common/elements/mainview";
 
+class ClientSettingsKeybindings extends React.Component<{}, {}> {
+    componentDidMount() {
+        let clientSettingsViewModel = GlobalModel.clientSettingsViewModel;
+        let keybindManager = GlobalModel.keybindManager;
+        keybindManager.registerKeybinding("mainview", "clientsettings", "generic:cancel", (waveEvent) => {
+            clientSettingsViewModel.closeView();
+            return true;
+        });
+    }
+
+    componentWillUnmount() {
+        GlobalModel.keybindManager.unregisterDomain("clientsettings");
+    }
+
+    render() {
+        return null;
+    }
+}
+
 @mobxReact.observer
 class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hoveredItemId: string }> {
     errorMessage: OV<string> = mobx.observable.box(null, { name: "ClientSettings-errorMessage" });
@@ -168,6 +188,9 @@ class ClientSettingsView extends React.Component<{ model: RemotesModel }, { hove
 
         return (
             <MainView className="clientsettings-view" title="Client Settings" onClose={this.handleClose}>
+                <If condition={!isHidden}>
+                    <ClientSettingsKeybindings></ClientSettingsKeybindings>
+                </If>
                 <div className="content">
                     <div className="settings-field">
                         <div className="settings-label">Term Font Size</div>

src/app/connections/connections.tsx

@@ -14,6 +14,25 @@ import * as util from "@/util/util";
 import "./connections.less";
 import { MainView } from "../common/elements/mainview";
 
+class ConnectionsKeybindings extends React.Component<{}, {}> {
+    componentDidMount() {
+        let connectionViewModel = GlobalModel.connectionViewModel;
+        let keybindManager = GlobalModel.keybindManager;
+        keybindManager.registerKeybinding("mainview", "connections", "generic:cancel", (waveEvent) => {
+            connectionViewModel.closeView();
+            return true;
+        });
+    }
+
+    componentWillUnmount() {
+        GlobalModel.keybindManager.unregisterDomain("connections");
+    }
+
+    render() {
+        return null;
+    }
+}
+
 @mobxReact.observer
 class ConnectionsView extends React.Component<{ model: RemotesModel }, { hoveredItemId: string }> {
     tableRef: React.RefObject<any> = React.createRef();
@@ -127,6 +146,9 @@ class ConnectionsView extends React.Component<{ model: RemotesModel }, { hovered
 
         return (
             <MainView className="connections-view" title="Connections" onClose={this.handleClose}>
+                <If condition={!isHidden}>
+                    <ConnectionsKeybindings></ConnectionsKeybindings>
+                </If>
                 <table
                     className="connections-table"
                     cellSpacing="0"

src/app/history/history.tsx

@@ -169,6 +169,27 @@ class HistoryCmdStr extends React.Component<
     }
 }
 
+class HistoryKeybindings extends React.Component<{}, {}> {
+    @boundMethod
+    componentDidMount() {
+        let historyViewModel = GlobalModel.historyViewModel;
+        let keybindManager = GlobalModel.keybindManager;
+        keybindManager.registerKeybinding("mainview", "history", "generic:cancel", (waveEvent) => {
+            historyViewModel.handleUserClose();
+            return true;
+        });
+    }
+
+    @boundMethod
+    componentWillUnmount() {
+        GlobalModel.keybindManager.unregisterDomain("history");
+    }
+
+    render() {
+        return null;
+    }
+}
+
 @mobxReact.observer
 class HistoryView extends React.Component<{}, {}> {
     tableRef: React.RefObject<any> = React.createRef();
@@ -449,6 +470,9 @@ class HistoryView extends React.Component<{}, {}> {
 
         return (
             <MainView className="history-view" title="History" onClose={this.handleClose}>
+                <If condition={!isHidden}>
+                    <HistoryKeybindings></HistoryKeybindings>
+                </If>
                 <div key="search" className="history-search">
                     <div className="main-search field">
                         <TextField

src/app/sidebar/main.tsx

@@ -141,15 +141,6 @@ class MainSideBar extends React.Component<MainSideBarProps, {}> {
         GlobalCommandRunner.connectionsView();
     }
 
-    @boundMethod
-    handleWebSharingClick(): void {
-        if (GlobalModel.activeMainView.get() == "webshare") {
-            GlobalModel.showSessionView();
-            return;
-        }
-        GlobalModel.showWebShareView();
-    }
-
     @boundMethod
     handleSettingsClick(): void {
         if (GlobalModel.activeMainView.get() == "clientsettings") {

src/app/workspace/workspaceview.tsx

@@ -7,6 +7,7 @@ import * as mobx from "mobx";
 import cn from "classnames";
 import dayjs from "dayjs";
 import localizedFormat from "dayjs/plugin/localizedFormat";
+import { If } from "tsx-control-statements/components";
 import { GlobalModel } from "@/models";
 import { CmdInput } from "./cmdinput/cmdinput";
 import { ScreenView } from "./screen/screenview";
@@ -17,6 +18,66 @@ import "./workspace.less";
 
 dayjs.extend(localizedFormat);
 
+class SessionKeybindings extends React.Component<{}, {}> {
+    componentDidMount() {
+        let keybindManager = GlobalModel.keybindManager;
+        keybindManager.registerKeybinding("mainview", "session", "app:toggleSidebar", (waveEvent) => {
+            GlobalModel.handleToggleSidebar();
+            return true;
+        });
+        keybindManager.registerKeybinding("mainview", "session", "app:newTab", (waveEvent) => {
+            GlobalModel.onNewTab();
+            return true;
+        });
+        keybindManager.registerKeybinding("mainview", "session", "app:closeCurrentTab", (waveEvent) => {
+            GlobalModel.onCloseCurrentTab();
+            return true;
+        });
+        for (let index = 1; index <= 9; index++) {
+            keybindManager.registerKeybinding("mainview", "session", "app:selectTab-" + index, null);
+        }
+        keybindManager.registerKeybinding("mainview", "session", "app:selectTabLeft", (waveEvent) => {
+            GlobalModel.onBracketCmd(-1);
+            return true;
+        });
+        keybindManager.registerKeybinding("mainview", "session", "app:selectTabRight", (waveEvent) => {
+            GlobalModel.onBracketCmd(1);
+            return true;
+        });
+        keybindManager.registerKeybinding("pane", "session", "app:selectLineAbove", (waveEvent) => {
+            GlobalModel.onMetaArrowUp();
+            return true;
+        });
+        keybindManager.registerKeybinding("pane", "session", "app:selectLineBelow", (waveEvent) => {
+            GlobalModel.onMetaArrowDown();
+            return true;
+        });
+        keybindManager.registerKeybinding("pane", "session", "app:restartCommand", (waveEvent) => {
+            GlobalModel.onRestartCommand();
+            return true;
+        });
+        keybindManager.registerKeybinding("pane", "session", "app:restartLastCommand", (waveEvent) => {
+            GlobalModel.onRestartLastCommand();
+            return true;
+        });
+        keybindManager.registerKeybinding("pane", "session", "app:focusSelectedLine", (waveEvent) => {
+            GlobalModel.onFocusSelectedLine();
+            return true;
+        });
+        keybindManager.registerKeybinding("pane", "session", "app:deleteActiveLine", (waveEvent) => {
+            return GlobalModel.handleDeleteActiveLine();
+        });
+    }
+
+    componentWillUnmount() {
+        GlobalModel.keybindManager.unregisterDomain("session");
+    }
+
+    render() {
+        return null;
+    }
+}
+
 @mobxReact.observer
 class WorkspaceView extends React.Component<{}, {}> {
     render() {
@@ -47,6 +108,9 @@ class WorkspaceView extends React.Component<{}, {}> {
                     width: `${window.innerWidth - mainSidebarModel.getWidth()}px`,
                 }}
             >
+                <If condition={!isHidden}>
+                    <SessionKeybindings></SessionKeybindings>
+                </If>
                 <ScreenTabs key={"tabs-" + session.sessionId} session={session} />
                 <ErrorBoundary>
                     <ScreenView key={"screenview-" + session.sessionId} session={session} screen={activeScreen} />

src/electron/emain.ts

@@ -359,59 +359,6 @@ function createMainWindow(clientData: ClientDataType | null): Electron.BrowserWi
         if (input.type != "keyDown") {
             return;
         }
-        const mods = getMods(input);
-        if (checkKeyPressed(waveEvent, "Cmd:t")) {
-            win.webContents.send("t-cmd", mods);
-            e.preventDefault();
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:r")) {
-            e.preventDefault();
-            win.webContents.send("r-cmd", mods);
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:l")) {
-            win.webContents.send("l-cmd", mods);
-            e.preventDefault();
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:w")) {
-            e.preventDefault();
-            win.webContents.send("w-cmd", mods);
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:ArrowUp") || checkKeyPressed(waveEvent, "Cmd:ArrowDown")) {
-            if (checkKeyPressed(waveEvent, "Cmd:ArrowUp")) {
-                win.webContents.send("meta-arrowup");
-            } else {
-                win.webContents.send("meta-arrowdown");
-            }
-            e.preventDefault();
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:PageUp") || checkKeyPressed(waveEvent, "Cmd:PageDown")) {
-            if (checkKeyPressed(waveEvent, "Cmd:PageUp")) {
-                win.webContents.send("meta-pageup");
-            } else {
-                win.webContents.send("meta-pagedown");
-            }
-            e.preventDefault();
-            return;
-        }
-        if (input.code.startsWith("Digit") && input.meta && !input.control) {
-            const digitNum = parseInt(input.code.substring(5));
-            if (isNaN(digitNum) || digitNum < 1 || digitNum > 9) {
-                return;
-            }
-            e.preventDefault();
-            win.webContents.send("digit-cmd", { digit: digitNum }, mods);
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:[") || checkKeyPressed(waveEvent, "Cmd:]")) {
-            const rel = checkKeyPressed(waveEvent, "Cmd:]") ? 1 : -1;
-            win.webContents.send("bracket-cmd", { relative: rel }, mods);
-            e.preventDefault();
-            return;
-        }
     });
     win.webContents.on("will-navigate", shNavHandler);
     win.webContents.on("will-frame-navigate", shFrameNavHandler);

src/electron/preload.js

@@ -21,17 +21,7 @@ contextBridge.exposeInMainWorld("api", {
     installAppUpdate: () => ipcRenderer.send("install-app-update"),
     getAppUpdateStatus: () => ipcRenderer.sendSync("get-app-update-status"),
     onAppUpdateStatus: (callback) => ipcRenderer.on("app-update-status", (_, val) => callback(val)),
-    onTCmd: (callback) => ipcRenderer.on("t-cmd", callback),
-    onLCmd: (callback) => ipcRenderer.on("l-cmd", callback),
-    onWCmd: (callback) => ipcRenderer.on("w-cmd", callback),
-    onRCmd: (callback) => ipcRenderer.on("r-cmd", callback),
     onZoomChanged: (callback) => ipcRenderer.on("zoom-changed", callback),
-    onMetaArrowUp: (callback) => ipcRenderer.on("meta-arrowup", callback),
-    onMetaArrowDown: (callback) => ipcRenderer.on("meta-arrowdown", callback),
-    onMetaPageUp: (callback) => ipcRenderer.on("meta-pageup", callback),
-    onMetaPageDown: (callback) => ipcRenderer.on("meta-pagedown", callback),
-    onBracketCmd: (callback) => ipcRenderer.on("bracket-cmd", callback),
-    onDigitCmd: (callback) => ipcRenderer.on("digit-cmd", callback),
     onMenuItemAbout: (callback) => ipcRenderer.on("menu-item-about", callback),
     contextScreen: (screenOpts, position) => ipcRenderer.send("context-screen", screenOpts, position),
     contextEditMenu: (position, opts) => ipcRenderer.send("context-editmenu", position, opts),

src/models/clientsettingsview.ts

@@ -22,15 +22,6 @@ class ClientSettingsViewModel {
             this.globalModel.activeMainView.set("clientsettings");
         })();
     }
-
-    handleDocKeyDown(e: any): void {
-        const waveEvent = adaptFromReactOrNativeKeyEvent(e);
-        if (checkKeyPressed(waveEvent, "Escape")) {
-            e.preventDefault();
-            this.closeView();
-            return;
-        }
-    }
 }
 
 export { ClientSettingsViewModel };

src/models/connectionsview.ts

@@ -22,15 +22,6 @@ class ConnectionsViewModel {
             this.globalModel.activeMainView.set("connections");
         })();
     }
-
-    handleDocKeyDown(e: any): void {
-        const waveEvent = adaptFromReactOrNativeKeyEvent(e);
-        if (checkKeyPressed(waveEvent, "Escape")) {
-            e.preventDefault();
-            this.closeView();
-            return;
-        }
-    }
 }
 
 export { ConnectionsViewModel };