From 5beb4f18bcaf81eb3affe12f0e8a0c34b2ab2551 Mon Sep 17 00:00:00 2001 From: DMYTRO ZHARKOV Date: Tue, 18 Jan 2022 14:12:54 +0100 Subject: [PATCH] Test Signed-off-by: DMYTRO ZHARKOV --- .../components/+preferences/terminal.tsx | 21 +- .../components/dock/terminal.store.ts | 192 ++++++++++++++++++ .../components/dock/terminal/terminal.ts | 8 + 3 files changed, 219 insertions(+), 2 deletions(-) create mode 100644 src/renderer/components/dock/terminal.store.ts diff --git a/src/renderer/components/+preferences/terminal.tsx b/src/renderer/components/+preferences/terminal.tsx index cd0a0be1fa..d5c207112c 100644 --- a/src/renderer/components/+preferences/terminal.tsx +++ b/src/renderer/components/+preferences/terminal.tsx @@ -25,9 +25,13 @@ import { SubTitle } from "../layout/sub-title"; import { Input, InputValidators } from "../input"; import { isWindows } from "../../../common/vars"; import { Switch } from "../switch"; +import { TerminalStore } from "../dock/terminal.store"; +import { dockStore, TabKind } from "../dock/dock.store"; export const Terminal = observer(() => { const userStore = UserStore.getInstance(); + const terminalStore = TerminalStore.getInstance(); + const { tabs, selectedTab, isOpen } = dockStore; const [terminalSettings, setTerminalSettings] = React.useState({ shell: userStore.shell || "", terminalFontSize: userStore.terminalConfig.fontSize, @@ -77,7 +81,17 @@ export const Terminal = observer(() => { ...terminalSettings, terminalFontSize: Number(value), })} - onBlur={() => userStore.terminalConfig.fontSize = terminalSettings.terminalFontSize} + onBlur={() => { + userStore.terminalConfig.fontSize = terminalSettings.terminalFontSize; + console.log("tabs", tabs); + console.log("selectedTab", selectedTab); + + if (selectedTab?.kind === TabKind.TERMINAL && isOpen) { + terminalStore.reconnect(selectedTab.id); + } + + terminalStore.reconnectTerminals(); + }} />
@@ -90,7 +104,10 @@ export const Terminal = observer(() => { ...terminalSettings, terminalFontFamily: value.toString(), })} - onBlur={() => userStore.terminalConfig.fontFamily = terminalSettings.terminalFontFamily} + onBlur={() => { + userStore.terminalConfig.fontFamily = terminalSettings.terminalFontFamily; + terminalStore.reconnectTerminals(); + }} />
); diff --git a/src/renderer/components/dock/terminal.store.ts b/src/renderer/components/dock/terminal.store.ts new file mode 100644 index 0000000000..d291250b8d --- /dev/null +++ b/src/renderer/components/dock/terminal.store.ts @@ -0,0 +1,192 @@ +/** + * Copyright (c) 2021 OpenLens Authors + * + * Permission is hereby granted, free of charge, to any person obtaining a copy of + * this software and associated documentation files (the "Software"), to deal in + * the Software without restriction, including without limitation the rights to + * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of + * the Software, and to permit persons to whom the Software is furnished to do so, + * subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS + * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR + * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER + * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN + * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. + */ + +import { autorun, observable, when } from "mobx"; +import { autoBind, noop, Singleton } from "../../utils"; +import { Terminal } from "./terminal"; +import { TerminalApi, TerminalChannels } from "../../api/terminal-api"; +import { dockStore, DockTab, DockTabCreateSpecific, TabId, TabKind } from "./dock.store"; +import { WebSocketApiState } from "../../api/websocket-api"; +import { Notifications } from "../notifications"; + +export interface ITerminalTab extends DockTab { + node?: string; // activate node shell mode +} + +export function createTerminalTab(tabParams: DockTabCreateSpecific = {}) { + return dockStore.createTab({ + title: `Terminal`, + ...tabParams, + kind: TabKind.TERMINAL, + }); +} + +export class TerminalStore extends Singleton { + protected terminals = new Map(); + protected connections = observable.map(); + + constructor() { + super(); + autoBind(this); + + // connect active tab + autorun(() => { + const { selectedTab, isOpen } = dockStore; + + if (selectedTab?.kind === TabKind.TERMINAL && isOpen) { + this.connect(selectedTab.id); + } + }); + // disconnect closed tabs + autorun(() => { + const currentTabs = dockStore.tabs.map(tab => tab.id); + + for (const [tabId] of this.connections) { + if (!currentTabs.includes(tabId)) this.disconnect(tabId); + } + }); + } + + connect(tabId: TabId) { + if (this.isConnected(tabId)) { + return; + } + const tab: ITerminalTab = dockStore.getTabById(tabId); + const api = new TerminalApi({ + id: tabId, + node: tab.node, + }); + const terminal = new Terminal(tabId, api); + + this.connections.set(tabId, api); + this.terminals.set(tabId, terminal); + + api.connect(); + } + + disconnect(tabId: TabId) { + if (!this.isConnected(tabId)) { + return; + } + const terminal = this.terminals.get(tabId); + const terminalApi = this.connections.get(tabId); + + terminal.destroy(); + terminalApi.destroy(); + this.connections.delete(tabId); + this.terminals.delete(tabId); + } + + reconnect(tabId: TabId) { + this.connections.get(tabId)?.connect(); + } + + isConnected(tabId: TabId) { + return Boolean(this.connections.get(tabId)); + } + + isDisconnected(tabId: TabId) { + return this.connections.get(tabId)?.readyState === WebSocketApiState.CLOSED; + } + + reconnectTerminals() { + console.log("Reconencting connections", this.connections); + console.log("Reconencting terminals", this.terminals); + this.connections.forEach(cn => { + console.log("cn", cn); + }); + } + + async sendCommand(command: string, options: { enter?: boolean; newTab?: boolean; tabId?: TabId } = {}) { + const { enter, newTab, tabId } = options; + + if (tabId) { + dockStore.selectTab(tabId); + } + + if (newTab) { + const tab = createTerminalTab(); + + await when(() => this.connections.has(tab.id)); + + const shellIsReady = when(() => this.connections.get(tab.id).isReady); + const notifyVeryLong = setTimeout(() => { + shellIsReady.cancel(); + Notifications.info( + "If terminal shell is not ready please check your shell init files, if applicable.", + { + timeout: 4_000, + }, + ); + }, 10_000); + + await shellIsReady.catch(noop); + clearTimeout(notifyVeryLong); + } + + const terminalApi = this.connections.get(dockStore.selectedTabId); + + if (terminalApi) { + if (enter) { + command += "\r"; + } + + terminalApi.sendMessage({ + type: TerminalChannels.STDIN, + data: command, + }); + } else { + console.warn("The selected tab is does not have a connection. Cannot send command.", { tabId: dockStore.selectedTabId, command }); + } + } + + getTerminal(tabId: TabId) { + return this.terminals.get(tabId); + } + + reset() { + [...this.connections].forEach(([tabId]) => { + this.disconnect(tabId); + }); + } +} + +/** + * @deprecated use `TerminalStore.getInstance()` instead + */ +export const terminalStore = new Proxy({}, { + get(target, p) { + if (p === "$$typeof") { + return "TerminalStore"; + } + + const ts = TerminalStore.getInstance(); + const res = (ts as any)?.[p]; + + if (typeof res === "function") { + return function (...args: any[]) { + return res.apply(ts, args); + }; + } + + return res; + }, +}) as TerminalStore; diff --git a/src/renderer/components/dock/terminal/terminal.ts b/src/renderer/components/dock/terminal/terminal.ts index 72ec2b00d3..6b34b2b41f 100644 --- a/src/renderer/components/dock/terminal/terminal.ts +++ b/src/renderer/components/dock/terminal/terminal.ts @@ -196,6 +196,14 @@ export class Terminal { } }; + setFontSize = (size: number) => { + this.xterm.options.fontSize = size; + }; + + setFontFamily = (family: string) => { + this.xterm.options.fontFamily = family; + }; + keyHandler = (evt: KeyboardEvent): boolean => { const { code, ctrlKey, metaKey } = evt;