Merge branch 'main' into dependabot/npm_and_yarn/types/node-20.17.8

apps/dsp-app/src/styles/_elements.scss

@@ -749,12 +749,50 @@ nav.mat-mdc-tab-nav-bar,
 }
 
 .annotation-tooltip {
+  display: none;
+  position: fixed;
+  background-color: $black-60-opacity;
+  color: $bright;
+  padding: 8px;
+  border-radius: $border-radius;
+  min-height: 24px;
+  max-height: 258px;
+  max-width: 256px;
+  box-sizing: border-box;
+  transition: 0.1s;
+  transform: translate(16px, 16px);
+  font-size: small;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  z-index: 1000;
+
   p {
     white-space: normal;
     text-overflow: ellipsis;
   }
 }
 
+.region {
+  filter: alpha(opacity=40);
+  opacity: 0.4;
+  fill: transparent;
+  stroke: #00695c;
+  stroke-width: 2px;
+}
+
+.region:hover,
+.region:focus {
+  filter: alpha(opacity=100);
+  opacity: 1;
+  cursor: pointer;
+}
+
+.region.active {
+  filter: alpha(opacity=100);
+  opacity: 1;
+}
+
 // --------------------------------------
 
 //

libs/vre/resource-editor/representations/src/lib/still-image/still-image.component.scss

@@ -65,57 +65,6 @@
 }
 
 
-/*
- Openseadragon styling
- */
-.annotation-tooltip {
-  display: none;
-  position: fixed;
-  background-color: $black-60-opacity;
-  color: $bright;
-  padding: 8px;
-  border-radius: $border-radius;
-  min-height: 24px;
-  max-height: 258px;
-  max-width: 256px;
-  box-sizing: border-box;
-  transition: 0.1s;
-  transform: translate(16px, 16px);
-  font-size: small;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  z-index: 1000;
-}
-
-::ng-deep .openseadragon-container {
-  border-radius: 8px 8px 0 0;
-}
-
-/*
- Overlay styling
- */
-
-::ng-deep .region {
-  filter: alpha(opacity=40);
-  opacity: 0.4;
-  fill: transparent;
-  stroke: #00695c;
-  stroke-width: 2px;
-}
-
-::ng-deep .region:hover,
-.region:focus {
-  filter: alpha(opacity=100);
-  opacity: 1;
-  cursor: pointer;
-}
-
-::ng-deep .region.active {
-  filter: alpha(opacity=100);
-  opacity: 1;
-}
-
 .arrow {
   position: absolute;
   z-index: 1;

libs/vre/resource-editor/resource-properties/src/lib/delete-value-dialog.component.ts

@@ -64,9 +64,9 @@ export class DeleteValueDialogComponent implements OnInit {
   }
 
   deleteValue() {
-    const resource = this.propertyValueService._editModeData?.resource as ReadResource;
+    const resource = this.propertyValueService.editModeData?.resource as ReadResource;
 
-    const value = this.propertyValueService._editModeData?.values[this.data.index] as unknown as ReadResource;
+    const value = this.propertyValueService.editModeData?.values[this.data.index] as unknown as ReadResource;
     const deleteVal = new DeleteValue();
     deleteVal.id = value.id;
     deleteVal.type = value.type;

libs/vre/resource-editor/resource-properties/src/lib/property-value-action-bubble.component.ts

@@ -78,9 +78,9 @@ export class PropertyValueActionBubbleComponent implements OnInit {
   infoTooltip$!: Observable<string>;
 
   get userHasPermissionToModify() {
-    return !this._propertyValueService._editModeData || this._propertyValueService._editModeData.values.length === 0
+    return !this._propertyValueService.editModeData || this._propertyValueService.editModeData.values.length === 0
       ? false
-      : ResourceUtil.userCanEdit(this._propertyValueService._editModeData.values[0]);
+      : ResourceUtil.userCanEdit(this._propertyValueService.editModeData.values[0]);
   }
 
   constructor(

libs/vre/resource-editor/resource-properties/src/lib/property-value-switcher.component.ts

@@ -168,7 +168,7 @@ export class PropertyValueSwitcherComponent implements OnInit, OnChanges, AfterV
   }
 
   _setupData() {
-    this._propertyValueService._editModeData = this.editModeData;
+    this._propertyValueService.editModeData = this.editModeData;
     this._propertyValueService.propertyDefinition = this.propertyDefinition;
     this._propertyValueService.formArray = this.formArray;
     this._propertyValueService.cardinality = this.cardinality;

libs/vre/resource-editor/resource-properties/src/lib/property-value.component.ts

@@ -39,7 +39,7 @@ import { propertiesTypeMapping } from './resource-payloads-mapping';
     <app-property-value-action-bubble
       [editMode]="!displayMode"
       *ngIf="!propertyValueService.keepEditMode && showBubble"
-      [date]="propertyValueService._editModeData?.values[index]?.valueCreationDate"
+      [date]="propertyValueService.editModeData?.values[index]?.valueCreationDate"
       [showDelete]="index > 0 || [Cardinality._0_1, Cardinality._0_n].includes(propertyValueService.cardinality)"
       (editAction)="propertyValueService.toggleOpenedValue(index)"
       (deleteAction)="askToDelete()"></app-property-value-action-bubble>
@@ -168,7 +168,7 @@ export class PropertyValueComponent implements OnInit {
       createVal.valueHasComment = this.group.controls.comment.value;
     }
 
-    const resource = this.propertyValueService._editModeData?.resource as ReadResource;
+    const resource = this.propertyValueService.editModeData?.resource as ReadResource;
     const updateRes = new UpdateResource();
     updateRes.id = resource.id;
     updateRes.type = resource.type;
@@ -244,7 +244,7 @@ export class PropertyValueComponent implements OnInit {
 
   private _getUpdatedValue(index: number) {
     const group = this.propertyValueService.formArray.at(index);
-    const values = this.propertyValueService._editModeData?.values as ReadValue[];
+    const values = this.propertyValueService.editModeData?.values as ReadValue[];
     const id = values[index].id;
     const entity = propertiesTypeMapping
       .get(this.propertyValueService.propertyDefinition.objectType!)!
@@ -257,7 +257,7 @@ export class PropertyValueComponent implements OnInit {
 
   private _getPayload(index: number) {
     const updateResource = new UpdateResource<UpdateValue>();
-    const { resource, values } = this.propertyValueService._editModeData as {
+    const { resource, values } = this.propertyValueService.editModeData as {
       resource: ReadResource;
       values: ReadValue[];
     };

libs/vre/resource-editor/resource-properties/src/lib/property-value.service.ts

@@ -5,13 +5,23 @@ import { FormValueArray } from './form-value-array.type';
 
 @Injectable()
 export class PropertyValueService {
-  _editModeData: { resource: ReadResource; values: ReadValue[] } | null = null;
+  private _editModeData: { resource: ReadResource; values: ReadValue[] } | null = null;
   propertyDefinition!: ResourcePropertyDefinition;
   formArray!: FormValueArray;
   cardinality!: Cardinality;
   currentlyAdding = false;
   lastOpenedItem$ = new BehaviorSubject<number | null>(null);
 
+  get editModeData(): { resource: ReadResource; values: ReadValue[] } | null {
+    return this._editModeData;
+  }
+
+  set editModeData(data: { resource: ReadResource; values: ReadValue[] } | null) {
+    this.currentlyAdding = false;
+    this.lastOpenedItem$.next(null);
+    this._editModeData = data;
+  }
+
   get keepEditMode() {
     return this._editModeData === null;
   }

libs/vre/resource-editor/resource-properties/src/lib/switch-components/toggle-switch.component.ts

@@ -53,7 +53,7 @@ export class ToggleSwitchComponent implements IsSwitchComponent, OnInit, OnDestr
 
   isCreatingBoolean = false;
   currentlyAdding = this._propertyValueService.currentlyAdding;
-  editModeData = this._propertyValueService._editModeData;
+  editModeData = this._propertyValueService.editModeData;
 
   get formControl() {
     return this.control as FormControl<boolean>;