[widget] clarified and fixed difference between widgetId and clientId

css/theia-sprotty.css

@@ -81,6 +81,11 @@ svg:focus {
     padding-left: 10px;
 }
 
+.sprotty-status-message.fatal {
+    visibility: visible;
+    padding-left: 10px;
+}
+
 .sprotty-status:hover .sprotty-status-message {
     visibility: visible;
 }

src/sprotty/languageserver/ls-theia-sprotty-connector.ts

@@ -68,8 +68,10 @@ export class LSTheiaSprottyConnector implements TheiaSprottyConnector, TheiaSpro
         this.fileSaver.save(uri, action);
     }
 
-    showStatus(widgetId: string, status: ServerStatusAction): void {
-        const widget = this.widgetManager.getWidgets(this.diagramManager.id).find(w => w.id === widgetId);
+    showStatus(clientId: string, status: ServerStatusAction): void {
+        const widget = this.widgetManager
+            .getWidgets(this.diagramManager.id)
+            .find(w => w instanceof DiagramWidget && w.clientId === clientId);
         if (widget instanceof DiagramWidget)
             widget.setStatus(status);
     }

src/sprotty/theia-sprotty-connector.ts

@@ -44,7 +44,7 @@ export interface TheiaSprottyConnector {
     connect(diagramServer: TheiaDiagramServer): void
     disconnect(diagramServer: TheiaDiagramServer): void
     save(uri: string, action: ExportSvgAction): void
-    showStatus(widgetId: string, status: ServerStatusAction): void
+    showStatus(clientId: string, status: ServerStatusAction): void
     sendMessage(message: ActionMessage): void
     onMessageReceived(message: ActionMessage): void
 }

src/theia/diagram-manager.ts

@@ -64,10 +64,10 @@ export abstract class DiagramManager extends WidgetOpenHandler<DiagramWidget> im
             await widget.getSvgElement();
             promises.push(this.onActive(widget));
             promises.push(this.onReveal(widget));
-            this.shell.activateWidget(widget.id);
+            this.shell.activateWidget(widget.widgetId);
         } else if (op.mode === 'reveal') {
             promises.push(this.onReveal(widget));
-            this.shell.revealWidget(widget.id);
+            this.shell.revealWidget(widget.widgetId);
         }
         await Promise.all(promises);
     }
@@ -93,8 +93,8 @@ export abstract class DiagramManager extends WidgetOpenHandler<DiagramWidget> im
         if (DiagramWidgetOptions.is(options)) {
             const clientId = this.createClientId();
             const config = this.diagramConfigurationRegistry.get(options.diagramType);
-            const diContainer = config.createContainer(clientId + '_sprotty');
-            const diagramWidget = new DiagramWidget(options, clientId, diContainer, this.diagramConnector);
+            const diContainer = config.createContainer(clientId);
+            const diagramWidget = new DiagramWidget(options, clientId + '_widget', diContainer, this.diagramConnector);
             return diagramWidget;
         }
         throw Error('DiagramWidgetFactory needs DiagramWidgetOptions but got ' + JSON.stringify(options));

src/theia/diagram-widget.ts

@@ -49,6 +49,8 @@ export class DiagramWidget extends BaseWidget implements StatefulWidget {
     protected options: DiagramWidgetOptions;
     protected _actionDispatcher: IActionDispatcher;
 
+    protected _modelSource: ModelSource;
+
     get uri(): URI {
         return new URI(this.options.uri);
     }
@@ -61,7 +63,22 @@ export class DiagramWidget extends BaseWidget implements StatefulWidget {
         return this.diContainer.get(TYPES.ViewerOptions);
     }
 
-    constructor(options: DiagramWidgetOptions, readonly id: string, readonly diContainer: Container, readonly connector?: TheiaSprottyConnector) {
+    get modelSource(): ModelSource {
+        return this._modelSource;
+    }
+
+    get clientId(): string {
+        if (this._modelSource instanceof DiagramServer)
+            return this._modelSource.clientId;
+        else
+            return this.widgetId;
+    }
+
+    get id(): string {
+        return this.widgetId;
+    }
+
+    constructor(options: DiagramWidgetOptions, readonly widgetId: string, readonly diContainer: Container, readonly connector?: TheiaSprottyConnector) {
         super();
         this.options = options;
         this.title.closable = true;
@@ -95,8 +112,7 @@ export class DiagramWidget extends BaseWidget implements StatefulWidget {
 
     protected initializeSprotty() {
         const modelSource = this.diContainer.get<ModelSource>(TYPES.ModelSource);
-        if (modelSource instanceof DiagramServer)
-            modelSource.clientId = this.id;
+        this._modelSource = modelSource;
         if (modelSource instanceof TheiaDiagramServer && this.connector)
             this.connector.connect(modelSource);
         this.disposed.connect(() => {