implement a pdf renderer (fix emain shFrameNavHandler to allow it)

* fix lightmode selction color

* fix styles on remote conn view

BUILD.md

@@ -53,12 +53,6 @@ Install modules (we use yarn):
 yarn
 ```
 
-Electron also requires specific builds of node_modules to work (because Electron embeds a specific node.js version that might not match your development node.js version). We use a special electron command to cross-compile those modules:
-
-```
-scripthaus run electron-rebuild
-```
-
 ## Running WebPack
 
 We use webpack to build both the React and Electron App Wrapper code. They are both run together using:

README.md

@@ -20,7 +20,7 @@ Wave isn't just another terminal emulator; it's a rethink on how terminals are b
 -   CodeEdit, to edit local and remote files with a VSCode-like inline editor
 -   AI Integration with ChatGPT (or ChatGPT compatible APIs) to help write commands and get answers inline
 
-![WaveTerm Screenshot](./assets/wave-screenshot.jpeg)
+![WaveTerm Screenshot](./assets/wave-screenshot.png)
 
 ## Installation
 

acknowledgements/README.md

@@ -11,9 +11,9 @@ The license disclaimers for the backend are generated using the [go-licenses](ht
 
 The license disclaimers for the frontend are generated using the [`yarn licenses` tool](https://classic.yarnpkg.com/lang/en/docs/cli/licenses/). This outputs to the file [`frontend.md`](./disclaimers/frontend.md).
 
-These three disclaimer files linked above will be periodically regenerated to reflect new dependencies.
+These disclaimer files linked above will be periodically regenerated to reflect new dependencies.
 
-The [`scripthaus.md` file](../scripthaus.md) contains scripts to genrate the disclaimers and package them. To manually generate the disclaimers, run the following from the repository root directory:
+The [`scripthaus.md` file](../scripthaus.md) contains scripts to generate the disclaimers and package them. To manually generate the disclaimers, run the following from the repository root directory:
 
 ```bash
 scripthaus run generate-license-disclaimers

assets/default-keybindings.json

@@ -39,6 +39,14 @@
       "command": "app:openTabSearchModal",
       "keys": ["Cmd:p"]
     },
+    {
+      "command": "app:openConnectionsView", 
+      "keys": []
+    },
+    {
+      "command": "app:openSettingsView", 
+      "keys": []
+    },
     {
       "command": "app:newTab",
       "keys": ["Cmd:t"]

public/themes/default.css

@@ -220,6 +220,4 @@
     --modal-header-bottom-border-color: rgba(241, 246, 243, 0.15);
 
     --logo-button-hover-bg-color: #1e1e1e;
-
-    --xterm-viewport-border-color: rgba(241, 246, 243, 0.15);
 }

public/themes/light.css

@@ -74,6 +74,4 @@
     --toggle-thumb-color: var(--app-bg-color);
 
     --logo-button-hover-bg-color: #f0f0f0;
-
-    --xterm-viewport-border-color: rgba(0, 0, 0, 0.3);
 }

public/themes/term-default.css

@@ -3,7 +3,7 @@
 
 :root {
     /* 
-     * term colors (16 + 2) form the base terminal theme 
+     * term colors (16 + 5) form the base terminal theme 
      * for consistency these colors should be used by plugins/applications
      */
     --term-black: #000000;
@@ -27,4 +27,5 @@
     --term-cmdtext: #ffffff;
     --term-foreground: #d3d7cf;
     --term-background: #000000;
+    --term-selection-background: #ffffff40;
 }

public/themes/term-light.css

@@ -6,4 +6,5 @@
     --term-foreground: #000000;
     --term-background: #fefefe;
     --term-cmdtext: #000000;
+    --term-selection-background: #00000018;
 }

src/app/common/modals/viewremoteconndetail.less

@@ -90,25 +90,12 @@
                     margin-top: 5px;
                     overflow-x: auto;
                     overflow-y: hidden;
+                    border: 1px solid var(--app-border-color);
+                    border-radius: 6px;
+                    padding: 6px 10px;
 
                     .terminal-connectelem {
                         height: 163px !important; // Needed to override plugin height
-
-                        .xterm-viewport {
-                            display: flex;
-                            padding: 6px 10px;
-                            gap: 8px;
-                            align-items: flex-start;
-                            align-self: stretch;
-                            border-radius: 6px;
-                            border: 1px solid var(--xterm-viewport-border-color);
-                            background: #080a08;
-                            height: 163px !important; // Needed to override plugin height
-                        }
-
-                        .xterm-screen {
-                            padding: 10px;
-                        }
                     }
                 }
             }

src/app/line/renderer/basicrenderer.tsx

@@ -1,276 +0,0 @@
-// Copyright 2023, Command Line Inc.
-// SPDX-License-Identifier: Apache-2.0
-
-import * as React from "react";
-import * as mobxReact from "mobx-react";
-import * as mobx from "mobx";
-
-import { debounce } from "throttle-debounce";
-import * as util from "@/util/util";
-import { GlobalModel } from "@/models";
-
-class SimpleBlobRendererModel {
-    context: RendererContext;
-    opts: RendererOpts;
-    isDone: OV<boolean>;
-    api: RendererModelContainerApi;
-    savedHeight: number;
-    loading: OV<boolean>;
-    loadError: OV<string> = mobx.observable.box(null, {
-        name: "renderer-loadError",
-    });
-    lineState: LineStateType;
-    ptyData: PtyDataType;
-    ptyDataSource: (termContext: TermContextUnion) => Promise<PtyDataType>;
-    dataBlob: Blob;
-    readOnly: boolean;
-    notFound: boolean;
-
-    initialize(params: RendererModelInitializeParams): void {
-        this.loading = mobx.observable.box(true, { name: "renderer-loading" });
-        this.isDone = mobx.observable.box(params.isDone, {
-            name: "renderer-isDone",
-        });
-        this.context = params.context;
-        this.opts = params.opts;
-        this.api = params.api;
-        this.lineState = params.lineState;
-        this.savedHeight = params.savedHeight;
-        this.ptyDataSource = params.ptyDataSource;
-        if (this.isDone.get()) {
-            setTimeout(() => this.reload(0), 10);
-        }
-    }
-
-    dispose(): void {
-        return;
-    }
-
-    giveFocus(): void {
-        return;
-    }
-
-    updateOpts(update: RendererOptsUpdate): void {
-        Object.assign(this.opts, update);
-    }
-
-    updateHeight(newHeight: number): void {
-        if (this.savedHeight != newHeight) {
-            this.savedHeight = newHeight;
-            this.api.saveHeight(newHeight);
-        }
-    }
-
-    setIsDone(): void {
-        if (this.isDone.get()) {
-            return;
-        }
-        mobx.action(() => {
-            this.isDone.set(true);
-        })();
-        this.reload(0);
-    }
-
-    reload(delayMs: number): void {
-        mobx.action(() => {
-            this.loading.set(true);
-        })();
-        if (delayMs == 0) {
-            this.reload_noDelay();
-        } else {
-            setTimeout(() => {
-                this.reload_noDelay();
-            }, delayMs);
-        }
-    }
-
-    reload_noDelay(): void {
-        let source = this.lineState["prompt:source"] || "pty";
-        if (source == "pty") {
-            this.reloadPtyData();
-        } else if (source == "file") {
-            this.reloadFileData();
-        } else {
-            mobx.action(() => {
-                this.loadError.set("error: invalid load source: " + source);
-            })();
-        }
-    }
-
-    reloadFileData(): void {
-        // todo add file methods to API, so we don't have a GlobalModel dependency here!
-        let path = this.lineState["prompt:file"];
-        if (util.isBlank(path)) {
-            mobx.action(() => {
-                this.loadError.set("renderer has file source, but no prompt:file specified");
-            })();
-            return;
-        }
-        let rtnp = GlobalModel.readRemoteFile(this.context.screenId, this.context.lineId, path);
-        rtnp.then((file) => {
-            this.notFound = (file as any).notFound;
-            this.readOnly = (file as any).readOnly;
-            this.dataBlob = file;
-            mobx.action(() => {
-                this.loading.set(false);
-                this.loadError.set(null);
-            })();
-        }).catch((e) => {
-            mobx.action(() => {
-                this.loadError.set("error loading file data: " + e);
-            })();
-        });
-    }
-
-    reloadPtyData(): void {
-        this.readOnly = true;
-        let rtnp = this.ptyDataSource(this.context);
-        if (rtnp == null) {
-            console.log("no promise returned from ptyDataSource (simplerenderer)", this.context);
-            return;
-        }
-        rtnp.then((ptydata) => {
-            this.ptyData = ptydata;
-            this.dataBlob = new Blob([this.ptyData.data]);
-            mobx.action(() => {
-                this.loading.set(false);
-                this.loadError.set(null);
-            })();
-        }).catch((e) => {
-            mobx.action(() => {
-                this.loadError.set("error loading data: " + e);
-            })();
-        });
-    }
-
-    receiveData(pos: number, data: Uint8Array, reason?: string): void {
-        // this.dataBuf.receiveData(pos, data, reason);
-    }
-}
-
-@mobxReact.observer
-class SimpleBlobRenderer extends React.Component<
-    {
-        rendererContainer: RendererContainerType;
-        lineId: string;
-        plugin: RendererPluginType;
-        onHeightChange: () => void;
-        initParams: RendererModelInitializeParams;
-        scrollToBringIntoViewport: () => void;
-        isSelected: boolean;
-        shouldFocus: boolean;
-    },
-    {}
-> {
-    model: SimpleBlobRendererModel;
-    wrapperDivRef: React.RefObject<any> = React.createRef();
-    rszObs: ResizeObserver;
-    updateHeight_debounced: (newHeight: number) => void;
-
-    constructor(props: any) {
-        super(props);
-        let { rendererContainer, lineId, plugin, initParams } = this.props;
-        this.model = new SimpleBlobRendererModel();
-        this.model.initialize(initParams);
-        rendererContainer.registerRenderer(lineId, this.model);
-        this.updateHeight_debounced = debounce(1000, this.updateHeight.bind(this));
-    }
-
-    updateHeight(newHeight: number): void {
-        this.model.updateHeight(newHeight);
-    }
-
-    handleResize(entries: ResizeObserverEntry[]): void {
-        if (this.model.loading.get()) {
-            return;
-        }
-        if (this.props.onHeightChange) {
-            this.props.onHeightChange();
-        }
-        if (!this.model.loading.get() && this.wrapperDivRef.current != null) {
-            let height = this.wrapperDivRef.current.offsetHeight;
-            this.updateHeight_debounced(height);
-        }
-    }
-
-    checkRszObs() {
-        if (this.rszObs != null) {
-            return;
-        }
-        if (this.wrapperDivRef.current == null) {
-            return;
-        }
-        this.rszObs = new ResizeObserver(this.handleResize.bind(this));
-        this.rszObs.observe(this.wrapperDivRef.current);
-    }
-
-    componentDidMount() {
-        this.checkRszObs();
-    }
-
-    componentWillUnmount() {
-        let { rendererContainer, lineId } = this.props;
-        rendererContainer.unloadRenderer(lineId);
-        if (this.rszObs != null) {
-            this.rszObs.disconnect();
-            this.rszObs = null;
-        }
-    }
-
-    componentDidUpdate() {
-        this.checkRszObs();
-    }
-
-    render() {
-        let { plugin } = this.props;
-        let model = this.model;
-        if (model.loadError.get() != null) {
-            let errorText = model.loadError.get();
-            let height = this.model.savedHeight;
-            return (
-                <div ref={this.wrapperDivRef} style={{ minHeight: height, fontSize: model.opts.termFontSize }}>
-                    <div className="load-error-text">ERROR: {errorText}</div>
-                </div>
-            );
-        }
-        if (model.loading.get()) {
-            let height = this.model.savedHeight;
-            return (
-                <div
-                    ref={this.wrapperDivRef}
-                    className="renderer-loading"
-                    style={{ minHeight: height, fontSize: model.opts.termFontSize }}
-                >
-                    loading content <i className="fa fa-ellipsis fa-fade" />
-                </div>
-            );
-        }
-        let Comp = plugin.simpleComponent;
-        if (Comp == null) {
-            <div ref={this.wrapperDivRef}>(no component found in plugin)</div>;
-        }
-        let { festate, cmdstr, exitcode } = this.props.initParams.rawCmd;
-        return (
-            <div ref={this.wrapperDivRef} className="sr-wrapper">
-                <Comp
-                    cwd={festate.cwd}
-                    cmdstr={cmdstr}
-                    exitcode={exitcode}
-                    data={model.dataBlob as ExtBlob}
-                    readOnly={model.readOnly}
-                    notFound={model.notFound}
-                    lineState={model.lineState}
-                    context={model.context}
-                    opts={model.opts}
-                    savedHeight={model.savedHeight}
-                    scrollToBringIntoViewport={this.props.scrollToBringIntoViewport}
-                    isSelected={this.props.isSelected}
-                    shouldFocus={this.props.shouldFocus}
-                    rendererApi={model.api}
-                />
-            </div>
-        );
-    }
-}
-
-export { SimpleBlobRendererModel, SimpleBlobRenderer };

src/electron/emain.ts

@@ -303,16 +303,21 @@ function shFrameNavHandler(event: Electron.Event<Electron.WebContentsWillFrameNa
         // only use this handler to process iframe events (non-iframe events go to shNavHandler)
         return;
     }
-    event.preventDefault();
     const url = event.url;
     console.log(`frame-navigation url=${url} frame=${event.frame.name}`);
     if (event.frame.name == "webview") {
         // "webview" links always open in new window
         // this will *not* effect the initial load because srcdoc does not count as an electron navigation
         console.log("open external, frameNav", url);
+        event.preventDefault();
         electron.shell.openExternal(url);
         return;
     }
+    if (event.frame.name == "pdfview" && url.startsWith("blob:file:///")) {
+        // allowed
+        return;
+    }
+    event.preventDefault();
     console.log("frame navigation canceled");
 }
 
@@ -355,13 +360,6 @@ function createMainWindow(clientData: ClientDataType | null): Electron.BrowserWi
             e.preventDefault();
             return;
         }
-        if (checkKeyPressed(waveEvent, "Cmd:i")) {
-            e.preventDefault();
-            if (!input.alt) {
-                win.webContents.send("i-cmd", mods);
-            }
-            return;
-        }
         if (checkKeyPressed(waveEvent, "Cmd:r")) {
             e.preventDefault();
             win.webContents.send("r-cmd", mods);
@@ -377,16 +375,6 @@ function createMainWindow(clientData: ClientDataType | null): Electron.BrowserWi
             win.webContents.send("w-cmd", mods);
             return;
         }
-        if (checkKeyPressed(waveEvent, "Cmd:h")) {
-            win.webContents.send("h-cmd", mods);
-            e.preventDefault();
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:p")) {
-            win.webContents.send("p-cmd", mods);
-            e.preventDefault();
-            return;
-        }
         if (checkKeyPressed(waveEvent, "Cmd:ArrowUp") || checkKeyPressed(waveEvent, "Cmd:ArrowDown")) {
             if (checkKeyPressed(waveEvent, "Cmd:ArrowUp")) {
                 win.webContents.send("meta-arrowup");
@@ -405,7 +393,7 @@ function createMainWindow(clientData: ClientDataType | null): Electron.BrowserWi
             e.preventDefault();
             return;
         }
-        if (input.code.startsWith("Digit") && input.meta) {
+        if (input.code.startsWith("Digit") && input.meta && !input.control) {
             const digitNum = parseInt(input.code.substring(5));
             if (isNaN(digitNum) || digitNum < 1 || digitNum > 9) {
                 return;

src/electron/preload.js

@@ -21,11 +21,8 @@ contextBridge.exposeInMainWorld("api", {
     getAppUpdateStatus: () => ipcRenderer.sendSync("get-app-update-status"),
     onAppUpdateStatus: (callback) => ipcRenderer.on("app-update-status", (_, val) => callback(val)),
     onTCmd: (callback) => ipcRenderer.on("t-cmd", callback),
-    onICmd: (callback) => ipcRenderer.on("i-cmd", callback),
     onLCmd: (callback) => ipcRenderer.on("l-cmd", callback),
-    onHCmd: (callback) => ipcRenderer.on("h-cmd", callback),
     onWCmd: (callback) => ipcRenderer.on("w-cmd", callback),
-    onPCmd: (callback) => ipcRenderer.on("p-cmd", callback),
     onRCmd: (callback) => ipcRenderer.on("r-cmd", callback),
     onZoomChanged: (callback) => ipcRenderer.on("zoom-changed", callback),
     onMetaArrowUp: (callback) => ipcRenderer.on("meta-arrowup", callback),

src/models/model.ts

@@ -36,6 +36,7 @@ import { Cmd } from "./cmd";
 import { GlobalCommandRunner } from "./global";
 import { clearMonoFontCache, getMonoFontSize } from "@/util/textmeasure";
 import type { TermWrap } from "@/plugins/terminal/term";
+import * as util from "@/util/util";
 
 type SWLinePtr = {
     line: LineType;
@@ -143,6 +144,9 @@ class Model {
         });
         this.ws.reconnect();
         this.keybindManager = new KeybindManager();
+        this.readConfigKeybindings();
+        this.initSystemKeybindings();
+        this.initAppKeybindings();
         this.inputModel = new InputModel(this);
         this.pluginsModel = new PluginsModel(this);
         this.bookmarksModel = new BookmarksModel(this);
@@ -171,18 +175,8 @@ class Model {
             }
             return fontSize;
         });
-        this.keybindManager.registerKeybinding("system", "electron", "any", (waveEvent) => {
-            if (this.keybindManager.checkKeyPressed(waveEvent, "system:toggleDeveloperTools")) {
-                getApi().toggleDeveloperTools();
-                return true;
-            }
-            return false;
-        });
         getApi().onTCmd(this.onTCmd.bind(this));
-        getApi().onICmd(this.onICmd.bind(this));
         getApi().onLCmd(this.onLCmd.bind(this));
-        getApi().onHCmd(this.onHCmd.bind(this));
-        getApi().onPCmd(this.onPCmd.bind(this));
         getApi().onWCmd(this.onWCmd.bind(this));
         getApi().onRCmd(this.onRCmd.bind(this));
         getApi().onZoomChanged(this.onZoomChanged.bind(this));
@@ -208,6 +202,68 @@ class Model {
         };
     }
 
+    readConfigKeybindings() {
+        const url = new URL(this.getBaseHostPort() + "/config/keybindings.json");
+        let prtn = fetch(url, { method: "get", body: null, headers: this.getFetchHeaders() });
+        prtn.then((resp) => {
+            if (resp.status == 404) {
+                return [];
+            } else if (!resp.ok) {
+                util.handleNotOkResp(resp, url);
+            }
+            return resp.json();
+        }).then((userKeybindings) => {
+            this.keybindManager.setUserKeybindings(userKeybindings);
+        });
+    }
+
+    initSystemKeybindings() {
+        this.keybindManager.registerKeybinding("system", "electron", "system:toggleDeveloperTools", (waveEvent) => {
+            getApi().toggleDeveloperTools();
+            return true;
+        });
+    }
+
+    initAppKeybindings() {
+        for (let index = 1; index <= 9; index++) {
+            this.keybindManager.registerKeybinding("app", "model", "app:selectWorkspace-" + index, (waveEvent) => {
+                this.onSwitchSessionCmd(index);
+                return true;
+            });
+        }
+
+        this.keybindManager.registerKeybinding("app", "model", "app:focusCmdInput", (waveEvent) => {
+            console.log("focus cmd input callback");
+            this.onFocusCmdInputPressed();
+            return true;
+        });
+
+        this.keybindManager.registerKeybinding("app", "model", "app:bookmarkActiveLine", (waveEvent) => {
+            this.onBookmarkViewPressed();
+            return true;
+        });
+
+        this.keybindManager.registerKeybinding("app", "model", "app:openHistory", (waveEvent) => {
+            this.onOpenHistoryPressed();
+            return true;
+        });
+
+        this.keybindManager.registerKeybinding("app", "model", "app:openTabSearchModal", (waveEvent) => {
+            this.onOpenTabSearchModalPressed();
+            return true;
+        });
+
+        this.keybindManager.registerKeybinding("app", "model", "app:openConnectionsView", (waveEvent) => {
+            this.onOpenConnectionsViewPressed();
+            return true;
+        });
+
+        this.keybindManager.registerKeybinding("app", "model", "app:openSettingsView", (waveEvent) => {
+            this.onOpenSettingsViewPressed();
+            return true;
+        });
+    }
+
     static getInstance(): Model {
         if (!(window as any).GlobalModel) {
             (window as any).GlobalModel = new Model();
@@ -449,56 +505,49 @@ class Model {
         }
         if (this.activeMainView.get() == "bookmarks") {
             this.bookmarksModel.handleDocKeyDown(e);
-            return;
         }
         if (this.activeMainView.get() == "history") {
             this.historyViewModel.handleDocKeyDown(e);
-            return;
         }
         if (this.activeMainView.get() == "connections") {
             this.historyViewModel.handleDocKeyDown(e);
-            return;
         }
         if (this.activeMainView.get() == "clientsettings") {
             this.historyViewModel.handleDocKeyDown(e);
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Escape")) {
-            e.preventDefault();
-            if (this.activeMainView.get() == "webshare") {
-                this.showSessionView();
+        } else {
+            if (checkKeyPressed(waveEvent, "Escape")) {
+                e.preventDefault();
+                if (this.activeMainView.get() == "webshare") {
+                    this.showSessionView();
+                    return;
+                }
+                if (this.clearModals()) {
+                    return;
+                }
+                const inputModel = this.inputModel;
+                inputModel.toggleInfoMsg();
+                if (inputModel.inputMode.get() != null) {
+                    inputModel.resetInputMode();
+                }
                 return;
             }
-            if (this.clearModals()) {
-                return;
-            }
-            const inputModel = this.inputModel;
-            inputModel.toggleInfoMsg();
-            if (inputModel.inputMode.get() != null) {
-                inputModel.resetInputMode();
-            }
-            return;
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:b")) {
-            e.preventDefault();
-            GlobalCommandRunner.bookmarksView();
-        }
-        if (this.activeMainView.get() == "session" && checkKeyPressed(waveEvent, "Cmd:Ctrl:s")) {
-            e.preventDefault();
-            const activeScreen = this.getActiveScreen();
-            if (activeScreen != null) {
-                const isSidebarOpen = activeScreen.isSidebarOpen();
-                if (isSidebarOpen) {
-                    GlobalCommandRunner.screenSidebarClose();
-                } else {
-                    GlobalCommandRunner.screenSidebarOpen();
+            if (this.activeMainView.get() == "session" && checkKeyPressed(waveEvent, "Cmd:Ctrl:s")) {
+                e.preventDefault();
+                const activeScreen = this.getActiveScreen();
+                if (activeScreen != null) {
+                    const isSidebarOpen = activeScreen.isSidebarOpen();
+                    if (isSidebarOpen) {
+                        GlobalCommandRunner.screenSidebarClose();
+                    } else {
+                        GlobalCommandRunner.screenSidebarOpen();
+                    }
                 }
             }
-        }
-        if (checkKeyPressed(waveEvent, "Cmd:d")) {
-            const ranDelete = this.deleteActiveLine();
-            if (ranDelete) {
-                e.preventDefault();
+            if (checkKeyPressed(waveEvent, "Cmd:d")) {
+                const ranDelete = this.deleteActiveLine();
+                if (ranDelete) {
+                    e.preventDefault();
+                }
             }
         }
         this.keybindManager.processKeyEvent(e, waveEvent);
@@ -698,8 +747,22 @@ class Model {
         GlobalCommandRunner.createNewScreen();
     }
 
-    onICmd(e: any, mods: KeyModsType) {
-        this.inputModel.giveFocus();
+    onBookmarkViewPressed() {
+        GlobalCommandRunner.bookmarksView();
+    }
+
+    onFocusCmdInputPressed() {
+        if (this.activeMainView.get() != "session") {
+            mobx.action(() => {
+                this.activeMainView.set("session");
+                setTimeout(() => {
+                    // allows for the session view to load
+                    this.inputModel.giveFocus();
+                }, 100);
+            })();
+        } else {
+            this.inputModel.giveFocus();
+        }
     }
 
     onLCmd(e: any, mods: KeyModsType) {
@@ -709,14 +772,22 @@ class Model {
         }
     }
 
-    onHCmd(e: any, mods: KeyModsType) {
+    onOpenHistoryPressed() {
         this.historyViewModel.reSearch();
     }
 
-    onPCmd(e: any, mods: KeyModsType) {
+    onOpenTabSearchModalPressed() {
         this.modalsModel.pushModal(appconst.TAB_SWITCHER);
     }
 
+    onOpenConnectionsViewPressed() {
+        this.activeMainView.set("connections");
+    }
+
+    onOpenSettingsViewPressed() {
+        this.activeMainView.set("clientsettings");
+    }
+
     getFocusedLine(): LineFocusType {
         if (this.inputModel.hasFocus()) {
             return { cmdInputFocus: true };
@@ -783,11 +854,12 @@ class Model {
         }
     }
 
+    onSwitchSessionCmd(digit: number) {
+        console.log("switching to ", digit);
+        GlobalCommandRunner.switchSession(String(digit));
+    }
+
     onDigitCmd(e: any, arg: { digit: number }, mods: KeyModsType) {
-        if (mods.meta && mods.ctrl) {
-            GlobalCommandRunner.switchSession(String(arg.digit));
-            return;
-        }
         GlobalCommandRunner.switchScreen(String(arg.digit));
     }
 
@@ -1298,7 +1370,7 @@ class Model {
         };
         /** 
         console.log(
-            "CMD",
+            "CMD"
             pk.metacmd + (pk.metasubcmd != null ? ":" + pk.metasubcmd : ""),
             pk.args,
             pk.kwargs,
@@ -1511,12 +1583,15 @@ class Model {
         return remote.remotecanonicalname;
     }
 
-    readRemoteFile(screenId: string, lineId: string, path: string): Promise<ExtFile> {
-        const urlParams = {
+    readRemoteFile(screenId: string, lineId: string, path: string, mimetype?: string): Promise<ExtFile> {
+        const urlParams: Record<string, string> = {
             screenid: screenId,
             lineid: lineId,
             path: path,
         };
+        if (mimetype != null) {
+            urlParams["mimetype"] = mimetype;
+        }
         const usp = new URLSearchParams(urlParams);
         const url = new URL(this.getBaseHostPort() + "/api/read-file?" + usp.toString());
         const fetchHeaders = this.getFetchHeaders();
@@ -1526,7 +1601,7 @@ class Model {
             .then((resp) => {
                 if (!resp.ok) {
                     badResponseStr = sprintf(
-                        "Bad fetch response for /api/read-file: %d %s",
+                        "Bad fetch response for /apiread-file: %d %s",
                         resp.status,
                         resp.statusText
                     );

src/plugins/pdf/pdf.less

@@ -0,0 +1,7 @@
+.pdf-renderer {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    padding-top: var(--termpad);
+}

src/plugins/pdf/pdf.tsx

@@ -0,0 +1,49 @@
+// Copyright 2024, Command Line Inc.
+// SPDX-License-Identifier: Apache-2.0
+
+import * as React from "react";
+import * as mobx from "mobx";
+import * as mobxReact from "mobx-react";
+
+import "./pdf.less";
+
+@mobxReact.observer
+class SimplePdfRenderer extends React.Component<
+    { data: ExtBlob; context: RendererContext; opts: RendererOpts; savedHeight: number },
+    {}
+> {
+    objUrl: string = null;
+
+    componentWillUnmount() {
+        if (this.objUrl != null) {
+            URL.revokeObjectURL(this.objUrl);
+        }
+    }
+
+    render() {
+        let dataBlob = this.props.data;
+        if (dataBlob == null || dataBlob.notFound) {
+            return (
+                <div className="pdf-renderer" style={{ fontSize: this.props.opts.termFontSize }}>
+                    <div className="load-error-text">
+                        ERROR: file {dataBlob && dataBlob.name ? JSON.stringify(dataBlob.name) : ""} not found
+                    </div>
+                </div>
+            );
+        }
+        if (this.objUrl == null) {
+            const pdfBlob = new File([dataBlob], "test.pdf", { type: "application/pdf" });
+            this.objUrl = URL.createObjectURL(pdfBlob);
+        }
+        const opts = this.props.opts;
+        const maxHeight = opts.maxSize.height - 10;
+        const maxWidth = opts.maxSize.width - 10;
+        return (
+            <div className="pdf-renderer">
+                <iframe src={this.objUrl} width={maxWidth} height={maxHeight} name="pdfview" />
+            </div>
+        );
+    }
+}
+
+export { SimplePdfRenderer };

src/plugins/plugins.ts

@@ -7,6 +7,7 @@ import { SourceCodeRenderer } from "./code/code";
 import { SimpleMustacheRenderer } from "./mustache/mustache";
 import { CSVRenderer } from "./csv/csv";
 import { OpenAIRenderer, OpenAIRendererModel } from "./openai/openai";
+import { SimplePdfRenderer } from "./pdf/pdf";
 import { isBlank } from "@/util/util";
 import { sprintf } from "sprintf-js";
 
@@ -78,6 +79,16 @@ const PluginConfigs: RendererPluginType[] = [
         mimeTypes: ["image/*"],
         simpleComponent: SimpleImageRenderer,
     },
+    {
+        name: "pdf",
+        rendererType: "simple",
+        heightType: "pixels",
+        dataType: "blob",
+        collapseType: "hide",
+        globalCss: null,
+        mimeTypes: ["application/pdf"],
+        simpleComponent: SimplePdfRenderer,
+    },
 ];
 
 class PluginModelClass {