[explorer]: Badge count for dirty editors

Fixes: #8296

Adds a badge count for dirty editors on the explorer tab icon.

Signed-off-by: Anas Shahid <[email protected]>

Author: Anas Shahid

packages/navigator/src/browser/navigator-frontend-module.ts

@@ -33,6 +33,8 @@ import { NavigatorContextKeyService } from './navigator-context-key-service';
 import { TabBarToolbarContribution } from '@theia/core/lib/browser/shell/tab-bar-toolbar';
 import { NavigatorDiff } from './navigator-diff';
 import { NavigatorLayoutVersion3Migration } from './navigator-layout-migrations';
+import { NavigatorTabBarDecorator } from './navigator-tab-bar-decorator';
+import { TabBarDecorator } from '@theia/core/lib/browser/shell/tab-bar-decorator';
 
 export default new ContainerModule(bind => {
     bindFileNavigatorPreferences(bind);
@@ -72,4 +74,7 @@ export default new ContainerModule(bind => {
     bind(ApplicationShellLayoutMigration).to(NavigatorLayoutVersion3Migration).inSingletonScope();
 
     bind(NavigatorDiff).toSelf().inSingletonScope();
+    bind(NavigatorTabBarDecorator).toSelf().inSingletonScope();
+    bind(FrontendApplicationContribution).toService(NavigatorTabBarDecorator);
+    bind(TabBarDecorator).toService(NavigatorTabBarDecorator);
 });

packages/navigator/src/browser/navigator-tab-bar-decorator.ts

@@ -0,0 +1,70 @@
+/********************************************************************************
+ * Copyright (C) 2020 Ericsson and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import { injectable } from 'inversify';
+import { Emitter, Event } from '@theia/core/lib/common/event';
+import { TabBarDecorator } from '@theia/core/lib/browser/shell/tab-bar-decorator';
+import { EXPLORER_VIEW_CONTAINER_ID } from './navigator-widget';
+import { ApplicationShell, FrontendApplication, FrontendApplicationContribution, Saveable, Title, Widget } from '@theia/core/lib/browser';
+import { WidgetDecoration } from '@theia/core/lib/browser/widget-decoration';
+import { Disposable, DisposableCollection } from '@theia/core/lib/common/disposable';
+
+@injectable()
+export class NavigatorTabBarDecorator implements TabBarDecorator, FrontendApplicationContribution {
+    readonly id = 'theia-navigator-tabbar-decorator';
+    protected applicationShell: ApplicationShell;
+
+    protected readonly emitter = new Emitter<void>();
+    private readonly toDispose = new DisposableCollection();
+    private readonly toDisposeOnDirtyChanged = new Map<string, Disposable>();
+
+    onStart(app: FrontendApplication): void {
+        this.applicationShell = app.shell;
+        if (!!this.getDirtyEditorsCount()) {
+            this.fireDidChangeDecorations();
+        }
+        this.toDispose.pushAll([
+            this.applicationShell.onDidAddWidget(widget => {
+                const saveable = Saveable.get(widget);
+                if (saveable) {
+                    this.toDisposeOnDirtyChanged.set(widget.id, saveable.onDirtyChanged(() => this.fireDidChangeDecorations()));
+                }
+            }),
+            this.applicationShell.onDidRemoveWidget(widget => this.toDisposeOnDirtyChanged.get(widget.id)?.dispose())
+        ]);
+    }
+
+    decorate(title: Title<Widget>): WidgetDecoration.Data[] {
+        if (title.owner.id === EXPLORER_VIEW_CONTAINER_ID) {
+            const changes = this.getDirtyEditorsCount();
+            return changes > 0 ? [{ badge: changes }] : [];
+        } else {
+            return [];
+        }
+    }
+
+    protected getDirtyEditorsCount(): number {
+        return this.applicationShell.widgets.filter(widget => Saveable.isDirty(widget)).length;
+    }
+
+    get onDidChangeDecorations(): Event<void> {
+        return this.emitter.event;
+    }
+
+    protected fireDidChangeDecorations(): void {
+        this.emitter.fire(undefined);
+    }
+}