[DURACOM-426] accessibility fixes, fix issue with sticky popover directive, add descriptions to code

Author: FrancescoMolinaro

src/app/core/shared/item.model.ts

@@ -103,7 +103,7 @@ export class Item extends DSpaceObject implements ChildHALResource, HandleObject
    * A string representing the entity type of this Item
    */
   @autoserializeAs(String, 'entityType')
-    entityType: string;
+  entityType: string;
 
 
   /**

src/app/core/submission/vocabularies/models/vocabulary-entry-detail.model.ts

@@ -51,13 +51,13 @@ export class VocabularyEntryDetail extends VocabularyEntry {
    * Will be undefined unless the submitter {@link HALLink} has been resolved.
    */
   @link(VOCABULARY_ENTRY_DETAIL)
-    parent?: Observable<RemoteData<VocabularyEntryDetail>>;
+  parent?: Observable<RemoteData<VocabularyEntryDetail>>;
 
   /**
    * The submitter for this SubmissionObject
    * Will be undefined unless the submitter {@link HALLink} has been resolved.
    */
   @link(VOCABULARY_ENTRY_DETAIL, true)
-    children?: Observable<RemoteData<PaginatedList<VocabularyEntryDetail>>>;
+  children?: Observable<RemoteData<PaginatedList<VocabularyEntryDetail>>>;
 
 }

src/app/core/submission/vocabularies/models/vocabulary-entry.model.ts

@@ -49,7 +49,7 @@ export class VocabularyEntry extends ListableObject {
    * A value representing security level value of the metadata
    */
   @autoserialize
-    securityLevel: number;
+  securityLevel: number;
 
   /**
    * A string representing the kind of vocabulary entry

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

@@ -54,6 +54,7 @@
     }
     @if(mdValue.editing) {
       <textarea class="form-control" rows="5" [(ngModel)]="mdValue.newValue.authority"
+                [attr.aria-label]="(dsoType + '.edit.metadata.edit.authority') | translate"
                 [dsDebounce]="300" (onDebounce)="confirm.emit(false)"></textarea>
     }
   </div>

src/app/shared/entity-icon/entity-icon.directive.ts

@@ -119,7 +119,7 @@ export class EntityIconDirective implements OnInit {
    * @private
    */
   private addIcon(entityStyle: AuthorityRefEntityStyleConfig): void {
-    const iconElement = `<i class="${entityStyle.icon} ${entityStyle.style}"></i>`;
+    const iconElement = `<i aria-hidden="true" class="${entityStyle.icon} ${entityStyle.style}"></i>`;
     if (this.iconPosition === 'after') {
       this.elem.nativeElement.insertAdjacentHTML('afterend', '&nbsp;' + iconElement);
     } else {

src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts

@@ -257,6 +257,13 @@ export abstract class DsDynamicVocabularyComponent extends DynamicFormControlCom
     }
   }
 
+  /**
+   * Extracts and converts other information values from a vocabulary entry into FormFieldMetadataValueObject array.
+   * This method processes values that may contain multiple entries separated by '|||' and authority values after '::'.
+   * @param value The raw value string from otherInformation, possibly containing '|||' separators and '::' authority markers
+   * @param key The otherInformation key (e.g., 'data-dc.contributor.affiliation')
+   * @returns Array of FormFieldMetadataValueObject to populate form fields, or null if value is empty or key is 'alternative-names'
+   */
   getOtherInformationValue(value: string, key: string): FormFieldMetadataValueObject[] {
     if (!isNotEmpty(value) || key === 'alternative-names' ) {
       return null;

src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.html

@@ -54,8 +54,10 @@
             (whenClickOnConfidenceNotAccepted)="whenClickOnConfidenceNotAccepted($event)"></i>
         }
         @if(otherInfoValues.length > 0 && (model.id === otherInfoKey || otherInfoKey === alternativeNamesKey || 'data-' + model.id === otherInfoKey)) {
-          <i class="fa-solid fa-angle-down fa-fw fa-2x fa-fw position-absolute mt-1 p-0 additional-items-icon"
-              (click)="toggleOtherInfoSelection()"
+          <i
+            class="fa-solid fa-angle-down fa-fw fa-2x fa-fw position-absolute mt-1 p-0 additional-items-icon"
+            aria-hidden="true"
+            (click)="toggleOtherInfoSelection()"
           ></i>
         }
       </div>

src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts

@@ -398,6 +398,12 @@ export class DsDynamicOneboxComponent extends DsDynamicVocabularyComponent imple
     this.additionalInfoSelectIsOpen = !this.additionalInfoSelectIsOpen;
   }
 
+  /**
+   * Handles the selection of an alternative information value from a list of multiple values.
+   * This method is used when a vocabulary entry has multiple values for the same field
+   * (e.g., alternative names or multiple affiliations separated by '|||').
+   * @param info The selected alternative information value
+   */
   selectAlternativeInfo(info: string) {
     this.searching = true;
 
@@ -434,6 +440,13 @@ export class DsDynamicOneboxComponent extends DsDynamicVocabularyComponent imple
   }
 
 
+  /**
+   * Configures the component to handle multiple values for additional information fields.
+   * This method is called when a vocabulary entry contains fields with multiple values
+   * separated by '|||' (e.g., alternative names or multiple affiliations).
+   * @param keys Array of keys from the otherInformation object to check for multiple values
+   * @param item The vocabulary entry item containing the otherInformation data
+   */
   setMultipleValuesForOtherInfo(keys: string[], item: any) {
     const hasAlternativeNames = keys.includes(this.alternativeNamesKey);
 

src/app/shared/image.utils.ts

@@ -4,6 +4,19 @@ import {
 } from 'rxjs';
 import { map } from 'rxjs/operators';
 
+/**
+ * Returns the appropriate placeholder image URL for a given DSpace entity type.
+ * This utility is used throughout the application to display default/placeholder images
+ * when entity thumbnails are not available or while they are loading.
+ *
+ * The method follows this resolution strategy:
+ * 1. If no entityType is provided, returns the generic file placeholder
+ * 2. Attempts to load an entity-specific placeholder (e.g., 'person-plsubmission-edit.component.tsaceholder.svg', 'orgunit-placeholder.svg')
+ * 3. If the entity-specific placeholder doesn't exist, falls back to the generic file placeholder
+ *
+ * @param entityType The DSpace entity type (e.g., 'Person', 'OrgUnit', 'Project').
+ *                   Case-insensitive as it will be converted to lowercase.
+ */
 export const getDefaultImageUrlByEntityType = (entityType: string): Observable<string> => {
   const fallbackImage = 'assets/images/file-placeholder.svg';
 

src/app/shared/metadata-link-view/metadata-link-view-avatar-popover/metadata-link-view-avatar-popover.component.ts

@@ -15,6 +15,15 @@ import { getDefaultImageUrlByEntityType } from '../../image.utils';
 import { ThemedLoadingComponent } from '../../loading/themed-loading.component';
 import { SafeUrlPipe } from '../../utils/safe-url-pipe';
 
+/**
+ * Component that displays an avatar thumbnail within a popover.
+ * This component is used by the MetadataLinkViewComponent to show entity avatars (e.g., person photos,
+ * organization logos) in a popover when hovering over or clicking on metadata links.
+ *
+ * The popover displays:
+ * - The entity's thumbnail image if available
+ * - A placeholder image based on the entity type if no thumbnail is available
+ */
 @Component({
   selector: 'ds-metadata-link-view-avatar-popover',
   templateUrl: './metadata-link-view-avatar-popover.component.html',