[vscode] fix #5853: support when closure for views

- a view visibility should be auto toggled based on `when` view closure
- if a user explicitly hides a view, then auto toggling should be disabled
- and it should be enabled again when a user explicitly unhides the view

Signed-off-by: Anton Kosyakov <anton.kosyakov@typefox.io>

packages/core/src/browser/context-key-service.ts

@@ -15,6 +15,7 @@
  ********************************************************************************/
 
 import { injectable } from 'inversify';
+import { Emitter } from '../common/event';
 
 export interface ContextKey<T> {
     set(value: T | undefined): void;
@@ -30,8 +31,19 @@ export namespace ContextKey {
     });
 }
 
+export interface ContextKeyChangeEvent {
+    affects(keys: Set<string>): boolean;
+}
+
 @injectable()
 export class ContextKeyService {
+
+    protected readonly onDidChangeEmitter = new Emitter<ContextKeyChangeEvent>();
+    readonly onDidChange = this.onDidChangeEmitter.event;
+    protected fireDidChange(event: ContextKeyChangeEvent): void {
+        this.onDidChangeEmitter.fire(event);
+    }
+
     createKey<T>(key: string, defaultValue: T | undefined): ContextKey<T> {
         return ContextKey.None;
     }

packages/core/src/browser/view-container.ts

@@ -412,7 +412,7 @@ export class ViewContainer extends BaseWidget implements StatefulWidget, Applica
             execute: () => {
                 const toHide = find(this.containerLayout.iter(), part => part.id === toRegister.id);
                 if (toHide) {
-                    this.toggleVisibility(toHide);
+                    toHide.setHidden(!toHide.isHidden);
                 }
             },
             isToggled: () => {
@@ -469,15 +469,6 @@ export class ViewContainer extends BaseWidget implements StatefulWidget, Applica
         return `${this.id}:toggle-visibility`;
     }
 
-    protected toggleVisibility(part: ViewContainerPart): void {
-        if (part.canHide) {
-            part.setHidden(!part.isHidden);
-            if (!part.isHidden) {
-                part.collapsed = false;
-            }
-        }
-    }
-
     protected moveBefore(toMovedId: string, moveBeforeThisId: string): void {
         const parts = this.getParts();
         const toMoveIndex = parts.findIndex(part => part.id === toMovedId);
@@ -519,7 +510,6 @@ export class ViewContainer extends BaseWidget implements StatefulWidget, Applica
             return undefined;
         }
         part.setHidden(false);
-        part.collapsed = false;
         return part;
     }
 
@@ -697,6 +687,16 @@ export class ViewContainerPart extends BaseWidget {
         this.collapsedEmitter.fire(collapsed);
     }
 
+    setHidden(hidden: boolean): void {
+        if (!this.canHide) {
+            return;
+        }
+        super.setHidden(hidden);
+        if (!this.isHidden) {
+            this.collapsed = false;
+        }
+    }
+
     get canHide(): boolean {
         return this.options.canHide === undefined || this.options.canHide;
     }

packages/monaco/src/browser/monaco-context-key-service.ts

@@ -14,7 +14,7 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { injectable, inject } from 'inversify';
+import { injectable, inject, postConstruct } from 'inversify';
 import { ContextKeyService, ContextKey } from '@theia/core/lib/browser/context-key-service';
 
 @injectable()
@@ -23,6 +23,15 @@ export class MonacoContextKeyService extends ContextKeyService {
     @inject(monaco.contextKeyService.ContextKeyService)
     protected readonly contextKeyService: monaco.contextKeyService.ContextKeyService;
 
+    @postConstruct()
+    protected init(): void {
+        this.contextKeyService.onDidChangeContext(e =>
+            this.fireDidChange({
+                affects: keys => e.affectsSome(keys)
+            })
+        );
+    }
+
     createKey<T>(key: string, defaultValue: T | undefined): ContextKey<T> {
         return this.contextKeyService.createKey(key, defaultValue);
     }

packages/monaco/src/typings/monaco/index.d.ts

@@ -1102,12 +1102,17 @@ declare module monaco.contextKeyService {
 
     export interface IContext { }
 
+    export interface IContextKeyChangeEvent {
+        affectsSome(keys: Set<string>): boolean;
+    }
+
     export class ContextKeyService implements IContextKeyService {
         constructor(configurationService: monaco.services.IConfigurationService);
         createScoped(target?: HTMLElement): IContextKeyService;
         getContext(target?: HTMLElement): IContext;
         createKey<T>(key: string, defaultValue: T | undefined): IContextKey<T>;
         contextMatchesRules(rules: monaco.contextkey.ContextKeyExpr | undefined): boolean;
+        onDidChangeContext: monaco.IEvent<IContextKeyChangeEvent>;
     }
 
 }

packages/plugin-ext/src/common/plugin-protocol.ts

@@ -88,6 +88,7 @@ export interface PluginPackageViewContainer {
 export interface PluginPackageView {
     id: string;
     name: string;
+    when?: string;
 }
 
 export interface PluginPackageCommand {
@@ -497,6 +498,7 @@ export interface ViewContainer {
 export interface View {
     id: string;
     name: string;
+    when?: string;
 }
 
 export interface PluginCommand {

packages/plugin-ext/src/hosted/node/scanners/scanner-theia.ts

@@ -286,7 +286,8 @@ export class TheiaPluginScanner implements PluginScanner {
     private readView(rawView: PluginPackageView): View {
         const result: View = {
             id: rawView.id,
-            name: rawView.name
+            name: rawView.name,
+            when: rawView.when
         };
 
         return result;

packages/plugin-ext/src/main/browser/view/plugin-view-registry.ts

@@ -33,6 +33,7 @@ import { CommandRegistry } from '@theia/core/lib/common/command';
 import { MenuModelRegistry } from '@theia/core/lib/common/menu';
 import { QuickViewService } from '@theia/core/lib/browser/quick-view-service';
 import { Emitter } from '@theia/core/lib/common/event';
+import { ContextKeyService } from '@theia/core/lib/browser/context-key-service';
 
 export const PLUGIN_VIEW_FACTORY_ID = 'plugin-view';
 export const PLUGIN_VIEW_CONTAINER_FACTORY_ID = 'plugin-view-container';
@@ -70,6 +71,9 @@ export class PluginViewRegistry implements FrontendApplicationContribution {
     @inject(QuickViewService)
     protected readonly quickView: QuickViewService;
 
+    @inject(ContextKeyService)
+    protected readonly contextKeyService: ContextKeyService;
+
     protected readonly onDidExpandViewEmitter = new Emitter<string>();
     readonly onDidExpandView = this.onDidExpandViewEmitter.event;
 
@@ -105,6 +109,48 @@ export class PluginViewRegistry implements FrontendApplicationContribution {
             iconClass: 'theia-plugin-test-tab-icon',
             closeable: true
         });
+        this.contextKeyService.onDidChange(e => {
+            for (const [, view] of this.views.values()) {
+                if (view.when === undefined) {
+                    continue;
+                }
+                if (e.affects(new Set([view.when]))) {
+                    this.updateViewVisibility(view.id);
+                }
+            }
+        });
+    }
+
+    protected async updateViewVisibility(viewId: string): Promise<void> {
+        const viewInfo = this.views.get(viewId);
+        if (!viewInfo) {
+            return;
+        }
+        const [viewContainerId] = viewInfo;
+        const viewContainer = await this.getPluginViewContainer(viewContainerId);
+        if (!viewContainer) {
+            return;
+        }
+        const widget = await this.getView(viewId);
+        if (!widget) {
+            return;
+        }
+        const part = viewContainer.getPartFor(widget);
+        if (!part) {
+            return;
+        }
+        widget.updateViewVisibility(() =>
+            part.setHidden(!this.isViewVisible(viewId))
+        );
+    }
+
+    protected isViewVisible(viewId: string): boolean {
+        const viewInfo = this.views.get(viewId);
+        if (!viewInfo) {
+            return false;
+        }
+        const [, view] = viewInfo;
+        return view.when === undefined || this.contextKeyService.match(view.when);
     }
 
     registerViewContainer(location: string, viewContainer: ViewContainer): void {
@@ -255,11 +301,15 @@ export class PluginViewRegistry implements FrontendApplicationContribution {
             const widget = await this.widgetManager.getOrCreateWidget<PluginViewWidget>(PLUGIN_VIEW_FACTORY_ID, identifier);
             if (containerWidget.getTrackableWidgets().indexOf(widget) === -1) {
                 containerWidget.addWidget(widget, {
-                    initiallyCollapsed: !!containerWidget.getParts().length
+                    initiallyCollapsed: !!containerWidget.getParts().length,
+                    initiallyHidden: !this.isViewVisible(viewId)
                 });
             }
             const part = containerWidget.getPartFor(widget);
             if (part) {
+                // if a view is explicilty hidden then suppress updating visibility based on `when` closure
+                part.onVisibilityChanged(() => widget.suppressUpdateViewVisibility = part.isHidden);
+
                 const tryFireOnDidExpandView = () => {
                     if (!part.collapsed && part.isVisible) {
                         toFire.dispose();
@@ -275,9 +325,21 @@ export class PluginViewRegistry implements FrontendApplicationContribution {
         }
     }
 
-    protected getPluginViewContainer(viewContainerId: string): Promise<ViewContainerWidget | undefined> {
+    protected async getPluginViewContainer(viewContainerId: string): Promise<ViewContainerWidget | undefined> {
+        if (viewContainerId === 'explorer') {
+            return this.widgetManager.getWidget<ViewContainerWidget>(EXPLORER_VIEW_CONTAINER_ID);
+        }
+        if (viewContainerId === 'scm') {
+            return this.widgetManager.getWidget<ViewContainerWidget>(SCM_VIEW_CONTAINER_ID);
+        }
+        if (viewContainerId === 'debug') {
+            const debug = await this.widgetManager.getWidget(DebugWidget.ID);
+            if (debug instanceof DebugWidget) {
+                return debug['sessionWidget']['viewContainer'];
+            }
+        }
         const identifier = this.toViewContainerIdentifier(viewContainerId);
-        return this.widgetManager.getWidget(PLUGIN_VIEW_CONTAINER_FACTORY_ID, identifier);
+        return this.widgetManager.getWidget<ViewContainerWidget>(PLUGIN_VIEW_CONTAINER_FACTORY_ID, identifier);
     }
 
     async initWidgets(): Promise<void> {

packages/plugin-ext/src/main/browser/view/plugin-view-widget.ts

@@ -78,6 +78,24 @@ export class PluginViewWidget extends Panel implements StatefulWidget {
         }
     }
 
+    protected _suppressUpdateViewVisibility = false;
+    set suppressUpdateViewVisibility(suppressUpdateViewVisibility: boolean) {
+        this._suppressUpdateViewVisibility = !this.updatingViewVisibility && suppressUpdateViewVisibility;
+    }
+
+    protected updatingViewVisibility = false;
+    updateViewVisibility(cb: () => void): void {
+        if (this._suppressUpdateViewVisibility) {
+            return;
+        }
+        try {
+            this.updatingViewVisibility = true;
+            cb();
+        } finally {
+            this.updatingViewVisibility = false;
+        }
+    }
+
 }
 export namespace PluginViewWidget {
     export interface State {