fix: update monitor output after widget show

Closes #1724

Signed-off-by: Akos Kitta <a.kitta@arduino.cc>
This commit is contained in:
Akos Kitta 2023-03-03 09:17:16 +01:00 committed by Akos Kitta
parent fa9777e529
commit 24dc0bbc88
2 changed files with 12 additions and 9 deletions

View File

@ -117,6 +117,11 @@ export class MonitorWidget extends ReactWidget {
(this.focusNode || this.node).focus(); (this.focusNode || this.node).focus();
} }
protected override onAfterShow(msg: Message): void {
super.onAfterShow(msg);
this.update();
}
protected onFocusResolved = (element: HTMLElement | undefined) => { protected onFocusResolved = (element: HTMLElement | undefined) => {
if (this.closing || !this.isAttached) { if (this.closing || !this.isAttached) {
return; return;

View File

@ -17,7 +17,7 @@ export class SerialMonitorOutput extends React.Component<
* Do not touch it. It is used to be able to "follow" the serial monitor log. * Do not touch it. It is used to be able to "follow" the serial monitor log.
*/ */
protected toDisposeBeforeUnmount = new DisposableCollection(); protected toDisposeBeforeUnmount = new DisposableCollection();
private listRef: React.RefObject<any>; private listRef: React.RefObject<List>;
constructor(props: Readonly<SerialMonitorOutput.Props>) { constructor(props: Readonly<SerialMonitorOutput.Props>) {
super(props); super(props);
@ -34,12 +34,10 @@ export class SerialMonitorOutput extends React.Component<
<List <List
className="serial-monitor-messages" className="serial-monitor-messages"
height={this.props.height} height={this.props.height}
itemData={ itemData={{
{
lines: this.state.lines, lines: this.state.lines,
timestamp: this.state.timestamp, timestamp: this.state.timestamp,
} as any }}
}
itemCount={this.state.lines.length} itemCount={this.state.lines.length}
itemSize={18} itemSize={18}
width={'100%'} width={'100%'}
@ -93,11 +91,11 @@ export class SerialMonitorOutput extends React.Component<
this.toDisposeBeforeUnmount.dispose(); this.toDisposeBeforeUnmount.dispose();
} }
scrollToBottom = ((): void => { private readonly scrollToBottom = () => {
if (this.listRef.current && this.props.monitorModel.autoscroll) { if (this.listRef.current && this.props.monitorModel.autoscroll) {
this.listRef.current.scrollToItem(this.state.lines.length, 'end'); this.listRef.current.scrollToItem(this.state.lines.length, 'end');
} }
}).bind(this); };
} }
const _Row = ({ const _Row = ({