From fe6ea99291c177a1ba9278b99c1918611f624bbf Mon Sep 17 00:00:00 2001 From: Anton Kosyakov Date: Fri, 10 May 2019 06:41:12 +0000 Subject: [PATCH] widget lifecycle fixes + make apis protected Signed-off-by: Anton Kosyakov --- .../src/browser/console-content-widget.tsx | 16 ++++++++-------- packages/core/src/browser/tree/tree-widget.tsx | 13 ++++++++++--- packages/core/src/browser/widgets/widget.ts | 18 ++++++++++++------ 3 files changed, 30 insertions(+), 17 deletions(-) diff --git a/packages/console/src/browser/console-content-widget.tsx b/packages/console/src/browser/console-content-widget.tsx index 250727c971ce5..178921b104b25 100644 --- a/packages/console/src/browser/console-content-widget.tsx +++ b/packages/console/src/browser/console-content-widget.tsx @@ -14,11 +14,11 @@ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0 ********************************************************************************/ +import { Message } from '@phosphor/messaging'; import { interfaces, Container, injectable } from 'inversify'; import { MenuPath, MessageType } from '@theia/core'; import { TreeProps } from '@theia/core/lib/browser/tree'; import { TreeSourceNode } from '@theia/core/lib/browser/source-tree'; -import { Message } from '@theia/core/lib/browser'; import { SourceTreeWidget, TreeElementNode } from '@theia/core/lib/browser/source-tree'; import { ConsoleItem } from './console-session'; @@ -27,14 +27,14 @@ export class ConsoleContentWidget extends SourceTreeWidget { static CONTEXT_MENU: MenuPath = ['console-context-menu']; - private _shouldScrollToEnd: boolean = true; + protected _shouldScrollToEnd = true; - set shouldScrollToEnd(value: boolean) { - this._shouldScrollToEnd = value; + protected set shouldScrollToEnd(shouldScrollToEnd: boolean) { + this._shouldScrollToEnd = shouldScrollToEnd; this.shouldScrollToRow = this._shouldScrollToEnd; } - get shouldScrollToEnd() { + protected get shouldScrollToEnd() { return this._shouldScrollToEnd; } @@ -50,9 +50,9 @@ export class ConsoleContentWidget extends SourceTreeWidget { protected onAfterAttach(msg: Message): void { super.onAfterAttach(msg); - this.toDispose.push(this.onScrollUp(() => this.shouldScrollToEnd = false)); - this.toDispose.push(this.onScrollYReachEnd(() => this.shouldScrollToEnd = true)); - this.toDispose.push(this.model.onChanged(() => this.revealLastOutputIfNeeded())); + this.toDisposeOnDetach.push(this.onScrollUp(() => this.shouldScrollToEnd = false)); + this.toDisposeOnDetach.push(this.onScrollYReachEnd(() => this.shouldScrollToEnd = true)); + this.toDisposeOnDetach.push(this.model.onChanged(() => this.revealLastOutputIfNeeded())); } protected revealLastOutputIfNeeded(): void { diff --git a/packages/core/src/browser/tree/tree-widget.tsx b/packages/core/src/browser/tree/tree-widget.tsx index a78fd138b2099..06b0945b7a2d3 100644 --- a/packages/core/src/browser/tree/tree-widget.tsx +++ b/packages/core/src/browser/tree/tree-widget.tsx @@ -135,7 +135,7 @@ export class TreeWidget extends ReactWidget implements StatefulWidget { @inject(SelectionService) protected readonly selectionService: SelectionService; - protected shouldScrollToRow: boolean = true; + protected shouldScrollToRow = true; constructor( @inject(TreeProps) readonly props: TreeProps, @@ -243,11 +243,18 @@ export class TreeWidget extends ReactWidget implements StatefulWidget { protected scrollToRow: number | undefined; protected updateScrollToRow(updateOptions?: TreeWidget.ForceUpdateOptions): void { + this.scrollToRow = this.getScrollToRow(); + this.forceUpdate(updateOptions); + } + + protected getScrollToRow(): number | undefined { + if (!this.shouldScrollToRow) { + return undefined; + } const selected = this.model.selectedNodes; const node: TreeNode | undefined = selected.find(SelectableTreeNode.hasFocus) || selected[0]; const row = node && this.rows.get(node.id); - this.scrollToRow = !this.shouldScrollToRow ? undefined : (row && row.index); - this.forceUpdate(updateOptions); + return row && row.index; } protected readonly updateDecorations = debounce(() => this.doUpdateDecorations(), 150); diff --git a/packages/core/src/browser/widgets/widget.ts b/packages/core/src/browser/widgets/widget.ts index 8fbe23479ca72..45fb427e84dc8 100644 --- a/packages/core/src/browser/widgets/widget.ts +++ b/packages/core/src/browser/widgets/widget.ts @@ -14,6 +14,8 @@ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0 ********************************************************************************/ +// tslint:disable:no-any + import { injectable, decorate, unmanaged } from 'inversify'; import { Widget } from '@phosphor/widgets'; import { Message } from '@phosphor/messaging'; @@ -37,15 +39,19 @@ export const FOCUS_CLASS = 'theia-mod-focus'; @injectable() export class BaseWidget extends Widget { - protected readonly toDispose = new DisposableCollection(); - protected readonly toDisposeOnDetach = new DisposableCollection(); - protected scrollBar?: PerfectScrollbar; - protected scrollOptions?: PerfectScrollbar.Options; protected readonly onScrollYReachEndEmitter = new Emitter(); readonly onScrollYReachEnd: Event = this.onScrollYReachEndEmitter.event; protected readonly onScrollUpEmitter = new Emitter(); readonly onScrollUp: Event = this.onScrollUpEmitter.event; + protected readonly toDispose = new DisposableCollection( + this.onScrollYReachEndEmitter, + this.onScrollUpEmitter + ); + protected readonly toDisposeOnDetach = new DisposableCollection(); + protected scrollBar?: PerfectScrollbar; + protected scrollOptions?: PerfectScrollbar.Options; + dispose(): void { if (this.isDisposed) { return; @@ -85,8 +91,8 @@ export class BaseWidget extends Widget { const container = await this.getScrollContainer(); container.style.overflow = 'hidden'; this.scrollBar = new PerfectScrollbar(container, this.scrollOptions); - container.addEventListener('ps-y-reach-end', () => { this.onScrollYReachEndEmitter.fire(undefined); }); - container.addEventListener('ps-scroll-up', () => { this.onScrollUpEmitter.fire(undefined); }); + this.toDisposeOnDetach.push(addEventListener(container, 'ps-y-reach-end', () => { this.onScrollYReachEndEmitter.fire(undefined); })); + this.toDisposeOnDetach.push(addEventListener(container, 'ps-scroll-up', () => { this.onScrollUpEmitter.fire(undefined); })); this.toDisposeOnDetach.push(Disposable.create(() => { if (this.scrollBar) { this.scrollBar.destroy();