diff --git a/src/linecomps.tsx b/src/linecomps.tsx index 9681ef004..2bfb18f00 100644 --- a/src/linecomps.tsx +++ b/src/linecomps.tsx @@ -152,21 +152,22 @@ class SmallLineAvatar extends React.Component<{ line: LineType; cmd: Cmd; onRigh let isComment = line.linetype == "text"; let icon: string = null; let iconTitle = null; - let iconColor = "auto"; + let iconColor = null; if (isComment) { icon = "fa-comment"; iconTitle = "comment"; } else if (status == "done") { icon = exitcode === 0 ? "fa-check" : "fa-xmark"; iconTitle = exitcode === 0 ? "success" : "fail"; - iconColor = exitcode === 0 ? "auto" : "red"; + iconColor = exitcode === 0 ? "color-green" : "color-red"; } else if (status == "hangup" || status == "error") { icon = "fa-triangle-exclamation"; iconTitle = status; - iconColor = "yellow"; + iconColor = "color-yellow"; } else if (status == "running" || "detached") { - icon = "fa-rotate"; + icon = "fa-rotate fa-spin"; iconTitle = "running"; + iconColor = "color-green"; } else { icon = "fa-square-question"; iconTitle = "unknown"; @@ -177,7 +178,7 @@ class SmallLineAvatar extends React.Component<{ line: LineType; cmd: Cmd; onRigh className={cn("simple-line-status", "status-" + status, rtnstate ? "has-rtnstate" : null)} > {lineNumStr} - + ); } @@ -676,6 +677,15 @@ class LineCmd extends React.Component< { name: "computed-isFocused" } ) .get(); + let shouldCmdFocus = mobx + .computed( + () => { + let screenFocusType = screen.getFocusType(); + return isSelected && screenFocusType == "cmd"; + }, + { name: "computed-shouldCmdFocus" } + ) + .get(); let isStatic = staticRender; let isRunning = cmd.isRunning(); let isExpanded = this.isCmdExpanded.get(); @@ -768,6 +778,7 @@ class LineCmd extends React.Component< initParams={this.makeRendererModelInitializeParams()} scrollToBringIntoViewport={this.scrollToBringIntoViewport} isSelected={isSelected} + shouldFocus={shouldCmdFocus} /> diff --git a/src/lines.less b/src/lines.less index b6639c22e..a537d4d51 100644 --- a/src/lines.less +++ b/src/lines.less @@ -22,7 +22,15 @@ } .line .load-error-text { - color: #cc0000; + .mono-font(); + color: @term-red; + padding-top: 5px; +} + +.line .renderer-loading { + .mono-font(); + color: @term-white; + padding-top: 5px; } .line.line-cmd { @@ -221,6 +229,18 @@ font-weight: bold; } } + + .color-red { + color: @term-red; + } + + .color-green { + color: @term-bright-green; + } + + .color-yellow { + color: @term-bright-yellow; + } } &.top-border { diff --git a/src/main.tsx b/src/main.tsx index 32b7d6f46..59ae2f09d 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1793,16 +1793,6 @@ class MainSideBar extends React.Component<{}, {}> { -

Playbooks

  • diff --git a/src/simplerenderer.tsx b/src/simplerenderer.tsx index 7a0b80eaa..9353c942b 100644 --- a/src/simplerenderer.tsx +++ b/src/simplerenderer.tsx @@ -20,6 +20,7 @@ import type { TermContextUnion, RendererContainerType, } from "./types"; +import * as T from "./types"; import { PacketDataBuffer } from "./ptydata"; import { debounce, throttle } from "throttle-debounce"; import * as util from "./util"; @@ -177,6 +178,7 @@ class SimpleBlobRenderer extends React.Component< initParams: RendererModelInitializeParams; scrollToBringIntoViewport: () => void; isSelected: boolean; + shouldFocus: boolean; }, {} > { @@ -243,18 +245,23 @@ class SimpleBlobRenderer extends React.Component< let { plugin } = this.props; let model = this.model; if (model.loadError.get() != null) { + let errorText = model.loadError.get(); let height = this.model.savedHeight; return ( -
    -
    ERROR: {model.loadError.get()}
    +
    +
    ERROR: {errorText}
    ); } if (model.loading.get()) { let height = this.model.savedHeight; return ( -
    - ... +
    + loading content
    ); } @@ -262,7 +269,6 @@ class SimpleBlobRenderer extends React.Component< if (Comp == null) {
    (no component found in plugin)
    ; } - let simpleModel = model as SimpleBlobRendererModel; let { festate, cmdstr, exitcode } = this.props.initParams.rawCmd; return (
    @@ -270,15 +276,16 @@ class SimpleBlobRenderer extends React.Component< cwd={festate.cwd} cmdstr={cmdstr} exitcode={exitcode} - data={simpleModel.dataBlob} - readOnly={simpleModel.readOnly} - notFound={simpleModel.notFound} - lineState={simpleModel.lineState} - context={simpleModel.context} - opts={simpleModel.opts} - savedHeight={simpleModel.savedHeight} + data={model.dataBlob} + 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} />
    ); diff --git a/src/types.ts b/src/types.ts index 3571ff306..dd914848c 100644 --- a/src/types.ts +++ b/src/types.ts @@ -413,6 +413,7 @@ type SimpleBlobRendererComponent = React.ComponentType<{ readOnly?: boolean; notFound?: boolean; isSelected?: boolean; + shouldFocus?: boolean; cmdstr?: string; cwd?: string; exitcode?: number; diff --git a/src/view/code.tsx b/src/view/code.tsx index 6ee57f642..a00d381f8 100644 --- a/src/view/code.tsx +++ b/src/view/code.tsx @@ -26,6 +26,7 @@ class SourceCodeRenderer extends React.Component< scrollToBringIntoViewport: () => void; lineState: LineStateType; isSelected: boolean; + shouldFocus: boolean; }, { code: string; @@ -70,12 +71,21 @@ class SourceCodeRenderer extends React.Component< const code = SourceCodeRenderer.codeCache.get(this.cacheKey); if (code) { this.setState({ code, isClosed: this.props.lineState["prompt:closed"] }); - } else + } else { this.props.data.text().then((code) => { this.originalData = code; this.setState({ code, isClosed: this.props.lineState["prompt:closed"] }); SourceCodeRenderer.codeCache.set(this.cacheKey, code); }); + } + } + + componentDidUpdate(prevProps: any): void { + if (!prevProps.shouldFocus && this.props.shouldFocus) { + if (this.monacoEditor) { + this.monacoEditor.focus(); + } + } } setInitialLanguage = (editor) => { @@ -125,6 +135,9 @@ class SourceCodeRenderer extends React.Component< this.doClose(); } }); + if (this.props.shouldFocus) { + this.monacoEditor.focus(); + } }; handleLanguageChange = (event) => {