ATL-786: Progress indication for install.

Signed-off-by: Akos Kitta <kittaakos@typefox.io>

Author: Akos Kitta

arduino-ide-extension/src/browser/arduino-frontend-contribution.tsx

@@ -44,7 +44,7 @@ import { WorkspaceService } from './theia/workspace/workspace-service';
 import { ArduinoToolbar } from './toolbar/arduino-toolbar';
 import { HostedPluginSupport } from '@theia/plugin-ext/lib/hosted/browser/hosted-plugin';
 import { FileService } from '@theia/filesystem/lib/browser/file-service';
-import { OutputService } from '../common/protocol/output-service';
+import { ResponseService } from '../common/protocol/response-service';
 import { ArduinoPreferences } from './arduino-preferences';
 import { SketchesServiceClientImpl } from '../common/protocol/sketches-service-client-impl';
 import { SaveAsSketch } from './contributions/save-as-sketch';
@@ -151,8 +151,8 @@ export class ArduinoFrontendContribution implements FrontendApplicationContribut
     @inject(ExecutableService)
     protected executableService: ExecutableService;
 
-    @inject(OutputService)
-    protected readonly outputService: OutputService;
+    @inject(ResponseService)
+    protected readonly responseService: ResponseService;
 
     @inject(ArduinoPreferences)
     protected readonly arduinoPreferences: ArduinoPreferences;

arduino-ide-extension/src/browser/arduino-ide-frontend-module.ts

@@ -120,8 +120,8 @@ import { OutputChannelRegistryMainImpl as TheiaOutputChannelRegistryMainImpl, Ou
 import { ExecutableService, ExecutableServicePath } from '../common/protocol';
 import { MonacoTextModelService as TheiaMonacoTextModelService } from '@theia/monaco/lib/browser/monaco-text-model-service';
 import { MonacoTextModelService } from './theia/monaco/monaco-text-model-service';
-import { OutputServiceImpl } from './output-service-impl';
-import { OutputServicePath, OutputService } from '../common/protocol/output-service';
+import { ResponseServiceImpl } from './response-service-impl';
+import { ResponseServicePath, ResponseService } from '../common/protocol/response-service';
 import { NotificationCenter } from './notification-center';
 import { NotificationServicePath, NotificationServiceServer } from '../common/protocol';
 import { About } from './contributions/about';
@@ -159,6 +159,10 @@ import { MonacoEditorProvider as TheiaMonacoEditorProvider } from '@theia/monaco
 import { DebugEditorModel } from './theia/debug/debug-editor-model';
 import { DebugEditorModelFactory } from '@theia/debug/lib/browser/editor/debug-editor-model';
 import { StorageWrapper } from './storage-wrapper';
+import { NotificationManager } from './theia/messages/notifications-manager';
+import { NotificationManager as TheiaNotificationManager } from '@theia/messages/lib/browser/notifications-manager';
+import { NotificationsRenderer as TheiaNotificationsRenderer } from '@theia/messages/lib/browser/notifications-renderer';
+import { NotificationsRenderer } from './theia/messages/notifications-renderer';
 
 const ElementQueries = require('css-element-queries/src/ElementQueries');
 
@@ -383,11 +387,11 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     Contribution.configure(bind, ArchiveSketch);
     Contribution.configure(bind, AddZipLibrary);
 
-    bind(OutputServiceImpl).toSelf().inSingletonScope().onActivation(({ container }, outputService) => {
-        WebSocketConnectionProvider.createProxy(container, OutputServicePath, outputService);
-        return outputService;
+    bind(ResponseServiceImpl).toSelf().inSingletonScope().onActivation(({ container }, responseService) => {
+        WebSocketConnectionProvider.createProxy(container, ResponseServicePath, responseService);
+        return responseService;
     });
-    bind(OutputService).toService(OutputServiceImpl);
+    bind(ResponseService).toService(ResponseServiceImpl);
 
     bind(NotificationCenter).toSelf().inSingletonScope();
     bind(FrontendApplicationContribution).toService(NotificationCenter);
@@ -439,4 +443,9 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
 
     bind(StorageWrapper).toSelf().inSingletonScope();
     bind(CommandContribution).toService(StorageWrapper);
+
+    bind(NotificationManager).toSelf().inSingletonScope();
+    rebind(TheiaNotificationManager).toService(NotificationManager);
+    bind(NotificationsRenderer).toSelf().inSingletonScope();
+    rebind(TheiaNotificationsRenderer).toService(NotificationsRenderer);
 });

arduino-ide-extension/src/browser/boards/boards-auto-installer.ts

@@ -4,8 +4,9 @@ import { FrontendApplicationContribution } from '@theia/core/lib/browser/fronten
 import { BoardsService, BoardsPackage } from '../../common/protocol/boards-service';
 import { BoardsServiceProvider } from './boards-service-provider';
 import { BoardsListWidgetFrontendContribution } from './boards-widget-frontend-contribution';
-import { InstallationProgressDialog } from '../widgets/progress-dialog';
 import { BoardsConfig } from './boards-config';
+import { Installable } from '../../common/protocol';
+import { ResponseServiceImpl } from '../response-service-impl';
 
 /**
  * Listens on `BoardsConfig.Config` changes, if a board is selected which does not
@@ -23,6 +24,9 @@ export class BoardsAutoInstaller implements FrontendApplicationContribution {
     @inject(BoardsServiceProvider)
     protected readonly boardsServiceClient: BoardsServiceProvider;
 
+    @inject(ResponseServiceImpl)
+    protected readonly responseService: ResponseServiceImpl;
+
     @inject(BoardsListWidgetFrontendContribution)
     protected readonly boardsManagerFrontendContribution: BoardsListWidgetFrontendContribution;
 
@@ -42,13 +46,13 @@ export class BoardsAutoInstaller implements FrontendApplicationContribution {
                     // tslint:disable-next-line:max-line-length
                     this.messageService.info(`The \`"${candidate.name}"\` core has to be installed for the currently selected \`"${selectedBoard.name}"\` board. Do you want to install it now?`, 'Install Manually', 'Yes').then(async answer => {
                         if (answer === 'Yes') {
-                            const dialog = new InstallationProgressDialog(candidate.name, candidate.availableVersions[0]);
-                            dialog.open();
-                            try {
-                                await this.boardsService.install({ item: candidate });
-                            } finally {
-                                dialog.close();
-                            }
+                            await Installable.installWithProgress({
+                                installable: this.boardsService,
+                                item: candidate,
+                                messageService: this.messageService,
+                                responseService: this.responseService,
+                                version: candidate.availableVersions[0]
+                            });
                         }
                         if (answer) {
                             this.boardsManagerFrontendContribution.openView({ reveal: true }).then(widget => widget.refresh(candidate.name.toLocaleLowerCase()));

arduino-ide-extension/src/browser/boards/boards-list-widget.ts

@@ -33,9 +33,14 @@ export class BoardsListWidget extends ListWidget<BoardsPackage> {
         ]);
     }
 
-    async install({ item, version }: { item: BoardsPackage; version: string; }): Promise<void> {
-        await super.install({ item, version });
-        this.messageService.info(`Successfully installed platform ${item.name}:${version}.`, { timeout: 3000 });
+    protected async install({ item, progressId, version }: { item: BoardsPackage, progressId: string, version: string; }): Promise<void> {
+        await super.install({ item, progressId, version });
+        this.messageService.info(`Successfully installed platform ${item.name}:${version}`, { timeout: 3000 });
+    }
+
+    protected async uninstall({ item, progressId }: { item: BoardsPackage, progressId: string }): Promise<void> {
+        await super.uninstall({ item, progressId });
+        this.messageService.info(`Successfully uninstalled platform ${item.name}:${item.installedVersion}`, { timeout: 3000 });
     }
 
 }

arduino-ide-extension/src/browser/contributions/add-zip-library.ts

@@ -1,19 +1,22 @@
 import { inject, injectable } from 'inversify';
 import { remote } from 'electron';
+import URI from '@theia/core/lib/common/uri';
+import { ConfirmDialog } from '@theia/core/lib/browser/dialogs';
+import { EnvVariablesServer } from '@theia/core/lib/common/env-variables';
 import { ArduinoMenus } from '../menu/arduino-menus';
+import { ResponseServiceImpl } from '../response-service-impl';
+import { Installable, LibraryService } from '../../common/protocol';
 import { SketchContribution, Command, CommandRegistry, MenuModelRegistry } from './contribution';
-import { EnvVariablesServer } from '@theia/core/lib/common/env-variables';
-import URI from '@theia/core/lib/common/uri';
-import { InstallationProgressDialog } from '../widgets/progress-dialog';
-import { LibraryService } from '../../common/protocol';
-import { ConfirmDialog } from '@theia/core/lib/browser';
 
 @injectable()
 export class AddZipLibrary extends SketchContribution {
 
     @inject(EnvVariablesServer)
     protected readonly envVariableServer: EnvVariablesServer;
 
+    @inject(ResponseServiceImpl)
+    protected readonly responseService: ResponseServiceImpl;
+
     @inject(LibraryService)
     protected readonly libraryService: LibraryService;
 
@@ -69,11 +72,14 @@ export class AddZipLibrary extends SketchContribution {
     }
 
     private async doInstall(zipUri: string, overwrite?: boolean): Promise<void> {
-        const dialog = new InstallationProgressDialog('Installing library', 'zip');
         try {
-            this.outputChannelManager.getChannel('Arduino').clear();
-            dialog.open();
-            await this.libraryService.installZip({ zipUri, overwrite });
+            await Installable.doWithProgress({
+                messageService: this.messageService,
+                progressText: `Processing ${new URI(zipUri).path.base}`,
+                responseService: this.responseService,
+                run: () => this.libraryService.installZip({ zipUri, overwrite })
+            });
+            this.messageService.info(`Successfully installed library from ${new URI(zipUri).path.base} archive`, { timeout: 3000 });
         } catch (error) {
             if (error instanceof Error) {
                 const match = error.message.match(/library (.*?) already installed/);
@@ -88,8 +94,6 @@ export class AddZipLibrary extends SketchContribution {
             }
             this.messageService.error(error.toString());
             throw error;
-        } finally {
-            dialog.close();
         }
     }
 

arduino-ide-extension/src/browser/data/arduino.color-theme.json

@@ -82,6 +82,7 @@
   "colors": {
     "list.highlightForeground": "#005c5f",
     "list.activeSelectionBackground": "#005c5f",
+    "progressBar.background": "#005c5f",
     "editor.background": "#ffffff",
     "editorCursor.foreground": "#434f54",
     "editor.foreground": "#434f54",

arduino-ide-extension/src/browser/library/library-list-widget.ts

@@ -37,7 +37,7 @@ export class LibraryListWidget extends ListWidget<LibraryPackage> {
         ]);
     }
 
-    protected async install({ item, version }: { item: LibraryPackage, version: Installable.Version }): Promise<void> {
+    protected async install({ item, progressId, version }: { item: LibraryPackage, progressId: string, version: Installable.Version }): Promise<void> {
         const dependencies = await this.service.listDependencies({ item, version, filterSelf: true });
         let installDependencies: boolean | undefined = undefined;
         if (dependencies.length) {
@@ -84,11 +84,16 @@ export class LibraryListWidget extends ListWidget<LibraryPackage> {
         }
 
         if (typeof installDependencies === 'boolean') {
-            await this.service.install({ item, version, installDependencies });
-            this.messageService.info(`Successfully installed library ${item.name}:${version}.`, { timeout: 3000 });
+            await this.service.install({ item, version, progressId, installDependencies });
+            this.messageService.info(`Successfully installed library ${item.name}:${version}`, { timeout: 3000 });
         }
     }
 
+    protected async uninstall({ item, progressId }: { item: LibraryPackage, progressId: string }): Promise<void> {
+        await super.uninstall({ item, progressId });
+        this.messageService.info(`Successfully uninstalled library ${item.name}:${item.installedVersion}`, { timeout: 3000 });
+    }
+
 }
 
 class MessageBoxDialog extends AbstractDialog<MessageBoxDialog.Result> {

arduino-ide-extension/src/browser/output-service-impl.ts

@@ -0,0 +1,34 @@
+import { inject, injectable } from 'inversify';
+import { Emitter } from '@theia/core/lib/common/event';
+import { OutputContribution } from '@theia/output/lib/browser/output-contribution';
+import { OutputChannelManager } from '@theia/output/lib/common/output-channel';
+import { ResponseService, OutputMessage, ProgressMessage } from '../common/protocol/response-service';
+
+@injectable()
+export class ResponseServiceImpl implements ResponseService {
+
+    @inject(OutputContribution)
+    protected outputContribution: OutputContribution;
+
+    @inject(OutputChannelManager)
+    protected outputChannelManager: OutputChannelManager;
+
+    protected readonly progressDidChangeEmitter = new Emitter<ProgressMessage>();
+    readonly onProgressDidChange = this.progressDidChangeEmitter.event;
+
+    appendToOutput(message: OutputMessage): void {
+        const { chunk } = message;
+        const channel = this.outputChannelManager.getChannel('Arduino');
+        channel.show({ preserveFocus: true });
+        channel.append(chunk);
+    }
+
+    clearArduinoChannel(): void {
+        this.outputChannelManager.getChannel('Arduino').clear();
+    }
+
+    reportProgress(progress: ProgressMessage): void {
+        this.progressDidChangeEmitter.fire(progress);
+    }
+
+}

arduino-ide-extension/src/browser/response-service-impl.ts

@@ -67,3 +67,20 @@ button.theia-button.secondary {
 button.theia-button.main {
     color: var(--theia-button-foreground);
 }
+
+/* To make the progress-bar slightly thicker, and use the color from the status bar */
+.theia-progress-bar-container {
+    width: 100%;
+    height: 4px;
+}
+
+.theia-progress-bar {
+    height: 4px;
+    width: 3%;
+    animation: progress-animation 1.3s 0s infinite cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.theia-notification-item-progressbar {
+    height: 4px;
+    width: 66%;
+}