Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Track visible viewlet #12597

Merged
merged 2 commits into from
Jun 23, 2023
Merged

Track visible viewlet #12597

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0e291e5
Track visible views let. Fixes #12589
tsmaeder Jun 7, 2023
ee063f0
Addressed PR comments.
tsmaeder Jun 23, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 15 additions & 3 deletions packages/core/src/browser/shell/application-shell.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1153,9 +1153,11 @@ export class ApplicationShell extends Widget {
tabBar.revealTab(index);
}
}
const panel = this.getAreaPanelFor(newValue);
if (panel instanceof TheiaDockPanel) {
panel.markAsCurrent(newValue.title);
const widget = this.toTrackedStack(newValue.id).pop();
const panel = this.findPanel(widget);
if (panel) {
// if widget was undefined, we wouldn't have gotten a panel back before
panel.markAsCurrent(widget!.title);
}
// Add checks to ensure that the 'sash' for left panel is displayed correctly
if (newValue.node.className === 'p-Widget theia-view-container p-DockPanel-widget') {
Expand Down Expand Up @@ -1734,6 +1736,16 @@ export class ApplicationShell extends Widget {

protected getAreaPanelFor(input: Widget): DockPanel | undefined {
const widget = this.toTrackedStack(input.id).pop();
if (!widget) {
return undefined;
}
return this.findPanel(widget);
}

/**
* Find the shell panel this top-level widget is part of
*/
protected findPanel(widget: Widget | undefined): TheiaDockPanel | undefined {
if (!widget) {
return undefined;
}
Expand Down
137 changes: 55 additions & 82 deletions packages/plugin-ext/src/main/browser/view/plugin-view-registry.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ import { injectable, inject, postConstruct, optional } from '@theia/core/shared/
import {
ApplicationShell, ViewContainer as ViewContainerWidget, WidgetManager, QuickViewService,
ViewContainerIdentifier, ViewContainerTitleOptions, Widget, FrontendApplicationContribution,
StatefulWidget, CommonMenus, BaseWidget, TreeViewWelcomeWidget, codicon, ViewContainerPart
StatefulWidget, CommonMenus, TreeViewWelcomeWidget, codicon, ViewContainerPart, BaseWidget
} from '@theia/core/lib/browser';
import { ViewContainer, View, ViewWelcome, PluginViewType } from '../../../common';
import { PluginSharedStyle } from '../plugin-shared-style';
Expand All @@ -32,12 +32,11 @@ import { Disposable, DisposableCollection } from '@theia/core/lib/common/disposa
import { CommandRegistry } from '@theia/core/lib/common/command';
import { MenuModelRegistry } from '@theia/core/lib/common/menu';
import { Emitter, Event } from '@theia/core/lib/common/event';
import { ContextKeyService } from '@theia/core/lib/browser/context-key-service';
import { ContextKey, ContextKeyService } from '@theia/core/lib/browser/context-key-service';
import { ViewContextKeyService } from './view-context-key-service';
import { PROBLEMS_WIDGET_ID } from '@theia/markers/lib/browser/problem/problem-widget';
import { OutputWidget } from '@theia/output/lib/browser/output-widget';
import { DebugConsoleContribution } from '@theia/debug/lib/browser/console/debug-console-contribution';
import { TERMINAL_WIDGET_FACTORY_ID } from '@theia/terminal/lib/browser/terminal-widget-impl';
import { TreeViewWidget } from './tree-view-widget';
import { SEARCH_VIEW_CONTAINER_ID } from '@theia/search-in-workspace/lib/browser/search-in-workspace-factory';
import { ThemeIcon } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService';
Expand All @@ -46,6 +45,7 @@ import { WebviewWidget, WebviewWidgetIdentifier } from '../webview/webview';
import { CancellationToken } from '@theia/core/lib/common/cancellation';
import { v4 } from 'uuid';
import { nls } from '@theia/core';
import { TheiaDockPanel } from '@theia/core/lib/browser/shell/theia-dock-panel';

export const PLUGIN_VIEW_FACTORY_ID = 'plugin-view';
export const PLUGIN_VIEW_CONTAINER_FACTORY_ID = 'plugin-view-container';
Expand Down Expand Up @@ -103,20 +103,24 @@ export class PluginViewRegistry implements FrontendApplicationContribution {

private readonly webviewViewResolvers = new Map<string, WebviewViewResolver>();

private static readonly ID_MAPPINGS: Map<string, string> = new Map([
// VS Code Viewlets
[EXPLORER_VIEW_CONTAINER_ID, 'workbench.view.explorer'],
[SCM_VIEW_CONTAINER_ID, 'workbench.view.scm'],
[SEARCH_VIEW_CONTAINER_ID, 'workbench.view.search'],
[DebugWidget.ID, 'workbench.view.debug'],
['vsx-extensions-view-container', 'workbench.view.extensions'], // cannot use the id from 'vsx-registry' package becuase of circular dependency
[PROBLEMS_WIDGET_ID, 'workbench.panel.markers'],
[OutputWidget.ID, 'workbench.panel.output'],
[DebugConsoleContribution.options.id, 'workbench.panel.repl'],
// Theia does not have a single terminal widget, but instead each terminal gets its own widget. Therefore "the terminal widget is active" doesnt' make sense in Theia
// [TERMINAL_WIDGET_FACTORY_ID, 'workbench.panel.terminal'],
// [?? , 'workbench.panel.comments'] not sure what this mean: we don't show comments in sidebars nor the bottom
]);

@postConstruct()
protected init(): void {
// VS Code Viewlets
this.trackVisibleWidget(EXPLORER_VIEW_CONTAINER_ID, { viewletId: 'workbench.view.explorer' });
this.trackVisibleWidget(SCM_VIEW_CONTAINER_ID, { viewletId: 'workbench.view.scm' });
this.trackVisibleWidget(SEARCH_VIEW_CONTAINER_ID, { viewletId: 'workbench.view.search' });
this.trackVisibleWidget(DebugWidget.ID, { viewletId: 'workbench.view.debug' });
// TODO workbench.view.extensions - Theia does not have a proper extension view yet

// VS Code Panels
this.trackVisibleWidget(PROBLEMS_WIDGET_ID, { panelId: 'workbench.panel.markers' });
this.trackVisibleWidget(OutputWidget.ID, { panelId: 'workbench.panel.output' });
this.trackVisibleWidget(DebugConsoleContribution.options.id, { panelId: 'workbench.panel.repl' });
this.trackVisibleWidget(TERMINAL_WIDGET_FACTORY_ID, { panelId: 'workbench.panel.terminal' });

// TODO workbench.panel.comments - Theia does not have a proper comments view yet

this.updateFocusedView();
Expand Down Expand Up @@ -179,6 +183,39 @@ export class PluginViewRegistry implements FrontendApplicationContribution {
}
}
});

const hookDockPanelKey = (panel: TheiaDockPanel, key: ContextKey<string>) => {
let toDisposeOnActivate = new DisposableCollection();
panel.onDidChangeCurrent(title => {
toDisposeOnActivate.dispose();
toDisposeOnActivate = new DisposableCollection();
if (title && title.owner instanceof BaseWidget) {
const widget = title.owner;
let value = PluginViewRegistry.ID_MAPPINGS.get(widget.id);
if (!value) {
if (widget.id.startsWith(PLUGIN_VIEW_CONTAINER_FACTORY_ID)) {
value = this.toViewContainerId({ id: widget.id });
}
}
const setKey = () => {
if (widget.isVisible && value) {
key.set(value);
} else {
key.reset();
}
};
toDisposeOnActivate.push(widget.onDidChangeVisibility(() => {
setKey();
}));
setKey();

}
});
};

hookDockPanelKey(this.shell.leftPanelHandler.dockPanel, this.viewContextKeys.activeViewlet);
hookDockPanelKey(this.shell.rightPanelHandler.dockPanel, this.viewContextKeys.activeAuxiliary);
hookDockPanelKey(this.shell.bottomPanel, this.viewContextKeys.activePanel);
}

protected async updateViewWelcomeVisibility(viewId: string): Promise<void> {
Expand Down Expand Up @@ -813,66 +850,8 @@ export class PluginViewRegistry implements FrontendApplicationContribution {
};
}

protected trackVisibleWidget(factoryId: string, view: PluginViewRegistry.VisibleView): void {
this.doTrackVisibleWidget(this.widgetManager.tryGetWidget(factoryId), view);
this.widgetManager.onDidCreateWidget(event => {
if (factoryId === event.factoryId) {
const { widget } = event;
this.doTrackVisibleWidget(widget, view);
}
});
}

protected doTrackVisibleWidget(widget: Widget | undefined, view: PluginViewRegistry.VisibleView): void {
if (widget instanceof BaseWidget) {
widget.onDidChangeVisibility(() => this.updateVisibleWidget(widget, view));
const toDispose = new DisposableCollection(
Disposable.create(() => this.updateVisibleWidget(widget, view)),
this.shell.onDidChangeActiveWidget(() => {
if (this.shell.activeWidget === widget) {
this.updateVisibleWidget(widget, view);
}
})
);
if (view.sideArea !== undefined) {
toDispose.pushAll([
this.shell.onDidAddWidget(w => {
if (w === widget) {
this.updateVisibleWidget(widget, view);
}
})
]);
}
widget.disposed.connect(() => toDispose.dispose());
}
}

protected readonly visiblePanels = new Set<string>();
protected readonly visibleViewlets = new Set<string>();

protected updateVisibleWidget(widget: BaseWidget, view: PluginViewRegistry.VisibleView): void {
const visibleViews = 'viewletId' in view ? this.visibleViewlets : this.visiblePanels;
const viewId = 'viewletId' in view ? view.viewletId : view.panelId;
const visibleView = 'viewletId' in view ? this.viewContextKeys.activeViewlet : this.viewContextKeys.activePanel;
visibleViews.delete(viewId);
if (this.isVisibleWidget(widget, view)) {
visibleView.set(viewId);
visibleViews.add(viewId);
} else {
const lastVisibleView = [...visibleViews.values()][visibleViews.size - 1];
visibleView.set(lastVisibleView);
}
}

protected isVisibleWidget(widget: BaseWidget, view: PluginViewRegistry.VisibleView): boolean {
if (widget.isDisposed || !widget.isVisible) {
return false;
}
if (view.sideArea === undefined) {
return true;
}
const area = this.shell.getAreaFor(widget);
return view.sideArea === (area === 'left' || area === 'right');
protected isVisibleWidget(widget: Widget): boolean {
return !widget.isDisposed && widget.isVisible;
}

protected updateFocusedView(): void {
Expand All @@ -883,11 +862,5 @@ export class PluginViewRegistry implements FrontendApplicationContribution {
this.viewContextKeys.focusedView.reset();
}
}

}
export namespace PluginViewRegistry {
export type VisibleView = ({ viewletId: string } | { panelId: string }) & {
/** `undefined` means any area */
sideArea?: boolean
};
}

23 changes: 8 additions & 15 deletions packages/plugin-ext/src/main/browser/view/view-context-key-service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@ import { ContextKey, ContextKeyService } from '@theia/core/lib/browser/context-k

@injectable()
export class ViewContextKeyService {

protected _view: ContextKey<string>;
get view(): ContextKey<string> {
return this._view;
Expand All @@ -30,30 +29,23 @@ export class ViewContextKeyService {
return this._viewItem;
}

// for the next three keys, see https://code.visualstudio.com/api/references/when-clause-contexts#visible-view-container-when-clause-context

protected _activeViewlet: ContextKey<string>;
/**
* Viewlet is a tab in the left area in VS Code. Active means visible in this context.
*
* In VS Code there can be only one visible viewlet at any time.
* It is not true for Theia, since views can be layed-out again to different areas.
* So only last visible view will be an active viewlet.
*/
get activeViewlet(): ContextKey<string> {
return this._activeViewlet;
}

protected _activePanel: ContextKey<string>;
/**
* Panel is a tab in the bottom area in VS Code. Active means visible in this context.
*
* In VS Code there can be only one visible panel at any time.
* It is not true for Theia, since views can be layed-out again to different areas.
* So only last visible view will be an active panel.
*/
get activePanel(): ContextKey<string> {
return this._activePanel;
}

protected _activeAuxiliary: ContextKey<string>;
get activeAuxiliary(): ContextKey<string> {
return this._activeAuxiliary;
}

protected _focusedView: ContextKey<string>;
get focusedView(): ContextKey<string> {
return this._focusedView;
Expand All @@ -68,6 +60,7 @@ export class ViewContextKeyService {
this._viewItem = this.contextKeyService.createKey('viewItem', '');
this._activeViewlet = this.contextKeyService.createKey('activeViewlet', '');
this._activePanel = this.contextKeyService.createKey('activePanel', '');
this._activeAuxiliary = this.contextKeyService.createKey('activeAuxiliary', '');
this._focusedView = this.contextKeyService.createKey('focusedView', '');
}

Expand Down