Remove some widgets from the IDE like explorer, search etc

Hello everyone, I am buidling something over Theia. I need to remove some widgets from the IDE like file explorer, search etc. Can someone please guide me how can I remove these?

[original thread by Hemkaran Raghav]

[Dominique Rochefort]

Hi @hemkaran, I am looking for the exact same thing. I have noticed that some buttons in the activity bar are part of @theia/core. My idea was to build an extension to override contribution points that are responsible for creating these buttons. I have looked in the Theia codebase, but I’m not clear which contribution point I should be looking for. Any guidance would be appreciated.

[Dominique Rochefort]

[Hemkaran Raghav]

After checking codebase of Theia, I found the WidgetManager in @theia/core package. I am using this to remove the widget. For example, to explorer/navigator widget. I am using this code.

import { WidgetManager } from '@theia/core/lib/browser';
import { FILE_NAVIGATOR_ID } from '@theia/navigator/lib/browser';
import { CommandRegistry } from '@theia/core/lib/common';

const fileNavigatorWidget = await this.widgetManager.getWidget(FILE_NAVIGATOR_ID);
if(fileNavigatorWidget && fileNavigatorWidget.isVisible) {
    await this.commandRegistry.executeCommand('fileNavigator:toggle');
}

Let me know if you have any questions on it.

@dominique-rochefort you think i want to completely remove them, then just don’t install extensions contributing them, i.e. remove @theia/navigator from your app package.json.

If you cannot do it then implement FrontendApplicationContribution.initializeLayout lifecycle callback with a code suggested by @hemkaran or you can explicit inject FileNavigatorContribution then call tryGetWidget and if it returns a widget then dispose it.

FrontendApplicationContribution provides you with application lifecycle hooks.

initializeLayout should be used to customize the default layout. It is not called on second opening of a window for the same workspace.

[Dominique Rochefort]

Thanks @anton-kosyakov , @hemkaran . Actually, I have already removed the @theia/navigator module, but the icons still show up. Seems they are part of @theia/core. I will try the suggested approach with a custom extension.

@dominique-rochefort please try a command Reset Workbench Layout, maybe some layout caching

[Hemkaran Raghav]

Thanks for suggesting, but just removing this package won’t work as this package is also a dependency of lot of other packages. git, scm, search-in-workspace to name a few.

Then you can rebind the contribution to a constant object which does not contribute any menus, keybindings and commands.

[Dominique Rochefort]

Here is an example of how I did it: https://gist.github.com/drochgenius/6374bbc13eb10168e05e3bf00be2d07e

[Hemkaran Raghav]

Thanks @dominique-rochefort , It helps

Need to hide/remove all widgets and only my custom widget should be visible.
Code from below link doesn’t work well.

What do you mean by doesn’t work well?

1 Like