Disable drag-drop of files in project view

How can we disable drag-drop feature in project view ? (i.e., the user should not be able to drag-drop any files or folders within project view). Thanks !

[original thread by rs]

What is the project view? The file explorer?


yes, the file explorer. thank you !

You will need to customize FileNavigatorWidget there are different template method to handle drag and drop DOM events.


I hope i need to extend the class FileNavigatorWidget and replace it somehow with MyFileNavigatorWidget? Could you please provide an example ?

I don’t think we have examples for it.

You will need to redind this binding: https://github.com/eclipse-theia/theia/blob/e48b9b5fb5fbe66c6c91c41397e74f9fd73e9195/packages/navigator/src/browser/navigator-frontend-module.ts#L49-L51


Could you kindly review:

one of the extension’s xyz-frontend-module.ts

import { createFileNavigatorContainer } from '@theia/navigator/lib/browser/navigator-container';

 * container module
export default new ContainerModule((bind, unbind, isBound, rebind) => {

    rebind(TestFileNavigatorWidget).toDynamicValue(ctx =>


export function createTestFileNavigatorContainer(parent: interfaces.Container): Container {
    const container = createFileNavigatorContainer(parent);


    return container;

export function createTestFileNavigatorWidget(parent: interfaces.Container): TestFileNavigatorWidget {
    return createTestFileNavigatorContainer(parent).get(TestFileNavigatorWidget);

looks good

(nit) rebind = unbind + bind