How can I prevent certain widgets from being loaded by default at startup?

I’m building a version of Theia targeted to students, and am trying to make the interface as minimalist as possible.

When theia starts up, it has several widgets added to the interface by default, such as outline, git, extensions, etc. How can I make sure these are hidden by default?

@bendavis the current default layout is aligned with expectations from vscode, the default widgets are present when a workspace is first opened, and are defined through the initliazeLayout implementation:

Ex (for search-in-workspace):

You have two approaches if you do not want this functionality, you can either rebind each contribution you do not want with a stub implementation, or you can rebind the FrontendApplication to not do anything when setting a default layout.

@vince-fugnitto I dug into the theia source a bit. I couldn’t find anywhere in ApplicationShell that was responsible for setting up the default layout, however I found FrontendApplication.createDefaultLayout, which appears to be what I should be overriding if I want to customize how the default layout is created. Does that sound right?

@bendavis sorry yes :slight_smile:

Ok, here’s the solution I came up with:

import { inject, injectable } from 'inversify';
import { ILogger } from '@theia/core';
import { FrontendApplication } from '@theia/core/lib/browser';

const DEFAULT_CONTRIBUTIONS = [
    'FileNavigatorContribution',
    'SearchInWorkspaceFrontendContribution'
]

/**
 * Overrides FrontendApplication to customize the contributions included in the default layout.
 */
@injectable()
export class FrontendApplicationOverride extends FrontendApplication {
    @inject(ILogger) private readonly logger: ILogger;

    protected async createDefaultLayout(): Promise<void> {
        for (const contribution of this.contributions.getContributions()) {
            const name = contribution.constructor.name;
            if (contribution.initializeLayout && DEFAULT_CONTRIBUTIONS.indexOf(name) !== -1) {
                await this.measure(name + '.initializeLayout',
                    () => contribution.initializeLayout!(this)
                );
            }
        }
    }
}

In the container module:

    bind(FrontendApplicationOverride).toSelf().inSingletonScope();
    rebind(FrontendApplication).toService(FrontendApplicationOverride);
1 Like