From 8d25ba764ca76b7f8776a50eecd3d70ae862c5e6 Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Wed, 3 Jan 2024 11:05:19 +0100
Subject: [PATCH 1/9] Implement getVocabularyByMetadataAndCollection in
 VocabularyService

---
 .../vocabulary.data.service.spec.ts           | 22 ++++++++++++++++
 .../vocabularies/vocabulary.data.service.ts   | 25 +++++++++++++++++++
 .../vocabularies/vocabulary.service.spec.ts   | 19 ++++++++++++++
 .../vocabularies/vocabulary.service.ts        | 17 +++++++++++++
 .../shared/testing/vocabulary-service.stub.ts |  4 +++
 5 files changed, 87 insertions(+)

diff --git a/src/app/core/submission/vocabularies/vocabulary.data.service.spec.ts b/src/app/core/submission/vocabularies/vocabulary.data.service.spec.ts
index 4b35871418f..eecf86a2118 100644
--- a/src/app/core/submission/vocabularies/vocabulary.data.service.spec.ts
+++ b/src/app/core/submission/vocabularies/vocabulary.data.service.spec.ts
@@ -7,8 +7,16 @@
  */
 import { VocabularyDataService } from './vocabulary.data.service';
 import { testFindAllDataImplementation } from '../../data/base/find-all-data.spec';
+import { FindListOptions } from '../../data/find-list-options.model';
+import { RequestParam } from '../../cache/models/request-param.model';
+import { createSuccessfulRemoteDataObject$ } from 'src/app/shared/remote-data.utils';
 
 describe('VocabularyDataService', () => {
+  let service: VocabularyDataService;
+  service = initTestService();
+  let restEndpointURL = 'https://rest.api/server/api/submission/vocabularies';
+  let vocabularyByMetadataAndCollectionEndpoint = `${restEndpointURL}/search/byMetadataAndCollection?metadata=dc.contributor.author&collection=1234-1234`;
+
   function initTestService() {
     return new VocabularyDataService(null, null, null, null);
   }
@@ -17,4 +25,18 @@ describe('VocabularyDataService', () => {
     const initService = () => new VocabularyDataService(null, null, null, null);
     testFindAllDataImplementation(initService);
   });
+
+  describe('getVocabularyByMetadataAndCollection', () => {
+    it('search vocabulary by metadata and collection calls expected methods', () => {
+      spyOn((service as any).searchData, 'getSearchByHref').and.returnValue(vocabularyByMetadataAndCollectionEndpoint);
+      spyOn(service, 'findByHref').and.returnValue(createSuccessfulRemoteDataObject$(null));
+      service.getVocabularyByMetadataAndCollection('dc.contributor.author', '1234-1234');
+      const options = Object.assign(new FindListOptions(), {
+        searchParams: [Object.assign(new RequestParam('metadata', encodeURIComponent('dc.contributor.author'))),
+                       Object.assign(new RequestParam('collection', encodeURIComponent('1234-1234')))]
+      });
+      expect((service as any).searchData.getSearchByHref).toHaveBeenCalledWith('byMetadataAndCollection', options);
+      expect(service.findByHref).toHaveBeenCalledWith(vocabularyByMetadataAndCollectionEndpoint, true, true);
+    });
+  });
 });
diff --git a/src/app/core/submission/vocabularies/vocabulary.data.service.ts b/src/app/core/submission/vocabularies/vocabulary.data.service.ts
index a67b67ced70..9215990decf 100644
--- a/src/app/core/submission/vocabularies/vocabulary.data.service.ts
+++ b/src/app/core/submission/vocabularies/vocabulary.data.service.ts
@@ -20,6 +20,8 @@ import { PaginatedList } from '../../data/paginated-list.model';
 import { Injectable } from '@angular/core';
 import { VOCABULARY } from './models/vocabularies.resource-type';
 import { dataService } from '../../data/base/data-service.decorator';
+import { SearchDataImpl } from '../../data/base/search-data';
+import { RequestParam } from '../../cache/models/request-param.model';
 
 /**
  * Data service to retrieve vocabularies from the REST server.
@@ -27,7 +29,10 @@ import { dataService } from '../../data/base/data-service.decorator';
 @Injectable()
 @dataService(VOCABULARY)
 export class VocabularyDataService extends IdentifiableDataService<Vocabulary> implements FindAllData<Vocabulary> {
+  protected searchByMetadataAndCollectionPath = 'byMetadataAndCollection';
+
   private findAllData: FindAllData<Vocabulary>;
+  private searchData: SearchDataImpl<Vocabulary>;
 
   constructor(
     protected requestService: RequestService,
@@ -38,6 +43,7 @@ export class VocabularyDataService extends IdentifiableDataService<Vocabulary> i
     super('vocabularies', requestService, rdbService, objectCache, halService);
 
     this.findAllData = new FindAllDataImpl(this.linkPath, requestService, rdbService, objectCache, halService, this.responseMsToLive);
+    this.searchData = new SearchDataImpl(this.linkPath, requestService, rdbService, objectCache, halService, this.responseMsToLive);
   }
 
   /**
@@ -57,4 +63,23 @@ export class VocabularyDataService extends IdentifiableDataService<Vocabulary> i
   public findAll(options?: FindListOptions, useCachedVersionIfAvailable?: boolean, reRequestOnStale?: boolean, ...linksToFollow: FollowLinkConfig<Vocabulary>[]): Observable<RemoteData<PaginatedList<Vocabulary>>> {
     return this.findAllData.findAll(options, useCachedVersionIfAvailable, reRequestOnStale, ...linksToFollow);
   }
+
+  /**
+   * Return the controlled vocabulary configured for the specified metadata and collection if any (/submission/vocabularies/search/{@link searchByMetadataAndCollectionPath}?metadata=<>&collection=<>)
+   * @param metadataField               metadata field to search
+   * @param collectionUUID              collection UUID where is configured the vocabulary
+   * @param useCachedVersionIfAvailable If this is true, the request will only be sent if there's
+   *                                    no valid cached version. Defaults to true
+   * @param reRequestOnStale            Whether or not the request should automatically be re-
+   *                                    requested after the response becomes stale
+   * @param linksToFollow               List of {@link FollowLinkConfig} that indicate which
+   *                                    {@link HALLink}s should be automatically resolved
+   */
+  public getVocabularyByMetadataAndCollection(metadataField: string, collectionUUID: string, useCachedVersionIfAvailable = true, reRequestOnStale = true, ...linksToFollow: FollowLinkConfig<Vocabulary>[]): Observable<RemoteData<Vocabulary>> {
+    const findListOptions = new FindListOptions();
+    findListOptions.searchParams = [new RequestParam('metadata', encodeURIComponent(metadataField)),
+                        new RequestParam('collection', encodeURIComponent(collectionUUID))];
+    const href$ = this.searchData.getSearchByHref(this.searchByMetadataAndCollectionPath, findListOptions, ...linksToFollow);
+    return this.findByHref(href$, useCachedVersionIfAvailable, reRequestOnStale, ...linksToFollow);
+  }
 }
diff --git a/src/app/core/submission/vocabularies/vocabulary.service.spec.ts b/src/app/core/submission/vocabularies/vocabulary.service.spec.ts
index e8ff2b479d8..38824b3fac0 100644
--- a/src/app/core/submission/vocabularies/vocabulary.service.spec.ts
+++ b/src/app/core/submission/vocabularies/vocabulary.service.spec.ts
@@ -255,7 +255,9 @@ describe('VocabularyService', () => {
         spyOn((service as any).vocabularyDataService, 'findById').and.callThrough();
         spyOn((service as any).vocabularyDataService, 'findAll').and.callThrough();
         spyOn((service as any).vocabularyDataService, 'findByHref').and.callThrough();
+        spyOn((service as any).vocabularyDataService, 'getVocabularyByMetadataAndCollection').and.callThrough();
         spyOn((service as any).vocabularyDataService.findAllData, 'getFindAllHref').and.returnValue(observableOf(entriesRequestURL));
+        spyOn((service as any).vocabularyDataService.searchData, 'getSearchByHref').and.returnValue(observableOf(searchRequestURL));
       });
 
       afterEach(() => {
@@ -312,6 +314,23 @@ describe('VocabularyService', () => {
           expect(result).toBeObservable(expected);
         });
       });
+
+      describe('getVocabularyByMetadataAndCollection', () => {
+        it('should proxy the call to vocabularyDataService.getVocabularyByMetadataAndCollection', () => {
+          scheduler.schedule(() => service.getVocabularyByMetadataAndCollection(metadata, collectionUUID));
+          scheduler.flush();
+
+          expect((service as any).vocabularyDataService.getVocabularyByMetadataAndCollection).toHaveBeenCalledWith(metadata, collectionUUID, true, true);
+        });
+
+        it('should return a RemoteData<Vocabulary> for the object with the given metadata and collection', () => {
+          const result = service.getVocabularyByMetadataAndCollection(metadata, collectionUUID);
+          const expected = cold('a|', {
+            a: vocabularyRD
+          });
+          expect(result).toBeObservable(expected);
+        });
+      });
     });
 
     describe('vocabulary entries', () => {
diff --git a/src/app/core/submission/vocabularies/vocabulary.service.ts b/src/app/core/submission/vocabularies/vocabulary.service.ts
index 1ff5b30ee08..2dd2cc3792f 100644
--- a/src/app/core/submission/vocabularies/vocabulary.service.ts
+++ b/src/app/core/submission/vocabularies/vocabulary.service.ts
@@ -87,6 +87,23 @@ export class VocabularyService {
     return this.vocabularyDataService.findAll(options, useCachedVersionIfAvailable, reRequestOnStale, ...linksToFollow);
   }
 
+  /**
+     * Return the controlled vocabulary configured for the specified metadata and collection if any
+     * @param metadataField               metadata field to search
+     * @param collectionUUID              collection UUID where is configured the vocabulary
+     * @param useCachedVersionIfAvailable If this is true, the request will only be sent if there's
+     *                                    no valid cached version. Defaults to true
+     * @param reRequestOnStale            Whether or not the request should automatically be re-
+     *                                    requested after the response becomes stale
+     * @param linksToFollow               List of {@link FollowLinkConfig} that indicate which
+     *                                    {@link HALLink}s should be automatically resolved
+     * @return {Observable<RemoteData<Vocabulary>>}
+     *    Return an observable that emits vocabulary object
+     */
+  getVocabularyByMetadataAndCollection(metadataField: string, collectionUUID: string, useCachedVersionIfAvailable = true, reRequestOnStale = true, ...linksToFollow: FollowLinkConfig<Vocabulary>[]): Observable<RemoteData<Vocabulary>> {
+    return this.vocabularyDataService.getVocabularyByMetadataAndCollection(metadataField, collectionUUID, useCachedVersionIfAvailable, reRequestOnStale, ...linksToFollow);
+  }
+
   /**
    * Return the {@link VocabularyEntry} list for a given {@link Vocabulary}
    *
diff --git a/src/app/shared/testing/vocabulary-service.stub.ts b/src/app/shared/testing/vocabulary-service.stub.ts
index f6a578dd3df..a0f11303694 100644
--- a/src/app/shared/testing/vocabulary-service.stub.ts
+++ b/src/app/shared/testing/vocabulary-service.stub.ts
@@ -42,4 +42,8 @@ export class VocabularyServiceStub {
   findVocabularyById(id: string): Observable<RemoteData<Vocabulary>> {
     return;
   }
+
+  getVocabularyByMetadataAndCollection(metadataField: string, collectionUUID: string): Observable<RemoteData<Vocabulary>> {
+    return createSuccessfulRemoteDataObject$(null);
+  }
 }

From c596c6eb144d0c263cafbf8357e33f2df54c9c61 Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Wed, 3 Jan 2024 11:08:07 +0100
Subject: [PATCH 2/9] Add aria-label and loadingInitialValue property to
 DsDynamicOneboxComponent

---
 .../models/onebox/dynamic-onebox.component.html      |  6 ++++--
 .../models/onebox/dynamic-onebox.component.ts        | 12 ++++++++++++
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.html b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.html
index 3c19ecda13f..8681f134339 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.html
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.html
@@ -21,8 +21,8 @@
 </ng-template>
 
 <div *ngIf="!(isHierarchicalVocabulary() | async)" class="position-relative right-addon">
-  <i *ngIf="searching" class="fas fa-circle-notch fa-spin fa-2x fa-fw text-primary position-absolute mt-1 p-0" aria-hidden="true"></i>
-  <i *ngIf="!searching"
+  <i *ngIf="searching || loadingInitialValue" class="fas fa-circle-notch fa-spin fa-2x fa-fw text-primary position-absolute mt-1 p-0" aria-hidden="true"></i>
+  <i *ngIf="!searching && !loadingInitialValue"
      dsAuthorityConfidenceState
      class="far fa-circle fa-2x fa-fw position-absolute mt-1 p-0"
      aria-hidden="true"
@@ -32,6 +32,7 @@
          class="form-control"
          [attr.aria-labelledby]="'label_' + model.id"
          [attr.autoComplete]="model.autoComplete"
+         [attr.aria-label]="model.label | translate"
          [class.is-invalid]="showErrorMessages"
          [id]="model.id"
          [inputFormatter]="formatter"
@@ -58,6 +59,7 @@
   <input class="form-control"
          [attr.aria-labelledby]="'label_' + model.id"
          [attr.autoComplete]="model.autoComplete"
+         [attr.aria-label]="model.label | translate"
          [class.is-invalid]="showErrorMessages"
          [class.tree-input]="!model.readOnly"
          [id]="id"
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
index 2ff4256404d..339bc11a42e 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
@@ -55,6 +55,7 @@ export class DsDynamicOneboxComponent extends DsDynamicVocabularyComponent imple
 
   pageInfo: PageInfo = new PageInfo();
   searching = false;
+  loadingInitialValue = false;
   searchFailed = false;
   hideSearchingWhenUnsubscribed$ = new Observable(() => () => this.changeSearchingStatus(false));
   click$ = new Subject<string>();
@@ -151,6 +152,15 @@ export class DsDynamicOneboxComponent extends DsDynamicVocabularyComponent imple
     this.cdr.detectChanges();
   }
 
+  /**
+   * Changes the loadingInitialValue status
+   * @param status
+   */
+  changeLoadingInitialValueStatus(status: boolean) {
+    this.loadingInitialValue = status;
+    this.cdr.detectChanges();
+  }
+
   /**
    * Checks if configured vocabulary is Hierarchical or not
    */
@@ -257,8 +267,10 @@ export class DsDynamicOneboxComponent extends DsDynamicVocabularyComponent imple
   setCurrentValue(value: any, init = false): void {
     let result: string;
     if (init) {
+      this.changeLoadingInitialValueStatus(true);
       this.getInitValueFromModel()
         .subscribe((formValue: FormFieldMetadataValueObject) => {
+          this.changeLoadingInitialValueStatus(false);
           this.currentValue = formValue;
           this.cdr.detectChanges();
         });

From 439739ab42c010db9f9c4cf081f405e75a8e7902 Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Wed, 3 Jan 2024 11:10:09 +0100
Subject: [PATCH 3/9] Add support for MetadataValue class to
 AuthorityConfidenceStateDirective

---
 .../directives/authority-confidence-state.directive.ts     | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/app/shared/form/directives/authority-confidence-state.directive.ts b/src/app/shared/form/directives/authority-confidence-state.directive.ts
index 49eee5ae8f2..70e3a052e92 100644
--- a/src/app/shared/form/directives/authority-confidence-state.directive.ts
+++ b/src/app/shared/form/directives/authority-confidence-state.directive.ts
@@ -28,6 +28,7 @@ import { isNotEmpty, isNull } from '../../empty.util';
 import { ConfidenceIconConfig } from '../../../../config/submission-config.interface';
 import { environment } from '../../../../environments/environment';
 import { VocabularyEntryDetail } from '../../../core/submission/vocabularies/models/vocabulary-entry-detail.model';
+import { MetadataValue } from '../../../core/shared/metadata.models';
 
 /**
  * Directive to add to the element a bootstrap utility class based on metadata confidence value
@@ -40,7 +41,7 @@ export class AuthorityConfidenceStateDirective implements OnChanges, AfterViewIn
   /**
    * The metadata value
    */
-  @Input() authorityValue: VocabularyEntry | FormFieldMetadataValueObject | string;
+  @Input() authorityValue: VocabularyEntry | FormFieldMetadataValueObject | MetadataValue | string;
 
   /**
    * A boolean representing if to show html icon if authority value is empty
@@ -131,6 +132,10 @@ export class AuthorityConfidenceStateDirective implements OnChanges, AfterViewIn
       confidence = value.confidence;
     }
 
+    if (isNotEmpty(value) && value instanceof MetadataValue) {
+      confidence = value.confidence;
+    }
+
     return confidence;
   }
 

From 45eaa87f9c3697335879cdb2cefd75b03591384a Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Wed, 3 Jan 2024 11:11:09 +0100
Subject: [PATCH 4/9] Implementation of controlled vocabularies value selectors
 during item editing

---
 ...-edit-metadata-field-values.component.html |   1 +
 .../dso-edit-metadata-form.ts                 |  10 +-
 .../dso-edit-metadata-value.component.html    |  56 +++-
 .../dso-edit-metadata-value.component.spec.ts | 307 ++++++++++++++++++
 .../dso-edit-metadata-value.component.ts      | 231 ++++++++++++-
 src/app/dso-shared/dso-shared.module.ts       |   2 +
 src/assets/i18n/en.json5                      |   8 +
 7 files changed, 603 insertions(+), 12 deletions(-)

diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-field-values/dso-edit-metadata-field-values.component.html b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-field-values/dso-edit-metadata-field-values.component.html
index 9f74216d54f..aee9fb980cf 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-field-values/dso-edit-metadata-field-values.component.html
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-field-values/dso-edit-metadata-field-values.component.html
@@ -3,6 +3,7 @@
   <ds-dso-edit-metadata-value *ngFor="let mdValue of form.fields[mdField]; let idx = index" role="presentation"
                               [dso]="dso"
                               [mdValue]="mdValue"
+                              [mdField]="mdField"
                               [dsoType]="dsoType"
                               [saving$]="saving$"
                               [isOnlyValue]="form.fields[mdField].length === 1"
diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-form.ts b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-form.ts
index 8206ec91359..7d162aa146a 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-form.ts
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-form.ts
@@ -75,7 +75,8 @@ export class DsoEditMetadataValue {
   confirmChanges(finishEditing = false) {
     this.reordered = this.originalValue.place !== this.newValue.place;
     if (hasNoValue(this.change) || this.change === DsoEditMetadataChangeType.UPDATE) {
-      if ((this.originalValue.value !== this.newValue.value || this.originalValue.language !== this.newValue.language)) {
+      if (this.originalValue.value !== this.newValue.value || this.originalValue.language !== this.newValue.language
+        || this.originalValue.authority !== this.newValue.authority || this.originalValue.confidence !== this.newValue.confidence) {
         this.change = DsoEditMetadataChangeType.UPDATE;
       } else {
         this.change = undefined;
@@ -404,10 +405,13 @@ export class DsoEditMetadataForm {
           if (hasValue(value.change)) {
             if (value.change === DsoEditMetadataChangeType.UPDATE) {
               // Only changes to value or language are considered "replace" operations. Changes to place are considered "move", which is processed below.
-              if (value.originalValue.value !== value.newValue.value || value.originalValue.language !== value.newValue.language) {
+              if (value.originalValue.value !== value.newValue.value || value.originalValue.language !== value.newValue.language
+                || value.originalValue.authority !== value.newValue.authority  || value.originalValue.confidence !== value.newValue.confidence) {
                 replaceOperations.push(new MetadataPatchReplaceOperation(field, value.originalValue.place, {
                   value: value.newValue.value,
                   language: value.newValue.language,
+                  authority: value.newValue.authority,
+                  confidence: value.newValue.confidence
                 }));
               }
             } else if (value.change === DsoEditMetadataChangeType.REMOVE) {
@@ -416,6 +420,8 @@ export class DsoEditMetadataForm {
               addOperations.push(new MetadataPatchAddOperation(field, {
                 value: value.newValue.value,
                 language: value.newValue.language,
+                authority: value.newValue.authority,
+                confidence: value.newValue.confidence
               }));
             } else {
               console.warn('Illegal metadata change state detected for', value);
diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
index 47449bda5c9..c128b5a3f62 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
@@ -1,11 +1,51 @@
 <div class="d-flex flex-row ds-value-row" *ngVar="mdValue.newValue.isVirtual as isVirtual" role="row"
      cdkDrag (cdkDragStarted)="dragging.emit(true)" (cdkDragEnded)="dragging.emit(false)"
      [ngClass]="{ 'ds-warning': mdValue.reordered || mdValue.change === DsoEditMetadataChangeTypeEnum.UPDATE, 'ds-danger': mdValue.change === DsoEditMetadataChangeTypeEnum.REMOVE, 'ds-success': mdValue.change === DsoEditMetadataChangeTypeEnum.ADD, 'h-100': isOnlyValue }">
-  <div class="flex-grow-1 ds-flex-cell ds-value-cell d-flex align-items-center" *ngVar="(mdRepresentation$ | async) as mdRepresentation" role="cell">
+  <div class="flex-grow-1 ds-flex-cell ds-value-cell d-flex flex-column" *ngVar="(mdRepresentation$ | async) as mdRepresentation" role="cell">
     <div class="dont-break-out preserve-line-breaks" *ngIf="!mdValue.editing && !mdRepresentation">{{ mdValue.newValue.value }}</div>
-    <textarea class="form-control" rows="5" *ngIf="mdValue.editing && !mdRepresentation" [(ngModel)]="mdValue.newValue.value"
+    <textarea class="form-control" rows="5" *ngIf="mdValue.editing && !mdRepresentation && !(isAuthorityControlled() | async)" [(ngModel)]="mdValue.newValue.value"
               [attr.aria-label]="(dsoType + '.edit.metadata.edit.value') | translate"
               [dsDebounce]="300" (onDebounce)="confirm.emit(false)"></textarea>
+    <ds-dynamic-scrollable-dropdown *ngIf="mdValue.editing && (isScrollableVocabulary() | async)"
+                                    [bindId]="mdField"
+                                    [group]="group"
+                                    [model]="getModel() | async"
+                                    (change)="onChangeAuthorityField($event)">
+    </ds-dynamic-scrollable-dropdown>
+    <ds-dynamic-onebox *ngIf="mdValue.editing && ((isHierarchicalVocabulary() | async) || (isSuggesterVocabulary() | async))"
+                      [group]="group"
+                      [model]="getModel() | async"
+                      (change)="onChangeAuthorityField($event)">
+    </ds-dynamic-onebox>
+    <div *ngIf="!isVirtual && !mdValue.editing && mdValue.newValue.authority">
+      <span class="badge badge-light border" >
+        <i dsAuthorityConfidenceState
+           class="far fa-circle fa-fw p-0"
+           aria-hidden="true"
+           [authorityValue]="mdValue.newValue"
+        ></i>
+        {{ dsoType + '.edit.metadata.authority.label' | translate }} {{ mdValue.newValue.authority }}
+      </span>
+    </div>
+    <div class="mt-2" *ngIf=" mdValue.editing && (isAuthorityControlled() | async) && (isSuggesterVocabulary() | async)">
+      <div class="btn-group w-75">
+        <input class="form-control form-outline" [(ngModel)]="mdValue.newValue.authority" [disabled]="!editingAuthority"
+              [attr.aria-label]="(dsoType + '.edit.metadata.edit.authority.key') | translate"
+              (change)="onChangeAuthorityKey()" />
+        <button class="btn btn-outline-secondary btn-sm ng-star-inserted" id="metadata-confirm-btn" *ngIf="!editingAuthority"
+                [title]="dsoType + '.edit.metadata.edit.buttons.open-authority-edition' | translate"
+                ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.open-authority-edition' | translate }}"
+                (click)="onChangeEditingAuthorityStatus(true)">
+          <i class="fas fa-lock fa-fw"></i>
+        </button>
+        <button class="btn btn-outline-success btn-sm ng-star-inserted" id="metadata-confirm-btn" *ngIf="editingAuthority"
+                [title]="dsoType + '.edit.metadata.edit.buttons.close-authority-edition' | translate"
+                ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.close-authority-edition' | translate }}"
+                (click)="onChangeEditingAuthorityStatus(false)">
+          <i class="fas fa-lock-open fa-fw"></i>
+        </button>
+      </div>
+    </div>
     <div class="d-flex" *ngIf="mdRepresentation">
       <a class="mr-2" target="_blank" [routerLink]="mdRepresentationItemRoute$ | async">{{ mdRepresentationName$ | async }}</a>
       <ds-themed-type-badge [object]="mdRepresentation"></ds-themed-type-badge>
@@ -45,14 +85,14 @@
                   [disabled]="isVirtual || (!mdValue.change && mdValue.reordered) || (!mdValue.change && !mdValue.editing) || (saving$ | async)" (click)="undo.emit()">
             <i class="fas fa-undo-alt fa-fw"></i>
           </button>
+          <button class="btn btn-outline-secondary ds-drag-handle btn-sm" data-test="metadata-drag-btn" *ngVar="(isOnlyValue || (saving$ | async)) as disabled"
+                  cdkDragHandle [cdkDragHandleDisabled]="disabled" [ngClass]="{'disabled': disabled}" [disabled]="disabled"
+                  [title]="dsoType + '.edit.metadata.edit.buttons.drag' | translate"
+                  ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.drag' | translate }}">
+            <i class="fas fa-grip-vertical fa-fw"></i>
+          </button>
         </div>
       </div>
-      <button class="btn btn-outline-secondary ds-drag-handle btn-sm" data-test="metadata-drag-btn" *ngVar="(isOnlyValue || (saving$ | async)) as disabled"
-              cdkDragHandle [cdkDragHandleDisabled]="disabled" [ngClass]="{'disabled': disabled}" [disabled]="disabled"
-              [title]="dsoType + '.edit.metadata.edit.buttons.drag' | translate"
-              ngbTooltip="{{ dsoType + '.edit.metadata.edit.buttons.drag' | translate }}">
-        <i class="fas fa-grip-vertical fa-fw"></i>
-      </button>
     </div>
   </div>
 </div>
diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts
index 459095ea67b..080a22dd7c6 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts
@@ -11,6 +11,18 @@ import { ItemMetadataRepresentation } from '../../../core/shared/metadata-repres
 import { MetadataValue, VIRTUAL_METADATA_PREFIX } from '../../../core/shared/metadata.models';
 import { DsoEditMetadataChangeType, DsoEditMetadataValue } from '../dso-edit-metadata-form';
 import { By } from '@angular/platform-browser';
+import { ItemDataService } from '../../../core/data/item-data.service';
+import { Item } from '../../../core/shared/item.model';
+import { createSuccessfulRemoteDataObject$ } from '../../../shared/remote-data.utils';
+import { Collection } from '../../../core/shared/collection.model';
+import { DSpaceObject } from '../../../core/shared/dspace-object.model';
+import { Vocabulary } from 'src/app/core/submission/vocabularies/models/vocabulary.model';
+import { VocabularyServiceStub } from 'src/app/shared/testing/vocabulary-service.stub';
+import { VocabularyService } from 'src/app/core/submission/vocabularies/vocabulary.service';
+import { ConfidenceType } from 'src/app/core/shared/confidence-type';
+import { DynamicOneboxModel } from 'src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model';
+import { Observable } from 'rxjs';
+import { DynamicScrollableDropdownModel } from 'src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model';
 
 const EDIT_BTN = 'edit';
 const CONFIRM_BTN = 'confirm';
@@ -24,9 +36,76 @@ describe('DsoEditMetadataValueComponent', () => {
 
   let relationshipService: RelationshipDataService;
   let dsoNameService: DSONameService;
+  let vocabularyServiceStub: any;
+  let itemService: ItemDataService;
 
   let editMetadataValue: DsoEditMetadataValue;
   let metadataValue: MetadataValue;
+  let dso: DSpaceObject;
+
+  const collection =  Object.assign(new Collection(), {
+    uuid: 'fake-uuid'
+  });
+
+  const item = Object.assign(new Item(), {
+    _links: {
+      self: { href: 'fake-item-url/item' }
+    },
+    id: 'item',
+    uuid: 'item',
+    owningCollection: createSuccessfulRemoteDataObject$(collection)
+  });
+
+  const mockVocabularyScrollable: Vocabulary = {
+    id: 'scrollable',
+    name: 'scrollable',
+    scrollable: true,
+    hierarchical: false,
+    preloadLevel: 0,
+    type: 'vocabulary',
+    _links: {
+      self: {
+        href: 'self'
+      },
+      entries: {
+        href: 'entries'
+      }
+    }
+  };
+
+  const mockVocabularyHierarchical: Vocabulary = {
+    id: 'hierarchical',
+    name: 'hierarchical',
+    scrollable: false,
+    hierarchical: true,
+    preloadLevel: 2,
+    type: 'vocabulary',
+    _links: {
+      self: {
+        href: 'self'
+      },
+      entries: {
+        href: 'entries'
+      }
+    }
+  };
+
+  const mockVocabularySuggester: Vocabulary = {
+    id: 'suggester',
+    name: 'suggester',
+    scrollable: false,
+    hierarchical: false,
+    preloadLevel: 0,
+    type: 'vocabulary',
+    _links: {
+      self: {
+        href: 'self'
+      },
+      entries: {
+        href: 'entries'
+      }
+    }
+  };
 
   function initServices(): void {
     relationshipService = jasmine.createSpyObj('relationshipService', {
@@ -35,6 +114,10 @@ describe('DsoEditMetadataValueComponent', () => {
     dsoNameService = jasmine.createSpyObj('dsoNameService', {
       getName: 'Related Name',
     });
+    itemService = jasmine.createSpyObj('itemService', {
+      findByHref: createSuccessfulRemoteDataObject$(item)
+    });
+    vocabularyServiceStub = new VocabularyServiceStub();
   }
 
   beforeEach(waitForAsync(() => {
@@ -45,6 +128,11 @@ describe('DsoEditMetadataValueComponent', () => {
       authority: undefined,
     });
     editMetadataValue = new DsoEditMetadataValue(metadataValue);
+    dso = Object.assign(new DSpaceObject(), {
+      _links: {
+        self: { href: 'fake-dso-url/dso' }
+      },
+    });
 
     initServices();
 
@@ -54,6 +142,8 @@ describe('DsoEditMetadataValueComponent', () => {
       providers: [
         { provide: RelationshipDataService, useValue: relationshipService },
         { provide: DSONameService, useValue: dsoNameService },
+        { provide: VocabularyService, useValue: vocabularyServiceStub },
+        { provide: ItemDataService, useValue: itemService }
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).compileComponents();
@@ -63,6 +153,7 @@ describe('DsoEditMetadataValueComponent', () => {
     fixture = TestBed.createComponent(DsoEditMetadataValueComponent);
     component = fixture.componentInstance;
     component.mdValue = editMetadataValue;
+    component.dso = dso;
     component.saving$ = of(false);
     fixture.detectChanges();
   });
@@ -144,6 +235,222 @@ describe('DsoEditMetadataValueComponent', () => {
     assertButton(DRAG_BTN, true, false);
   });
 
+  describe('when the metadata field not uses a vocabulary and is editing', () => {
+    beforeEach(waitForAsync(() => {
+      spyOn(vocabularyServiceStub, 'getVocabularyByMetadataAndCollection').and.returnValue(createSuccessfulRemoteDataObject$(null, 204));
+      metadataValue = Object.assign(new MetadataValue(), {
+        value: 'Regular value',
+        language: 'en',
+        place: 0,
+        authority: null,
+      });
+      editMetadataValue = new DsoEditMetadataValue(metadataValue);
+      editMetadataValue.editing = true;
+      component.mdValue = editMetadataValue;
+      component.mdField = 'metadata.regular';
+      component.ngOnInit();
+      fixture.detectChanges();
+    }));
+
+    it('should render a textarea', () => {
+      expect(vocabularyServiceStub.getVocabularyByMetadataAndCollection).toHaveBeenCalled();
+      expect(fixture.debugElement.query(By.css('textarea'))).toBeTruthy();
+    });
+  });
+
+  describe('when the metadata field uses a scrollable vocabulary and is editing', () => {
+    beforeEach(waitForAsync(() => {
+      spyOn(vocabularyServiceStub, 'getVocabularyByMetadataAndCollection').and.returnValue(createSuccessfulRemoteDataObject$(mockVocabularyScrollable));
+      metadataValue = Object.assign(new MetadataValue(), {
+        value: 'Authority Controlled value',
+        language: 'en',
+        place: 0,
+        authority: null,
+      });
+      editMetadataValue = new DsoEditMetadataValue(metadataValue);
+      editMetadataValue.editing = true;
+      component.mdValue = editMetadataValue;
+      component.mdField = 'metadata.scrollable';
+      component.ngOnInit();
+      fixture.detectChanges();
+    }));
+
+    it('should render the DsDynamicScrollableDropdownComponent', () => {
+      expect(vocabularyServiceStub.getVocabularyByMetadataAndCollection).toHaveBeenCalled();
+      expect(fixture.debugElement.query(By.css('ds-dynamic-scrollable-dropdown'))).toBeTruthy();
+    });
+
+    it('getModel should return a DynamicScrollableDropdownModel', () => {
+      const result = component.getModel();
+
+      expect(result instanceof Observable).toBe(true);
+
+      result.subscribe((model) => {
+        expect(model instanceof DynamicScrollableDropdownModel).toBe(true);
+        expect(model.vocabularyOptions.name).toBe(mockVocabularyScrollable.name);
+      });
+    });
+  });
+
+  describe('when the  metadata field uses a hierarchical vocabulary and is editing', () => {
+    beforeEach(waitForAsync(() => {
+      spyOn(vocabularyServiceStub, 'getVocabularyByMetadataAndCollection').and.returnValue(createSuccessfulRemoteDataObject$(mockVocabularyHierarchical));
+      metadataValue = Object.assign(new MetadataValue(), {
+        value: 'Authority Controlled value',
+        language: 'en',
+        place: 0,
+        authority: null,
+      });
+      editMetadataValue = new DsoEditMetadataValue(metadataValue);
+      editMetadataValue.editing = true;
+      component.mdValue = editMetadataValue;
+      component.mdField = 'metadata.hierarchical';
+      component.ngOnInit();
+      fixture.detectChanges();
+    }));
+
+    it('should render the DsDynamicOneboxComponent', () => {
+      expect(vocabularyServiceStub.getVocabularyByMetadataAndCollection).toHaveBeenCalled();
+      expect(fixture.debugElement.query(By.css('ds-dynamic-onebox'))).toBeTruthy();
+    });
+
+    it('getModel should return a DynamicOneboxModel', () => {
+      const result = component.getModel();
+
+      expect(result instanceof Observable).toBe(true);
+
+      result.subscribe((model) => {
+        expect(model instanceof DynamicOneboxModel).toBe(true);
+        expect(model.vocabularyOptions.name).toBe(mockVocabularyHierarchical.name);
+      });
+    });
+  });
+
+  describe('when the metadata field uses a suggester vocabulary and is editing', () => {
+    beforeEach(waitForAsync(() => {
+      spyOn(vocabularyServiceStub, 'getVocabularyByMetadataAndCollection').and.returnValue(createSuccessfulRemoteDataObject$(mockVocabularySuggester));
+      spyOn(component.confirm, 'emit');
+      metadataValue = Object.assign(new MetadataValue(), {
+        value: 'Authority Controlled value',
+        language: 'en',
+        place: 0,
+        authority: 'authority-key',
+        confidence: ConfidenceType.CF_UNCERTAIN
+      });
+      editMetadataValue = new DsoEditMetadataValue(metadataValue);
+      editMetadataValue.editing = true;
+      component.mdValue = editMetadataValue;
+      component.mdField = 'metadata.suggester';
+      component.ngOnInit();
+      fixture.detectChanges();
+    }));
+
+    it('should render the DsDynamicOneboxComponent', () => {
+      expect(vocabularyServiceStub.getVocabularyByMetadataAndCollection).toHaveBeenCalled();
+      expect(fixture.debugElement.query(By.css('ds-dynamic-onebox'))).toBeTruthy();
+    });
+
+    it('getModel should return a DynamicOneboxModel', () => {
+      const result = component.getModel();
+
+      expect(result instanceof Observable).toBe(true);
+
+      result.subscribe((model) => {
+        expect(model instanceof DynamicOneboxModel).toBe(true);
+        expect(model.vocabularyOptions.name).toBe(mockVocabularySuggester.name);
+      });
+    });
+
+    describe('authority key edition', () => {
+
+      it('should update confidence to CF_NOVALUE when authority is cleared', () => {
+        component.mdValue.newValue.authority = '';
+
+        component.onChangeAuthorityKey();
+
+        expect(component.mdValue.newValue.confidence).toBe(ConfidenceType.CF_NOVALUE);
+        expect(component.confirm.emit).toHaveBeenCalledWith(false);
+      });
+
+      it('should update confidence to CF_ACCEPTED when authority key is edited', () => {
+        component.mdValue.newValue.authority = 'newAuthority';
+        component.mdValue.originalValue.authority = 'oldAuthority';
+
+        component.onChangeAuthorityKey();
+
+        expect(component.mdValue.newValue.confidence).toBe(ConfidenceType.CF_ACCEPTED);
+        expect(component.confirm.emit).toHaveBeenCalledWith(false);
+      });
+
+      it('should not update confidence when authority key remains the same', () => {
+        component.mdValue.newValue.authority = 'sameAuthority';
+        component.mdValue.originalValue.authority = 'sameAuthority';
+
+        component.onChangeAuthorityKey();
+
+        expect(component.mdValue.newValue.confidence).toBe(ConfidenceType.CF_UNCERTAIN);
+        expect(component.confirm.emit).not.toHaveBeenCalled();
+      });
+
+      it('should call onChangeEditingAuthorityStatus with true when clicking the lock button', () => {
+        spyOn(component, 'onChangeEditingAuthorityStatus');
+        const lockButton = fixture.nativeElement.querySelector('#metadata-confirm-btn');
+
+        lockButton.click();
+
+        expect(component.onChangeEditingAuthorityStatus).toHaveBeenCalledWith(true);
+      });
+
+      it('should disable the input when editingAuthority is false', () => {
+        component.editingAuthority = false;
+
+        fixture.detectChanges();
+
+        const inputElement = fixture.nativeElement.querySelector('input');
+        expect(inputElement.disabled).toBe(true);
+      });
+
+      it('should enable the input when editingAuthority is true', () => {
+        component.editingAuthority = true;
+
+        fixture.detectChanges();
+
+        const inputElement = fixture.nativeElement.querySelector('input');
+        expect(inputElement.disabled).toBe(false);
+      });
+
+      it('should update mdValue.newValue properties when authority is present', () => {
+        const event = {
+          value: 'Some value',
+          authority: 'Some authority',
+        };
+
+        component.onChangeAuthorityField(event);
+
+        expect(component.mdValue.newValue.value).toBe(event.value);
+        expect(component.mdValue.newValue.authority).toBe(event.authority);
+        expect(component.mdValue.newValue.confidence).toBe(ConfidenceType.CF_ACCEPTED);
+        expect(component.confirm.emit).toHaveBeenCalledWith(false);
+      });
+
+      it('should update mdValue.newValue properties when authority is not present', () => {
+        const event = {
+          value: 'Some value',
+          authority: null,
+        };
+
+        component.onChangeAuthorityField(event);
+
+        expect(component.mdValue.newValue.value).toBe(event.value);
+        expect(component.mdValue.newValue.authority).toBeNull();
+        expect(component.mdValue.newValue.confidence).toBe(ConfidenceType.CF_UNSET);
+        expect(component.confirm.emit).toHaveBeenCalledWith(false);
+      });
+
+    });
+
+  });
+
   function assertButton(name: string, exists: boolean, disabled: boolean = false): void {
     describe(`${name} button`, () => {
       let btn: DebugElement;
diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts
index 3fdcd381abc..578d4c3c44d 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts
@@ -8,10 +8,25 @@ import {
 import { RelationshipDataService } from '../../../core/data/relationship-data.service';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import { ItemMetadataRepresentation } from '../../../core/shared/metadata-representation/item/item-metadata-representation.model';
-import { map } from 'rxjs/operators';
+import { map, switchMap } 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';
+import { VocabularyService } from 'src/app/core/submission/vocabularies/vocabulary.service';
+import { Vocabulary } from '../../../core/submission/vocabularies/models/vocabulary.model';
+import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
+import { VocabularyOptions } from '../../../core/submission/vocabularies/models/vocabulary-options.model';
+import { ConfidenceType } from '../../../core/shared/confidence-type';
+import { getFirstSucceededRemoteData, getFirstSucceededRemoteDataPayload, getRemoteDataPayload } from '../../../core/shared/operators';
+import { DsDynamicOneboxModelConfig, DynamicOneboxModel } from '../../../shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model';
+import { DynamicScrollableDropdownModel, DynamicScrollableDropdownModelConfig } from '../../../shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model';
+import { ItemDataService } from '../../../core/data/item-data.service';
+import { followLink } from '../../../shared/utils/follow-link-config.model';
+import { Item } from '../../../core/shared/item.model';
+import { Collection } from '../../../core/shared/collection.model';
+import { FormFieldMetadataValueObject } from '../../../shared/form/builder/models/form-field-metadata-value.model';
+import { isNotEmpty } from '../../../shared/empty.util';
+import { of as observableOf } from 'rxjs';
 
 @Component({
   selector: 'ds-dso-edit-metadata-value',
@@ -51,6 +66,11 @@ export class DsoEditMetadataValueComponent implements OnInit {
    */
   @Input() isOnlyValue = false;
 
+  /**
+   * MetadataField to edit
+   */
+  @Input() mdField?: string;
+
   /**
    * Emits when the user clicked edit
    */
@@ -82,6 +102,12 @@ export class DsoEditMetadataValueComponent implements OnInit {
    */
   public DsoEditMetadataChangeTypeEnum = DsoEditMetadataChangeType;
 
+  /**
+   * The ConfidenceType enumeration for access in the component's template
+   * @type {ConfidenceType}
+   */
+  public ConfidenceTypeEnum = ConfidenceType;
+
   /**
    * The item this metadata value represents in case it's virtual (if any, otherwise null)
    */
@@ -97,12 +123,44 @@ export class DsoEditMetadataValueComponent implements OnInit {
    */
   mdRepresentationName$: Observable<string | null>;
 
+  /**
+   * Whether or not the authority field is currently being edited
+   */
+  public editingAuthority = false;
+
+  /**
+   * Field group used by authority field
+   * @type {UntypedFormGroup}
+   */
+  group = new UntypedFormGroup({ authorityField : new UntypedFormControl()});
+
+  /**
+   * Observable property of the model to use for editinf authorities values
+   */
+  private model$: Observable<DynamicOneboxModel | DynamicScrollableDropdownModel>;
+
+  /**
+   * Observable with information about the authority vocabulary used
+   */
+  private vocabulary$: Observable<Vocabulary>;
+
+  /**
+   * Observables with information about the authority vocabulary type used
+   */
+  private isAuthorityControlled$: Observable<boolean>;
+  private isHierarchicalVocabulary$: Observable<boolean>;
+  private isScrollableVocabulary$: Observable<boolean>;
+  private isSuggesterVocabulary$: Observable<boolean>;
+
   constructor(protected relationshipService: RelationshipDataService,
-              protected dsoNameService: DSONameService) {
+              protected dsoNameService: DSONameService,
+              protected vocabularyService: VocabularyService,
+              protected itemService: ItemDataService) {
   }
 
   ngOnInit(): void {
     this.initVirtualProperties();
+    this.initAuthorityProperties();
   }
 
   /**
@@ -123,4 +181,173 @@ export class DsoEditMetadataValueComponent implements OnInit {
       map((mdRepresentation: ItemMetadataRepresentation) => mdRepresentation ? this.dsoNameService.getName(mdRepresentation) : null),
     );
   }
+
+  /**
+   * Initialise potential properties of a authority controlled metadata field
+   */
+  initAuthorityProperties(): void {
+
+    if (isNotEmpty(this.mdField)) {
+
+      const owningCollection$: Observable<Collection> = this.itemService.findByHref(this.dso._links.self.href, true, true, followLink('owningCollection'))
+        .pipe(
+          getFirstSucceededRemoteData(),
+          getRemoteDataPayload(),
+          switchMap((item: Item) => item.owningCollection),
+          getFirstSucceededRemoteData(),
+          getRemoteDataPayload()
+        );
+
+      this.vocabulary$ = owningCollection$.pipe(
+        switchMap((c: Collection) => this.vocabularyService
+          .getVocabularyByMetadataAndCollection(this.mdField, c.uuid)
+            .pipe(
+              getFirstSucceededRemoteDataPayload()
+        ))
+      );
+    } else {
+      this.vocabulary$ = observableOf(undefined);
+    }
+
+    this.isAuthorityControlled$ = this.vocabulary$.pipe(
+      map((result: Vocabulary) => isNotEmpty(result))
+    );
+
+    this.isHierarchicalVocabulary$ = this.vocabulary$.pipe(
+      map((result: Vocabulary) => isNotEmpty(result) && result.hierarchical)
+    );
+
+    this.isScrollableVocabulary$ = this.vocabulary$.pipe(
+      map((result: Vocabulary) => isNotEmpty(result) && result.scrollable)
+    );
+
+    this.isSuggesterVocabulary$ = this.vocabulary$.pipe(
+      map((result: Vocabulary) => isNotEmpty(result) && !result.hierarchical && !result.scrollable)
+    );
+
+    this.model$ = this.vocabulary$.pipe(
+        map((vocabulary: Vocabulary) => {
+          let formFieldValue;
+          if (isNotEmpty(this.mdValue.newValue.value)) {
+            formFieldValue = new FormFieldMetadataValueObject();
+            formFieldValue.value = this.mdValue.newValue.value;
+            formFieldValue.display = this.mdValue.newValue.value;
+            if (this.mdValue.newValue.authority) {
+              formFieldValue.authority = this.mdValue.newValue.authority;
+              formFieldValue.confidence = this.mdValue.newValue.confidence;
+            }
+          } else {
+            formFieldValue = this.mdValue.newValue.value;
+          }
+
+          let vocabularyOptions = vocabulary ? {
+            closed: false,
+            name: vocabulary.name
+          } as VocabularyOptions : null;
+
+          if (!vocabulary.scrollable) {
+            let model: DsDynamicOneboxModelConfig = {
+              id: 'authorityField',
+              label: `${this.dsoType}.edit.metadata.edit.value`,
+              vocabularyOptions: vocabularyOptions,
+              metadataFields: [this.mdField],
+              value: formFieldValue,
+              repeatable: false,
+              submissionId: 'edit-metadata',
+              hasSelectableMetadata: false,
+            };
+            return new DynamicOneboxModel(model);
+          } else {
+            let model: DynamicScrollableDropdownModelConfig = {
+              id: 'authorityField',
+              label: `${this.dsoType}.edit.metadata.edit.value`,
+              placeholder: `${this.dsoType}.edit.metadata.edit.value`,
+              vocabularyOptions: vocabularyOptions,
+              metadataFields: [this.mdField],
+              value: formFieldValue,
+              repeatable: false,
+              submissionId: 'edit-metadata',
+              hasSelectableMetadata: false,
+              maxOptions: 10
+            };
+            return new DynamicScrollableDropdownModel(model);
+          }
+      }));
+  }
+
+  /**
+   * Checks if this field use a authority vocabulary
+   */
+  isAuthorityControlled(): Observable<boolean> {
+    return this.isAuthorityControlled$;
+  }
+
+  /**
+   * Checks if configured vocabulary is Hierarchical or not
+   */
+  isHierarchicalVocabulary(): Observable<boolean> {
+    return this.isHierarchicalVocabulary$;
+  }
+
+  /**
+   * Checks if configured vocabulary is Scrollable or not
+   */
+  isScrollableVocabulary(): Observable<boolean> {
+    return this.isScrollableVocabulary$;
+  }
+
+  /**
+   * Checks if configured vocabulary is Suggester or not
+   * (a vocabulary not Scrollable and not Hierarchical that uses an autocomplete field)
+   */
+  isSuggesterVocabulary(): Observable<boolean> {
+    return this.isSuggesterVocabulary$;
+  }
+
+  /**
+   * Process the change of authority field value updating the authority key and confidence as necessary
+   */
+  onChangeAuthorityField(event): void {
+    this.mdValue.newValue.value = event.value;
+    if (event.authority) {
+      this.mdValue.newValue.authority = event.authority;
+      this.mdValue.newValue.confidence = ConfidenceType.CF_ACCEPTED;
+    } else {
+      this.mdValue.newValue.authority = null;
+      this.mdValue.newValue.confidence = ConfidenceType.CF_UNSET;
+    }
+    this.confirm.emit(false);
+  }
+
+  /**
+   * Returns an observable with the {@link DynamicOneboxModel} or {@link DynamicScrollableDropdownModel} model used
+   * for the authority field
+   */
+  getModel(): Observable<DynamicOneboxModel | DynamicScrollableDropdownModel> {
+    return this.model$;
+  }
+
+  /**
+   * Change the status of the editingAuthority property
+   * @param status
+   */
+  onChangeEditingAuthorityStatus(status: boolean) {
+    this.editingAuthority = status;
+  }
+
+  /**
+   * Processes the change in authority value, updating the confidence as necessary.
+   * If the authority key is cleared, the confidence is set to {@link ConfidenceType.CF_NOVALUE}.
+   * If the authority key is edited and differs from the original, the confidence is set to {@link ConfidenceType.CF_ACCEPTED}.
+   */
+  onChangeAuthorityKey() {
+    if (this.mdValue.newValue.authority === '') {
+      this.mdValue.newValue.confidence = ConfidenceType.CF_NOVALUE;
+      this.confirm.emit(false);
+    } else if (this.mdValue.newValue.authority !== this.mdValue.originalValue.authority) {
+      this.mdValue.newValue.confidence = ConfidenceType.CF_ACCEPTED;
+      this.confirm.emit(false);
+    }
+  }
+
 }
diff --git a/src/app/dso-shared/dso-shared.module.ts b/src/app/dso-shared/dso-shared.module.ts
index 7d44d6a9206..47a94c3de85 100644
--- a/src/app/dso-shared/dso-shared.module.ts
+++ b/src/app/dso-shared/dso-shared.module.ts
@@ -7,10 +7,12 @@ import { DsoEditMetadataValueComponent } from './dso-edit-metadata/dso-edit-meta
 import { DsoEditMetadataHeadersComponent } from './dso-edit-metadata/dso-edit-metadata-headers/dso-edit-metadata-headers.component';
 import { DsoEditMetadataValueHeadersComponent } from './dso-edit-metadata/dso-edit-metadata-value-headers/dso-edit-metadata-value-headers.component';
 import { ThemedDsoEditMetadataComponent } from './dso-edit-metadata/themed-dso-edit-metadata.component';
+import { FormModule } from '../shared/form/form.module';
 
 @NgModule({
   imports: [
     SharedModule,
+    FormModule
   ],
   declarations: [
     DsoEditMetadataComponent,
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index c75336e9077..6e9f924c663 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -2152,6 +2152,8 @@
 
   "item.edit.metadata.edit.value": "Edit value",
 
+  "item.edit.metadata.edit.authority.key": "Edit authority key",
+
   "item.edit.metadata.edit.buttons.confirm": "Confirm",
 
   "item.edit.metadata.edit.buttons.drag": "Drag to reorder",
@@ -2206,6 +2208,12 @@
 
   "item.edit.metadata.save-button": "Save",
 
+  "item.edit.metadata.authority.label": "Authority: ",
+
+  "item.edit.metadata.edit.buttons.open-authority-edition": "Unlock the authority key value for manual editing",
+
+  "item.edit.metadata.edit.buttons.close-authority-edition": "Lock the authority key value for manual editing",
+
   "item.edit.modify.overview.field": "Field",
 
   "item.edit.modify.overview.language": "Language",

From a5512f08e71c4a0c40f0c92e4df5b12c40753bcf Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Mon, 12 Feb 2024 22:24:55 +0100
Subject: [PATCH 5/9] No display authority key if confidence is unset (-1) or
 no-value (0)

---
 .../dso-edit-metadata-value.component.html                      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
index c128b5a3f62..5ff1c5f4eda 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
@@ -17,7 +17,7 @@
                       [model]="getModel() | async"
                       (change)="onChangeAuthorityField($event)">
     </ds-dynamic-onebox>
-    <div *ngIf="!isVirtual && !mdValue.editing && mdValue.newValue.authority">
+    <div *ngIf="!isVirtual && !mdValue.editing && mdValue.newValue.authority && mdValue.newValue.confidence !== ConfidenceTypeEnum.CF_UNSET && mdValue.newValue.confidence !== ConfidenceTypeEnum.CF_NOVALUE">
       <span class="badge badge-light border" >
         <i dsAuthorityConfidenceState
            class="far fa-circle fa-fw p-0"

From f3a64bcadcbd6c6847eaf93af5d0adad2e94e36d Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Mon, 12 Feb 2024 22:55:51 +0100
Subject: [PATCH 6/9] Implement vocabulary selector for new fields input

---
 .../dso-edit-metadata-value.component.spec.ts | 32 ++++++++-
 .../dso-edit-metadata-value.component.ts      | 67 +++++++++++++++++--
 .../dso-edit-metadata.component.html          |  1 +
 3 files changed, 94 insertions(+), 6 deletions(-)

diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts
index 080a22dd7c6..5d7d04b690a 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.spec.ts
@@ -23,6 +23,11 @@ import { ConfidenceType } from 'src/app/core/shared/confidence-type';
 import { DynamicOneboxModel } from 'src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model';
 import { Observable } from 'rxjs';
 import { DynamicScrollableDropdownModel } from 'src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model';
+import { RegistryService } from 'src/app/core/registry/registry.service';
+import { NotificationsService } from 'src/app/shared/notifications/notifications.service';
+import { createPaginatedList } from 'src/app/shared/testing/utils.test';
+import { MetadataField } from 'src/app/core/metadata/metadata-field.model';
+import { MetadataSchema } from 'src/app/core/metadata/metadata-schema.model';
 
 const EDIT_BTN = 'edit';
 const CONFIRM_BTN = 'confirm';
@@ -38,6 +43,8 @@ describe('DsoEditMetadataValueComponent', () => {
   let dsoNameService: DSONameService;
   let vocabularyServiceStub: any;
   let itemService: ItemDataService;
+  let registryService: RegistryService;
+  let notificationsService: NotificationsService;
 
   let editMetadataValue: DsoEditMetadataValue;
   let metadataValue: MetadataValue;
@@ -107,7 +114,24 @@ describe('DsoEditMetadataValueComponent', () => {
     }
   };
 
+  let metadataSchema: MetadataSchema;
+  let metadataFields: MetadataField[];
+
   function initServices(): void {
+    metadataSchema = Object.assign(new MetadataSchema(), {
+      id: 0,
+      prefix: 'metadata',
+      namespace: 'http://example.com/',
+    });
+    metadataFields = [
+      Object.assign(new MetadataField(), {
+        id: 0,
+        element: 'regular',
+        qualifier: null,
+        schema: createSuccessfulRemoteDataObject$(metadataSchema),
+      }),
+    ];
+
     relationshipService = jasmine.createSpyObj('relationshipService', {
       resolveMetadataRepresentation: of(new ItemMetadataRepresentation(metadataValue)),
     });
@@ -118,6 +142,10 @@ describe('DsoEditMetadataValueComponent', () => {
       findByHref: createSuccessfulRemoteDataObject$(item)
     });
     vocabularyServiceStub = new VocabularyServiceStub();
+    registryService = jasmine.createSpyObj('registryService', {
+      queryMetadataFields: createSuccessfulRemoteDataObject$(createPaginatedList(metadataFields)),
+    });
+    notificationsService = jasmine.createSpyObj('notificationsService', ['error', 'success']);
   }
 
   beforeEach(waitForAsync(() => {
@@ -143,7 +171,9 @@ describe('DsoEditMetadataValueComponent', () => {
         { provide: RelationshipDataService, useValue: relationshipService },
         { provide: DSONameService, useValue: dsoNameService },
         { provide: VocabularyService, useValue: vocabularyServiceStub },
-        { provide: ItemDataService, useValue: itemService }
+        { provide: ItemDataService, useValue: itemService },
+        { provide: RegistryService, useValue: registryService },
+        { provide: NotificationsService, useValue: notificationsService },
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).compileComponents();
diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts
index 578d4c3c44d..29429ab3a06 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.ts
@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { ChangeDetectorRef, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
 import { DsoEditMetadataChangeType, DsoEditMetadataValue } from '../dso-edit-metadata-form';
 import { Observable } from 'rxjs/internal/Observable';
 import {
@@ -8,7 +8,7 @@ import {
 import { RelationshipDataService } from '../../../core/data/relationship-data.service';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import { ItemMetadataRepresentation } from '../../../core/shared/metadata-representation/item/item-metadata-representation.model';
-import { map, switchMap } from 'rxjs/operators';
+import { map, switchMap, take } 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';
@@ -17,7 +17,7 @@ import { Vocabulary } from '../../../core/submission/vocabularies/models/vocabul
 import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 import { VocabularyOptions } from '../../../core/submission/vocabularies/models/vocabulary-options.model';
 import { ConfidenceType } from '../../../core/shared/confidence-type';
-import { getFirstSucceededRemoteData, getFirstSucceededRemoteDataPayload, getRemoteDataPayload } from '../../../core/shared/operators';
+import { getFirstCompletedRemoteData, getFirstSucceededRemoteData, getFirstSucceededRemoteDataPayload, getRemoteDataPayload, metadataFieldsToString } from '../../../core/shared/operators';
 import { DsDynamicOneboxModelConfig, DynamicOneboxModel } from '../../../shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model';
 import { DynamicScrollableDropdownModel, DynamicScrollableDropdownModelConfig } from '../../../shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model';
 import { ItemDataService } from '../../../core/data/item-data.service';
@@ -27,6 +27,9 @@ import { Collection } from '../../../core/shared/collection.model';
 import { FormFieldMetadataValueObject } from '../../../shared/form/builder/models/form-field-metadata-value.model';
 import { isNotEmpty } from '../../../shared/empty.util';
 import { of as observableOf } from 'rxjs';
+import { RegistryService } from 'src/app/core/registry/registry.service';
+import { TranslateService } from '@ngx-translate/core';
+import { NotificationsService } from 'src/app/shared/notifications/notifications.service';
 
 @Component({
   selector: 'ds-dso-edit-metadata-value',
@@ -36,7 +39,7 @@ import { of as observableOf } from 'rxjs';
 /**
  * Component displaying a single editable row for a metadata value
  */
-export class DsoEditMetadataValueComponent implements OnInit {
+export class DsoEditMetadataValueComponent implements OnInit, OnChanges {
   /**
    * The parent {@link DSpaceObject} to display a metadata form for
    * Also used to determine metadata-representations in case of virtual metadata
@@ -155,7 +158,11 @@ export class DsoEditMetadataValueComponent implements OnInit {
   constructor(protected relationshipService: RelationshipDataService,
               protected dsoNameService: DSONameService,
               protected vocabularyService: VocabularyService,
-              protected itemService: ItemDataService) {
+              protected itemService: ItemDataService,
+              protected cdr: ChangeDetectorRef,
+              protected registryService: RegistryService,
+              protected notificationsService: NotificationsService,
+              protected translate: TranslateService) {
   }
 
   ngOnInit(): void {
@@ -275,6 +282,56 @@ export class DsoEditMetadataValueComponent implements OnInit {
       }));
   }
 
+  /**
+   * Change callback for the component. Check if the mdField has changed to retrieve whether it is metadata
+   * that uses a controlled vocabulary and update the related properties
+   *
+   * @param {SimpleChanges} changes
+   */
+  ngOnChanges(changes: SimpleChanges): void {
+    if (isNotEmpty(changes.mdField) && !changes.mdField.firstChange) {
+      if (isNotEmpty(changes.mdField.currentValue) ) {
+        if (isNotEmpty(changes.mdField.previousValue) &&
+          changes.mdField.previousValue !== changes.mdField.currentValue) {
+          // Clear authority value in case it has been assigned with the previous metadataField used
+          this.mdValue.newValue.authority = null;
+          this.mdValue.newValue.confidence = ConfidenceType.CF_UNSET;
+        }
+
+        // Only ask if the current mdField have a period character to reduce request
+        if (changes.mdField.currentValue.includes('.')) {
+          this.validateMetadataField().subscribe((isValid: boolean) => {
+            if (isValid) {
+              this.initAuthorityProperties();
+              this.cdr.detectChanges();
+            }
+          });
+        }
+      }
+    }
+  }
+
+  /**
+   * Validate the metadata field to check if it exists on the server and return an observable boolean for success/error
+   */
+  validateMetadataField(): Observable<boolean> {
+    return this.registryService.queryMetadataFields(this.mdField, null, true, false, followLink('schema')).pipe(
+      getFirstCompletedRemoteData(),
+      switchMap((rd) => {
+        if (rd.hasSucceeded) {
+          return observableOf(rd).pipe(
+            metadataFieldsToString(),
+            take(1),
+            map((fields: string[]) => fields.indexOf(this.mdField) > -1)
+          );
+        } else {
+          this.notificationsService.error(this.translate.instant(`${this.dsoType}.edit.metadata.metadatafield.error`), rd.errorMessage);
+          return [false];
+        }
+      }),
+    );
+  }
+
   /**
    * Checks if this field use a authority vocabulary
    */
diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata.component.html b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata.component.html
index 8fb676a7247..d6c72abdb94 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata.component.html
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata.component.html
@@ -40,6 +40,7 @@
                                       [dsoType]="dsoType"
                                       [saving$]="savingOrLoadingFieldValidation$"
                                       [isOnlyValue]="true"
+                                      [mdField]="newMdField"
                                       (confirm)="confirmNewValue($event)"
                                       (remove)="form.newValue = undefined"
                                       (undo)="form.newValue = undefined">

From b4a9a0dd1e15fb5630e75a2bce18141308773808 Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Mon, 12 Feb 2024 22:57:28 +0100
Subject: [PATCH 7/9] Add a new mode to AuthorityConfidenceStateDirective to
 configure use fontawesome icons instead of class defined in style property

---
 config/config.example.yml                     | 30 ++++++++++--
 .../dso-edit-metadata-value.component.html    |  9 +++-
 .../authority-confidence-state.directive.ts   | 45 +++++++++++++++--
 src/assets/i18n/en.json5                      | 18 +++++++
 src/config/default-app-config.ts              | 48 +++++++++++++++----
 src/config/submission-config.interface.ts     |  1 +
 src/environments/environment.test.ts          | 12 +++--
 7 files changed, 143 insertions(+), 20 deletions(-)

diff --git a/config/config.example.yml b/config/config.example.yml
index 0933619e013..feea06f7cb5 100644
--- a/config/config.example.yml
+++ b/config/config.example.yml
@@ -136,7 +136,7 @@ submission:
       # NOTE: example of configuration
       #   # NOTE: metadata name
       # - name: dc.author
-      #   # NOTE: fontawesome (v5.x) icon classes and bootstrap utility classes can be used
+      #   # NOTE: fontawesome (v6.x) icon classes and bootstrap utility classes can be used
       #   style: fas fa-user
       - name: dc.author
         style: fas fa-user
@@ -147,18 +147,40 @@ submission:
       confidence:
         # NOTE: example of configuration
         #   # NOTE: confidence value
-        # - name: dc.author
-        #   # NOTE: fontawesome (v5.x) icon classes and bootstrap utility classes can be used
-        #   style: fa-user
+        # - value: 600
+        #   # NOTE: fontawesome (v6.x) icon classes and bootstrap utility classes can be used
+        #   style: text-success
+        #   icon: fa-circle-check
+        #   # NOTE: the class configured in property style is used by default, the icon property could be used in component
+        #           configured to use a 'icon mode' display (mainly in edit-item page)
         - value: 600
           style: text-success
+          icon: fa-circle-check
         - value: 500
           style: text-info
+          icon: fa-gear
         - value: 400
           style: text-warning
+          icon: fa-circle-question
+        - value: 300
+          style: text-muted
+          icon: fa-thumbs-down
+        - value: 200
+          style: text-muted
+          icon: fa-circle-exclamation
+        - value: 100
+          style: text-muted
+          icon: fa-circle-stop
+        - value: 0
+          style: text-muted
+          icon: fa-ban
+        - value: -1
+          style: text-muted
+          icon: fa-circle-xmark
         # default configuration
         - value: default
           style: text-muted
+          icon: fa-circle-xmark
 
 #  Default Language in which the UI will be rendered if the user's browser language is not an active language
 defaultLanguage: en
diff --git a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
index 5ff1c5f4eda..8a2840a82c3 100644
--- a/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
+++ b/src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
@@ -20,15 +20,22 @@
     <div *ngIf="!isVirtual && !mdValue.editing && mdValue.newValue.authority && mdValue.newValue.confidence !== ConfidenceTypeEnum.CF_UNSET && mdValue.newValue.confidence !== ConfidenceTypeEnum.CF_NOVALUE">
       <span class="badge badge-light border" >
         <i dsAuthorityConfidenceState
-           class="far fa-circle fa-fw p-0"
+           class="fas fa-fw p-0"
            aria-hidden="true"
            [authorityValue]="mdValue.newValue"
+           [iconMode]="true"
         ></i>
         {{ dsoType + '.edit.metadata.authority.label' | translate }} {{ mdValue.newValue.authority }}
       </span>
     </div>
     <div class="mt-2" *ngIf=" mdValue.editing && (isAuthorityControlled() | async) && (isSuggesterVocabulary() | async)">
       <div class="btn-group w-75">
+        <i dsAuthorityConfidenceState
+          class="fas fa-fw p-0 mr-1 mt-auto mb-auto"
+          aria-hidden="true"
+          [authorityValue]="mdValue.newValue.confidence"
+          [iconMode]="true"
+      ></i>
         <input class="form-control form-outline" [(ngModel)]="mdValue.newValue.authority" [disabled]="!editingAuthority"
               [attr.aria-label]="(dsoType + '.edit.metadata.edit.authority.key') | translate"
               (change)="onChangeAuthorityKey()" />
diff --git a/src/app/shared/form/directives/authority-confidence-state.directive.ts b/src/app/shared/form/directives/authority-confidence-state.directive.ts
index 70e3a052e92..a20ab49c4f6 100644
--- a/src/app/shared/form/directives/authority-confidence-state.directive.ts
+++ b/src/app/shared/form/directives/authority-confidence-state.directive.ts
@@ -29,6 +29,7 @@ import { ConfidenceIconConfig } from '../../../../config/submission-config.inter
 import { environment } from '../../../../environments/environment';
 import { VocabularyEntryDetail } from '../../../core/submission/vocabularies/models/vocabulary-entry-detail.model';
 import { MetadataValue } from '../../../core/shared/metadata.models';
+import { TranslateService } from '@ngx-translate/core';
 
 /**
  * Directive to add to the element a bootstrap utility class based on metadata confidence value
@@ -48,6 +49,12 @@ export class AuthorityConfidenceStateDirective implements OnChanges, AfterViewIn
    */
   @Input() visibleWhenAuthorityEmpty = true;
 
+  /**
+   * A boolean to configure the display of icons instead of default style configuration
+   * When true, the class configured in {@link ConfidenceIconConfig.icon} will be used, by default {@link ConfidenceIconConfig.style} is used
+   */
+  @Input() iconMode = false;
+
   /**
    * The css class applied before directive changes
    */
@@ -80,7 +87,8 @@ export class AuthorityConfidenceStateDirective implements OnChanges, AfterViewIn
    */
   constructor(
     private elem: ElementRef,
-    private renderer: Renderer2
+    private renderer: Renderer2,
+    private translate: TranslateService
   ) {
   }
 
@@ -94,12 +102,19 @@ export class AuthorityConfidenceStateDirective implements OnChanges, AfterViewIn
       this.previousClass = this.getClassByConfidence(this.getConfidenceByValue(changes.authorityValue.previousValue));
     }
     this.newClass = this.getClassByConfidence(this.getConfidenceByValue(changes.authorityValue.currentValue));
+    let confidenceName = this.getNameByConfidence(this.getConfidenceByValue(changes.authorityValue.currentValue));
 
     if (isNull(this.previousClass)) {
       this.renderer.addClass(this.elem.nativeElement, this.newClass);
+      if (this.iconMode) {
+        this.renderer.setAttribute(this.elem.nativeElement, 'title', this.translate.instant(`confidence.indicator.help-text.${confidenceName}`));
+      }
     } else if (this.previousClass !== this.newClass) {
       this.renderer.removeClass(this.elem.nativeElement, this.previousClass);
       this.renderer.addClass(this.elem.nativeElement, this.newClass);
+      if (this.iconMode) {
+        this.renderer.setAttribute(this.elem.nativeElement, 'title', this.translate.instant(`confidence.indicator.help-text.${confidenceName}`));
+      }
     }
   }
 
@@ -136,6 +151,10 @@ export class AuthorityConfidenceStateDirective implements OnChanges, AfterViewIn
       confidence = value.confidence;
     }
 
+    if (isNotEmpty(value) && Object.values(ConfidenceType).includes(value)) {
+      confidence = value;
+    }
+
     return confidence;
   }
 
@@ -154,9 +173,29 @@ export class AuthorityConfidenceStateDirective implements OnChanges, AfterViewIn
     const confidenceIndex: number = findIndex(confidenceIcons, {value: confidence});
 
     const defaultconfidenceIndex: number = findIndex(confidenceIcons, {value: 'default' as  any});
-    const defaultClass: string = (defaultconfidenceIndex !== -1) ? confidenceIcons[defaultconfidenceIndex].style : '';
 
-    return (confidenceIndex !== -1) ? confidenceIcons[confidenceIndex].style : defaultClass;
+    if (this.iconMode) {
+      const defaultClass: string = (defaultconfidenceIndex !== -1) ? confidenceIcons[defaultconfidenceIndex].icon : '';
+      return (confidenceIndex !== -1) ? confidenceIcons[confidenceIndex].icon : defaultClass;
+    } else {
+      const defaultClass: string = (defaultconfidenceIndex !== -1) ? confidenceIcons[defaultconfidenceIndex].style : '';
+      return (confidenceIndex !== -1) ? confidenceIcons[confidenceIndex].style : defaultClass;
+    }
+  }
+
+  /**
+   * Return the confidence value name
+   *
+   * @param confidence
+   * @returns
+   */
+  private getNameByConfidence(confidence: any): string {
+    let confidenceText = ConfidenceType[confidence];
+    if (isNotEmpty(confidenceText)) {
+      return confidenceText.replace('CF_', '').toLowerCase();
+    } else {
+      return 'unknown';
+    }
   }
 
 }
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 6e9f924c663..73ba10b61b8 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -2448,6 +2448,24 @@
 
   "workflow-item.search.result.list.element.supervised.remove-tooltip": "Remove supervision group",
 
+  "confidence.indicator.help-text.accepted": "This authority value has been confirmed as accurate by an interactive user",
+
+  "confidence.indicator.help-text.uncertain": "Value is singular and valid but has not been seen and accepted by a human so it is still uncertain",
+
+  "confidence.indicator.help-text.ambiguous": "There are multiple matching authority values of equal validity",
+
+  "confidence.indicator.help-text.notfound": "There are no matching answers in the authority",
+
+  "confidence.indicator.help-text.failed": "The authority encountered an internal failure",
+
+  "confidence.indicator.help-text.rejected": "The authority recommends this submission be rejected",
+
+  "confidence.indicator.help-text.novalue": "No reasonable confidence value was returned from the authority",
+
+  "confidence.indicator.help-text.unset": "Confidence was never recorded for this value",
+
+  "confidence.indicator.help-text.unknown": "Unknown confidence value",
+
   "item.page.abstract": "Abstract",
 
   "item.page.author": "Authors",
diff --git a/src/config/default-app-config.ts b/src/config/default-app-config.ts
index dc90f4f9511..b7c026be899 100644
--- a/src/config/default-app-config.ts
+++ b/src/config/default-app-config.ts
@@ -164,7 +164,7 @@ export class DefaultAppConfig implements AppConfig {
          * {
          *    // NOTE: metadata name
          *    name: 'dc.author',
-         *    // NOTE: fontawesome (v5.x) icon classes and bootstrap utility classes can be used
+         *    // NOTE: fontawesome (v6.x) icon classes and bootstrap utility classes can be used
          *    style: 'fa-user'
          * }
          */
@@ -184,27 +184,59 @@ export class DefaultAppConfig implements AppConfig {
            * NOTE: example of configuration
            * {
            *    // NOTE: confidence value
-           *    value: 'dc.author',
-           *    // NOTE: fontawesome (v4.x) icon classes and bootstrap utility classes can be used
-           *    style: 'fa-user'
+           *    value: 100,
+           *    // NOTE: fontawesome (v6.x) icon classes and bootstrap utility classes can be used
+           *    style: 'text-success',
+           *    icon: 'fa-circle-check'
+           *    // NOTE: the class configured in property style is used by default, the icon property could be used in component
+           *    //      configured to use a 'icon mode' display (mainly in edit-item page)
            * }
            */
           {
             value: 600,
-            style: 'text-success'
+            style: 'text-success',
+            icon: 'fa-circle-check'
           },
           {
             value: 500,
-            style: 'text-info'
+            style: 'text-info',
+            icon: 'fa-gear'
           },
           {
             value: 400,
-            style: 'text-warning'
+            style: 'text-warning',
+            icon: 'fa-circle-question'
+          },
+          {
+            value: 300,
+            style: 'text-muted',
+            icon: 'fa-circle-question'
+          },
+          {
+            value: 200,
+            style: 'text-muted',
+            icon: 'fa-circle-exclamation'
+          },
+          {
+            value: 100,
+            style: 'text-muted',
+            icon: 'fa-circle-stop'
+          },
+          {
+            value: 0,
+            style: 'text-muted',
+            icon: 'fa-ban'
+          },
+          {
+            value: -1,
+            style: 'text-muted',
+            icon: 'fa-circle-xmark'
           },
           // default configuration
           {
             value: 'default',
-            style: 'text-muted'
+            style: 'text-muted',
+            icon: 'fa-circle-xmark'
           }
 
         ]
diff --git a/src/config/submission-config.interface.ts b/src/config/submission-config.interface.ts
index a63af45e38a..b0d1df900fa 100644
--- a/src/config/submission-config.interface.ts
+++ b/src/config/submission-config.interface.ts
@@ -24,6 +24,7 @@ export interface MetadataIconConfig extends Config {
 export interface ConfidenceIconConfig extends Config {
   value: any;
   style: string;
+  icon: string;
 }
 
 export interface SubmissionConfig extends Config {
diff --git a/src/environments/environment.test.ts b/src/environments/environment.test.ts
index 02551e4c331..7324cf4d13c 100644
--- a/src/environments/environment.test.ts
+++ b/src/environments/environment.test.ts
@@ -147,19 +147,23 @@ export const environment: BuildConfig = {
         confidence: [
           {
             value: 600,
-            style: 'text-success'
+            style: 'text-success',
+            icon: 'fa-circle-check'
           },
           {
             value: 500,
-            style: 'text-info'
+            style: 'text-info',
+            icon: 'fa-gear'
           },
           {
             value: 400,
-            style: 'text-warning'
+            style: 'text-warning',
+            icon: 'fa-circle-question'
           },
           {
             value: 'default',
-            style: 'text-muted'
+            style: 'text-muted',
+            icon: 'fa-circle-xmark'
           },
         ]
       }

From 7253a5917cbba88459c554a66e4ded920c3e269b Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Fri, 23 Feb 2024 10:54:14 +0100
Subject: [PATCH 8/9] Update the value with the searched text in the onBlur()
 event of DsDynamicOneBoxComponent when the user doesn't select any typeahead
 suggestion. The previous code attempted to maintain focus on the input field
 to not lose changes but it wasn't working.

---
 .../models/onebox/dynamic-onebox.component.ts            | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
index 339bc11a42e..121bbb37335 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
@@ -195,8 +195,13 @@ export class DsDynamicOneboxComponent extends DsDynamicVocabularyComponent imple
       // prevent on blur propagation if typeahed suggestions are showed
       event.preventDefault();
       event.stopImmediatePropagation();
-      // set focus on input again, this is to avoid to lose changes when no suggestion is selected
-      (event.target as HTMLInputElement).focus();
+      // update the value with the searched text if the user hasn't selected any suggestion
+      if (!this.model.vocabularyOptions.closed && isNotEmpty(this.inputValue)) {
+        if (isNotNull(this.inputValue) && this.model.value !== this.inputValue) {
+          this.dispatchUpdate(this.inputValue);
+        }
+        this.inputValue = null;
+      }
     }
   }
 

From 1fc046249b11c4a7c3219319a279cece865dafe6 Mon Sep 17 00:00:00 2001
From: Toni Prieto <antonio.juan.prieto@upc.edu>
Date: Fri, 23 Feb 2024 11:05:26 +0100
Subject: [PATCH 9/9] Preserve the confidence value when loading the initial
 value of the model into the DsDynamicOneboxComponent. Previously, the
 accepted confidence value was always displayed if a valid vocabulary entry
 was retrieved, incorrectly displaying it for values without accepted
 authority.

---
 .../models/dynamic-vocabulary.component.ts             | 10 ++++++++--
 .../models/onebox/dynamic-onebox.component.ts          |  2 +-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts
index f19b6602955..b0c42ffefdc 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts
@@ -50,8 +50,9 @@ export abstract class DsDynamicVocabularyComponent extends DynamicFormControlCom
 
   /**
    * Retrieves the init form value from model
+   * @param preserveConfidence if the original model confidence value should be used after retrieving the vocabulary's entry
    */
-  getInitValueFromModel(): Observable<FormFieldMetadataValueObject> {
+  getInitValueFromModel(preserveConfidence = false): Observable<FormFieldMetadataValueObject> {
     let initValue$: Observable<FormFieldMetadataValueObject>;
     if (isNotEmpty(this.model.value) && (this.model.value instanceof FormFieldMetadataValueObject) && !this.model.value.hasAuthorityToGenerate()) {
       let initEntry$: Observable<VocabularyEntry>;
@@ -63,7 +64,7 @@ export abstract class DsDynamicVocabularyComponent extends DynamicFormControlCom
       initValue$ = initEntry$.pipe(map((initEntry: VocabularyEntry) => {
         if (isNotEmpty(initEntry)) {
           // Integrate FormFieldMetadataValueObject with retrieved information
-          return new FormFieldMetadataValueObject(
+          let formField = new FormFieldMetadataValueObject(
             initEntry.value,
             null,
             initEntry.authority,
@@ -72,6 +73,11 @@ export abstract class DsDynamicVocabularyComponent extends DynamicFormControlCom
             null,
             initEntry.otherInformation || null
           );
+          // Preserve the original confidence
+          if (preserveConfidence) {
+            formField.confidence = (this.model.value as any).confidence;
+          }
+          return formField;
         } else {
           return this.model.value as any;
         }
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
index 121bbb37335..d36adc094b5 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
@@ -273,7 +273,7 @@ export class DsDynamicOneboxComponent extends DsDynamicVocabularyComponent imple
     let result: string;
     if (init) {
       this.changeLoadingInitialValueStatus(true);
-      this.getInitValueFromModel()
+      this.getInitValueFromModel(true)
         .subscribe((formValue: FormFieldMetadataValueObject) => {
           this.changeLoadingInitialValueStatus(false);
           this.currentValue = formValue;