93746: Feedback 2022-12-14 - missing types & tooltip width

src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-form.ts

@@ -187,7 +187,7 @@ export class DsoEditMetadataForm {
     Object.entries(metadata).forEach(([mdField, values]: [string, MetadataValue[]]) => {
       this.originalFieldKeys.push(mdField);
       this.fieldKeys.push(mdField);
-      this.fields[mdField] = values.map((value) => new DsoEditMetadataValue(value));
+      this.fields[mdField] = values.map((value: MetadataValue) => new DsoEditMetadataValue(value));
     });
   }
 
@@ -205,7 +205,7 @@ export class DsoEditMetadataForm {
    * Clear the temporary value afterwards
    * @param mdField
    */
-  setMetadataField(mdField: string) {
+  setMetadataField(mdField: string): void {
     this.newValue.editing = false;
     this.addValueToField(this.newValue, mdField);
     this.newValue = undefined;
@@ -217,7 +217,7 @@ export class DsoEditMetadataForm {
    * @param mdField
    * @private
    */
-  private addValueToField(value: DsoEditMetadataValue, mdField: string) {
+  private addValueToField(value: DsoEditMetadataValue, mdField: string): void {
     if (isEmpty(this.fields[mdField])) {
       this.fieldKeys.push(mdField);
       this.fields[mdField] = [];
@@ -230,7 +230,7 @@ export class DsoEditMetadataForm {
    * @param mdField
    * @param index
    */
-  remove(mdField: string, index: number) {
+  remove(mdField: string, index: number): void {
     if (isNotEmpty(this.fields[mdField])) {
       this.fields[mdField].splice(index, 1);
       if (this.fields[mdField].length === 0) {
@@ -244,7 +244,7 @@ export class DsoEditMetadataForm {
    * Returns if at least one value within the form contains a change
    */
   hasChanges(): boolean {
-    return Object.values(this.fields).some((values) => values.some((value) => value.hasChanges()));
+    return Object.values(this.fields).some((values: DsoEditMetadataValue[]) => values.some((value: DsoEditMetadataValue) => value.hasChanges()));
   }
 
   /**
@@ -253,9 +253,9 @@ export class DsoEditMetadataForm {
    */
   discard(): void {
     this.resetReinstatable();
-    Object.entries(this.fields).forEach(([field, values]) => {
+    Object.entries(this.fields).forEach(([field, values]: [string, DsoEditMetadataValue[]]) => {
       let removeFromIndex = -1;
-      values.forEach((value, index) => {
+      values.forEach((value: DsoEditMetadataValue, index: number) => {
         if (value.change === DsoEditMetadataChangeType.ADD) {
           if (isEmpty(this.reinstatableNewValues[field])) {
             this.reinstatableNewValues[field] = [];
@@ -272,7 +272,7 @@ export class DsoEditMetadataForm {
         this.fields[field].splice(removeFromIndex, this.fields[field].length - removeFromIndex);
       }
     });
-    this.fieldKeys.forEach((field) => {
+    this.fieldKeys.forEach((field: string) => {
       if (this.originalFieldKeys.indexOf(field) < 0) {
         delete this.fields[field];
       }
@@ -281,13 +281,13 @@ export class DsoEditMetadataForm {
   }
 
   reinstate(): void {
-    Object.values(this.fields).forEach((values) => {
+    Object.values(this.fields).forEach((values: DsoEditMetadataValue[]) => {
-      values.forEach((value) => {
+      values.forEach((value: DsoEditMetadataValue) => {
         value.reinstate();
       });
     });
-    Object.entries(this.reinstatableNewValues).forEach(([field, values]) => {
+    Object.entries(this.reinstatableNewValues).forEach(([field, values]: [string, DsoEditMetadataValue[]]) => {
-      values.forEach((value) => {
+      values.forEach((value: DsoEditMetadataValue) => {
         this.addValueToField(value, field);
       });
     });
@@ -300,17 +300,17 @@ export class DsoEditMetadataForm {
   isReinstatable(): boolean {
     return isNotEmpty(this.reinstatableNewValues) ||
       Object.values(this.fields)
-        .some((values) => values
+        .some((values: DsoEditMetadataValue[]) => values
-          .some((value) => value.isReinstatable()));
+          .some((value: DsoEditMetadataValue) => value.isReinstatable()));
   }
 
   /**
    * Reset the state of the re-instatable properties and values
    */
-  resetReinstatable() {
+  resetReinstatable(): void {
     this.reinstatableNewValues = {};
-    Object.values(this.fields).forEach((values) => {
+    Object.values(this.fields).forEach((values: DsoEditMetadataValue[]) => {
-      values.forEach((value) => {
+      values.forEach((value: DsoEditMetadataValue) => {
         value.resetReinstatable();
       });
     });
@@ -321,8 +321,8 @@ export class DsoEditMetadataForm {
    */
   getOperations(): Operation[] {
     const operations: Operation[] = [];
-    Object.entries(this.fields).forEach(([field, values]) => {
+    Object.entries(this.fields).forEach(([field, values]: [string, DsoEditMetadataValue[]]) => {
-      values.forEach((value, place) => {
+      values.forEach((value: DsoEditMetadataValue, place: number) => {
         if (value.hasChanges()) {
           let operation: MetadataPatchOperation;
           if (value.change === DsoEditMetadataChangeType.UPDATE) {

src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.scss

@@ -6,3 +6,7 @@
 .ds-drag-handle:not(.disabled) {
   cursor: grab;
 }
+
+::ng-deep .tooltip-inner {
+  min-width: var(--ds-dso-edit-virtual-tooltip-min-width);
+}

src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts

@@ -1,14 +1,17 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { DsoEditMetadataChangeType, DsoEditMetadataValue } from '../dso-edit-metadata-form';
 import { Observable } from 'rxjs/internal/Observable';
-import { MetadataRepresentationType } from '../../../core/shared/metadata-representation/metadata-representation.model';
+import {
+  MetadataRepresentation,
+  MetadataRepresentationType
+} from '../../../core/shared/metadata-representation/metadata-representation.model';
 import { RelationshipService } from '../../../core/data/relationship.service';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
-import { of } from 'rxjs/internal/observable/of';
 import { ItemMetadataRepresentation } from '../../../core/shared/metadata-representation/item/item-metadata-representation.model';
 import { map } from 'rxjs/operators';
 import { getItemPageRoute } from '../../../item-page/item-page-routing-paths';
 import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
+import { EMPTY } from 'rxjs/internal/observable/empty';
 
 @Component({
   selector: 'ds-dso-edit-metadata-value',
@@ -100,15 +103,19 @@ export class DsoEditMetadataValueComponent implements OnInit {
   /**
    * Initialise potential properties of a virtual metadata value
    */
-  initVirtualProperties() {
+  initVirtualProperties(): void {
     this.mdRepresentation$ = this.mdValue.newValue.isVirtual ?
       this.relationshipService.resolveMetadataRepresentation(this.mdValue.newValue, this.dso, 'Item')
-        .pipe(map((mdRepresentation) => mdRepresentation.representationType === MetadataRepresentationType.Item ? mdRepresentation : null)) : of(null);
+        .pipe(
+          map((mdRepresentation: MetadataRepresentation) =>
+            mdRepresentation.representationType === MetadataRepresentationType.Item ? mdRepresentation as ItemMetadataRepresentation : null
+          )
+        ) : EMPTY;
     this.mdRepresentationItemRoute$ = this.mdRepresentation$.pipe(
-      map((mdRepresentation) => mdRepresentation ? getItemPageRoute(mdRepresentation) : null),
+      map((mdRepresentation: ItemMetadataRepresentation) => mdRepresentation ? getItemPageRoute(mdRepresentation) : null),
     );
     this.mdRepresentationName$ = this.mdRepresentation$.pipe(
-      map((mdRepresentation) => mdRepresentation ? this.dsoNameService.getName(mdRepresentation) : null),
+      map((mdRepresentation: ItemMetadataRepresentation) => mdRepresentation ? this.dsoNameService.getName(mdRepresentation) : null),
     );
   }
 }

src/app/dso-shared/dso-edit-metadata/dso-edit-metadata.component.ts

@@ -120,7 +120,7 @@ export class DsoEditMetadataComponent implements OnInit, OnDestroy {
       this.initForm();
     }
     this.savingOrLoadingFieldValidation$ = observableCombineLatest([this.saving$, this.loadingFieldValidation$]).pipe(
-      map(([saving, loading]) => saving || loading),
+      map(([saving, loading]: [boolean, boolean]) => saving || loading),
     );
   }
 
@@ -188,7 +188,7 @@ export class DsoEditMetadataComponent implements OnInit, OnDestroy {
    * Confirm the newly added value
    * @param saved Whether or not the value was manually saved (only then, add the value to its metadata field)
    */
-  confirmNewValue(saved: boolean) {
+  confirmNewValue(saved: boolean): void {
     if (saved) {
       this.setMetadataField();
     }
@@ -199,10 +199,10 @@ export class DsoEditMetadataComponent implements OnInit, OnDestroy {
    * This will move the new value to its respective parent metadata field
    * Validate the metadata field first
    */
-  setMetadataField() {
+  setMetadataField(): void {
     this.form.resetReinstatable();
     this.loadingFieldValidation$.next(true);
-    this.metadataFieldSelectorComponent.validate().subscribe((valid) => {
+    this.metadataFieldSelectorComponent.validate().subscribe((valid: boolean) => {
       this.loadingFieldValidation$.next(false);
       if (valid) {
         this.form.setMetadataField(this.newMdField);
@@ -238,7 +238,7 @@ export class DsoEditMetadataComponent implements OnInit, OnDestroy {
   /**
    * Unsubscribe from any open subscriptions
    */
-  ngOnDestroy() {
+  ngOnDestroy(): void {
     if (hasValue(this.dsoUpdateSubscription)) {
       this.dsoUpdateSubscription.unsubscribe();
     }

src/app/dso-shared/dso-edit-metadata/metadata-field-selector/metadata-field-selector.component.ts

@@ -119,7 +119,7 @@ export class MetadataFieldSelectorComponent implements OnInit, OnDestroy, AfterV
     );
     this.mdFieldOptions$ = this.query$.pipe(
       distinctUntilChanged(),
-      switchMap((query) => {
+      switchMap((query: string) => {
         this.showInvalid = false;
         if (query !== null) {
           return this.registryService.queryMetadataFields(query, null, true, false, followLink('schema')).pipe(
@@ -152,7 +152,7 @@ export class MetadataFieldSelectorComponent implements OnInit, OnDestroy, AfterV
       metadataFieldsToString(),
       take(1),
       map((fields: string[]) => fields.indexOf(this.mdField) > -1),
-      tap((exists) => this.showInvalid = !exists),
+      tap((exists: boolean) => this.showInvalid = !exists),
     );
   }
 
@@ -160,7 +160,7 @@ export class MetadataFieldSelectorComponent implements OnInit, OnDestroy, AfterV
    * Select a metadata field from the dropdown optipons
    * @param mdFieldOption
    */
-  select(mdFieldOption: string) {
+  select(mdFieldOption: string): void {
     this.selectedValueLoading = true;
     this.input.setValue(mdFieldOption);
   }
@@ -169,6 +169,6 @@ export class MetadataFieldSelectorComponent implements OnInit, OnDestroy, AfterV
    * Unsubscribe from any open subscriptions
    */
   ngOnDestroy(): void {
-    this.subs.filter((sub) => hasValue(sub)).forEach((sub) => sub.unsubscribe());
+    this.subs.filter((sub: Subscription) => hasValue(sub)).forEach((sub: Subscription) => sub.unsubscribe());
   }
 }

src/styles/_custom_variables.scss

@@ -89,4 +89,5 @@
   --ds-dso-edit-field-width: 210px;
   --ds-dso-edit-lang-width: 90px;
   --ds-dso-edit-actions-width: 173px;
+  --ds-dso-edit-virtual-tooltip-min-width: 300px;
 }