waveterm/backup
0
0
Fork 0
mirror of https://github.com/wavetermdev/backup.git synced 2026-08-05 13:57:07 -07:00
Code Issues Packages Projects Releases Wiki Activity

fix bug with duplicate ids for lines (now handled with refs)

Browse Source
This commit is contained in:
sawka
2023-03-20 21:37:45 -07:00
parent e5490df56c
commit c695724166
2 changed files with 17 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/linecomps.tsx
+11 -21
View File
@@ -28,10 +28,6 @@ function isBlank(s : string) : boolean {
return (s == null || s == "");
}
function getLineId(line : LineType) : string {
return sprintf("%s-%s", line.screenid, line.lineid);
}
function makeFullRemoteRef(ownerName : string, remoteRef : string, name : string) : string {
if (isBlank(ownerName) && isBlank(name)) {
return remoteRef;
@@ -205,10 +201,10 @@ class LineCmd extends React.Component<{screen : LineContainerModel, line : LineT
this.checkCmdText();
}
// FIXME
scrollIntoView() {
let lineElem = document.getElementById("line-" + getLineId(this.props.line));
lineElem.scrollIntoView({block: "end"});
if (this.lineRef.current != null) {
this.lineRef.current.scrollIntoView({block: "end"});
}
}
@boundMethod
@@ -369,11 +365,6 @@ class LineCmd extends React.Component<{screen : LineContainerModel, line : LineT
})();
}
getLineDomId() : string {
let {line} = this.props;
return "line-" + getLineId(line);
}
isCollapsed() : boolean {
let {renderMode, overrideCollapsed} = this.props;
return (renderMode == "collapsed" && !overrideCollapsed.get());
@@ -424,7 +415,7 @@ class LineCmd extends React.Component<{screen : LineContainerModel, line : LineT
{"collapsed": isCollapsed},
);
return (
<div className={mainDivCn} id={this.getLineDomId()} ref={this.lineRef} data-lineid={line.lineid} data-linenum={line.linenum} data-screenid={line.screenid} style={{height: height}}>
<div className={mainDivCn} ref={this.lineRef} data-lineid={line.lineid} data-linenum={line.linenum} data-screenid={line.screenid} style={{height: height}}>
<LineAvatar line={line} cmd={cmd}/>
</div>
);
@@ -481,7 +472,7 @@ class LineCmd extends React.Component<{screen : LineContainerModel, line : LineT
let cmd = screen.getCmd(line);
if (cmd == null) {
return (
<div className="line line-invalid" id={this.getLineDomId()} ref={this.lineRef} data-lineid={line.lineid} data-linenum={line.linenum} data-screenid={line.screenid}>
<div className="line line-invalid" ref={this.lineRef} data-lineid={line.lineid} data-linenum={line.linenum} data-screenid={line.screenid}>
[cmd not found '{line.cmdid}']
</div>
);
@@ -520,7 +511,7 @@ class LineCmd extends React.Component<{screen : LineContainerModel, line : LineT
}
let rendererType = getRendererType(line);
return (
<div className={mainDivCn} id={"line-" + getLineId(line)}
<div className={mainDivCn}
ref={this.lineRef} onClick={this.handleClick}
data-lineid={line.lineid} data-linenum={line.linenum} data-screenid={line.screenid} data-cmdid={line.cmdid}>
<div key="focus" className={cn("focus-indicator", {"selected": isSelected}, {"active": isSelected && isFocused}, {"fg-focus": isFgFocused})}/>
@@ -666,6 +657,7 @@ class LineText extends React.Component<{screen : LineContainerModel, line : Line
class TerminalRenderer extends React.Component<{screen : LineContainerModel, line : LineType, width : number, staticRender : boolean, visible : OV<boolean>, onHeightChange : () => void, collapsed : boolean}, {}> {
termLoaded : mobx.IObservableValue<boolean> = mobx.observable.box(false, {name: "linecmd-term-loaded"});
elemRef : React.RefObject<any> = React.createRef();
termRef : React.RefObject<any> = React.createRef();
constructor(props) {
super(props);
@@ -731,10 +723,9 @@ class TerminalRenderer extends React.Component<{screen : LineContainerModel, lin
if (cmd == null) {
return;
}
let termId = "term-" + getLineId(line);
let termElem = document.getElementById(termId);
let termElem = this.termRef.current;
if (termElem == null) {
console.log("cannot load terminal, no term elem found", termId);
console.log("cannot load terminal, no term elem found", line);
return;
}
screen.loadTerminalRenderer(termElem, line, cmd, this.props.width);
@@ -746,8 +737,7 @@ class TerminalRenderer extends React.Component<{screen : LineContainerModel, lin
screen.unloadRenderer(line.cmdid);
if (!unmount) {
mobx.action(() => this.termLoaded.set(false))();
let termId = "term-" + getLineId(line);
let termElem = document.getElementById(termId);
let termElem = this.termRef.current;
if (termElem != null) {
termElem.replaceChildren();
}
@@ -781,7 +771,7 @@ class TerminalRenderer extends React.Component<{screen : LineContainerModel, lin
<If condition={!isFocused}>
<div key="term-block" className="term-block" onClick={this.clickTermBlock}></div>
</If>
<div key="term-connectelem" className="terminal-connectelem" id={"term-" + getLineId(line)} data-cmdid={line.cmdid} style={{height: termHeight}}></div>
<div key="term-connectelem" className="terminal-connectelem" ref={this.termRef} data-cmdid={line.cmdid} style={{height: termHeight}}></div>
<If condition={!termLoaded}><div key="term-loading" className="terminal-loading-message">...</div></If>
</div>
src/model.ts
+6
View File
@@ -3202,10 +3202,16 @@ class CommandRunner {
}
switchSession(session : string) {
mobx.action(() => {
GlobalModel.activeMainView.set("session");
})();
GlobalModel.submitCommand("session", null, [session], {"nohist": "1"}, false);
}
switchScreen(screen : string) {
mobx.action(() => {
GlobalModel.activeMainView.set("session");
})();
GlobalModel.submitCommand("screen", null, [screen], {"nohist": "1"}, false);
}