fix: edit label UI does not resize on graph zoom

Fixes GH-1601

- ensure that the edit label UI is properly resizing if the graph is zoomed in or out

Contributed on behalf of STMicroelectronics

Author: ndoschek

packages/client/src/features/label-edit-ui/label-edit-ui-module.ts

@@ -13,7 +13,14 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { EditLabelAction, EditLabelActionHandler, FeatureModule, TYPES, configureActionHandler } from '@eclipse-glsp/sprotty';
+import {
+    EditLabelAction,
+    EditLabelActionHandler,
+    FeatureModule,
+    SetViewportAction,
+    TYPES,
+    configureActionHandler
+} from '@eclipse-glsp/sprotty';
 import { GlspEditLabelUI } from './label-edit-ui';
 
 export const labelEditUiModule = new FeatureModule(
@@ -22,6 +29,7 @@ export const labelEditUiModule = new FeatureModule(
         configureActionHandler(context, EditLabelAction.KIND, EditLabelActionHandler);
         bind(GlspEditLabelUI).toSelf().inSingletonScope();
         bind(TYPES.IUIExtension).toService(GlspEditLabelUI);
+        configureActionHandler(context, SetViewportAction.KIND, GlspEditLabelUI);
     },
     { featureId: Symbol('labelEditUi') }
 );

packages/client/src/features/label-edit-ui/label-edit-ui.ts

@@ -13,12 +13,12 @@
  *
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
-import { EditLabelUI } from '@eclipse-glsp/sprotty';
+import { Action, EditLabelUI, IActionHandler, SetViewportAction } from '@eclipse-glsp/sprotty';
 import { injectable } from 'inversify';
 import { CSS_HIDDEN_EXTENSION_CLASS, CSS_UI_EXTENSION_CLASS } from '../../base/ui-extension/ui-extension';
 
 @injectable()
-export class GlspEditLabelUI extends EditLabelUI {
+export class GlspEditLabelUI extends EditLabelUI implements IActionHandler {
     protected override initializeContents(containerElement: HTMLElement): void {
         super.initializeContents(containerElement);
         containerElement.classList.add(CSS_UI_EXTENSION_CLASS);
@@ -32,4 +32,11 @@ export class GlspEditLabelUI extends EditLabelUI {
             this.containerElement?.classList.add(CSS_HIDDEN_EXTENSION_CLASS);
         }
     }
+
+    handle(action: Action): void {
+        if (SetViewportAction.is(action) && this.isActive && this.containerElement) {
+            this.setPosition(this.containerElement);
+            this.applyFontStyling();
+        }
+    }
 }