From 70f0af66117722e4d12d2b828ee85537946e69de Mon Sep 17 00:00:00 2001
From: Alexandre Vryghem <alexandre@atmire.com>
Date: Tue, 3 Sep 2024 11:36:04 +0200
Subject: [PATCH 1/6] 117287: Removed method calls returning observables from
 the EPerson form

---
 .../epeople-registry.component.html           |   2 +-
 .../epeople-registry.component.ts             |  22 +-
 .../eperson-form/eperson-form.component.html  |   4 +-
 .../eperson-form.component.spec.ts            |  69 ++----
 .../eperson-form/eperson-form.component.ts    | 230 +++++++++---------
 5 files changed, 140 insertions(+), 187 deletions(-)

diff --git a/src/app/access-control/epeople-registry/epeople-registry.component.html b/src/app/access-control/epeople-registry/epeople-registry.component.html
index e3a8e2c590f..bd471248563 100644
--- a/src/app/access-control/epeople-registry/epeople-registry.component.html
+++ b/src/app/access-control/epeople-registry/epeople-registry.component.html
@@ -66,7 +66,7 @@ <h3 id="search" class="border-bottom pb-2">{{labelPrefix + 'search.head' | trans
               </thead>
               <tbody>
               <tr *ngFor="let epersonDto of (ePeopleDto$ | async)?.page"
-                  [ngClass]="{'table-primary' : isActive(epersonDto.eperson) | async}">
+                  [ngClass]="{'table-primary' : (activeEPerson$ | async) === epersonDto.eperson}">
                 <td>{{epersonDto.eperson.id}}</td>
                 <td>{{ dsoNameService.getName(epersonDto.eperson) }}</td>
                 <td>{{epersonDto.eperson.email}}</td>
diff --git a/src/app/access-control/epeople-registry/epeople-registry.component.ts b/src/app/access-control/epeople-registry/epeople-registry.component.ts
index fb045ebb883..f180534587a 100644
--- a/src/app/access-control/epeople-registry/epeople-registry.component.ts
+++ b/src/app/access-control/epeople-registry/epeople-registry.component.ts
@@ -45,6 +45,8 @@ export class EPeopleRegistryComponent implements OnInit, OnDestroy {
    */
   ePeopleDto$: BehaviorSubject<PaginatedList<EpersonDtoModel>> = new BehaviorSubject<PaginatedList<EpersonDtoModel>>({} as any);
 
+  activeEPerson$: Observable<EPerson>;
+
   /**
    * An observable for the pageInfo, needed to pass to the pagination component
    */
@@ -121,6 +123,7 @@ export class EPeopleRegistryComponent implements OnInit, OnDestroy {
         this.isEPersonFormShown = true;
       }
     }));
+    this.activeEPerson$ = this.epersonService.getActiveEPerson();
     this.subs.push(this.ePeople$.pipe(
       switchMap((epeople: PaginatedList<EPerson>) => {
         if (epeople.pageInfo.totalElements > 0) {
@@ -188,29 +191,12 @@ export class EPeopleRegistryComponent implements OnInit, OnDestroy {
     );
   }
 
-  /**
-   * Checks whether the given EPerson is active (being edited)
-   * @param eperson
-   */
-  isActive(eperson: EPerson): Observable<boolean> {
-    return this.getActiveEPerson().pipe(
-      map((activeEPerson) => eperson === activeEPerson)
-    );
-  }
-
-  /**
-   * Gets the active eperson (being edited)
-   */
-  getActiveEPerson(): Observable<EPerson> {
-    return this.epersonService.getActiveEPerson();
-  }
-
   /**
    * Start editing the selected EPerson
    * @param ePerson
    */
   toggleEditEPerson(ePerson: EPerson) {
-    this.getActiveEPerson().pipe(take(1)).subscribe((activeEPerson: EPerson) => {
+    this.activeEPerson$.pipe(take(1)).subscribe((activeEPerson: EPerson) => {
       if (ePerson === activeEPerson) {
         this.epersonService.cancelEditEPerson();
         this.isEPersonFormShown = false;
diff --git a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html
index 228449a8a57..3c5b2d13b41 100644
--- a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html
+++ b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html
@@ -1,4 +1,4 @@
-<div *ngIf="epersonService.getActiveEPerson() | async; then editheader; else createHeader"></div>
+<div *ngIf="activeEPerson$ | async; then editheader; else createHeader"></div>
 
 <ng-template #createHeader>
   <h4>{{messagePrefix + '.create' | translate}}</h4>
@@ -39,7 +39,7 @@ <h4>{{messagePrefix + '.edit' | translate}}</h4>
 
 <ds-themed-loading [showMessage]="false" *ngIf="!formGroup"></ds-themed-loading>
 
-<div *ngIf="epersonService.getActiveEPerson() | async">
+<div *ngIf="activeEPerson$ | async">
   <h5>{{messagePrefix + '.groupsEPersonIsMemberOf' | translate}}</h5>
 
   <ds-themed-loading [showMessage]="false" *ngIf="!(groups | async)"></ds-themed-loading>
diff --git a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.spec.ts b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.spec.ts
index fb911e709c4..dc2e380c33e 100644
--- a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.spec.ts
+++ b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.spec.ts
@@ -1,11 +1,11 @@
 import { Observable, of as observableOf } from 'rxjs';
 import { CommonModule } from '@angular/common';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { UntypedFormControl, UntypedFormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import { BrowserModule, By } from '@angular/platform-browser';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
 import { buildPaginatedList, PaginatedList } from '../../../core/data/paginated-list.model';
 import { RemoteData } from '../../../core/data/remote-data';
 import { EPersonDataService } from '../../../core/eperson/eperson-data.service';
@@ -19,7 +19,6 @@ import { EPersonMock, EPersonMock2 } from '../../../shared/testing/eperson.mock'
 import { createSuccessfulRemoteDataObject$ } from '../../../shared/remote-data.utils';
 import { getMockFormBuilderService } from '../../../shared/mocks/form-builder-service.mock';
 import { NotificationsServiceStub } from '../../../shared/testing/notifications-service.stub';
-import { TranslateLoaderMock } from '../../../shared/mocks/translate-loader.mock';
 import { AuthService } from '../../../core/auth/auth.service';
 import { AuthServiceStub } from '../../../shared/testing/auth-service.stub';
 import { AuthorizationDataService } from '../../../core/data/feature-authorization/authorization-data.service';
@@ -31,6 +30,7 @@ import { PaginationServiceStub } from '../../../shared/testing/pagination-servic
 import { FindListOptions } from '../../../core/data/find-list-options.model';
 import { ValidateEmailNotTaken } from './validators/email-taken.validator';
 import { EpersonRegistrationService } from '../../../core/data/eperson-registration.service';
+import { RouterTestingModule } from '@angular/router/testing';
 
 describe('EPersonFormComponent', () => {
   let component: EPersonFormComponent;
@@ -53,9 +53,6 @@ describe('EPersonFormComponent', () => {
     ePersonDataServiceStub = {
       activeEPerson: null,
       allEpeople: mockEPeople,
-      getEPeople(): Observable<RemoteData<PaginatedList<EPerson>>> {
-        return createSuccessfulRemoteDataObject$(buildPaginatedList(null, this.allEpeople));
-      },
       getActiveEPerson(): Observable<EPerson> {
         return observableOf(this.activeEPerson);
       },
@@ -184,12 +181,8 @@ describe('EPersonFormComponent', () => {
     paginationService = new PaginationServiceStub();
     TestBed.configureTestingModule({
       imports: [CommonModule, NgbModule, FormsModule, ReactiveFormsModule, BrowserModule,
-        TranslateModule.forRoot({
-          loader: {
-            provide: TranslateLoader,
-            useClass: TranslateLoaderMock
-          }
-        }),
+        RouterTestingModule,
+        TranslateModule.forRoot(),
       ],
       declarations: [EPersonFormComponent],
       providers: [
@@ -204,7 +197,7 @@ describe('EPersonFormComponent', () => {
         { provide: EpersonRegistrationService, useValue: epersonRegistrationService },
         EPeopleRegistryComponent
       ],
-      schemas: [NO_ERRORS_SCHEMA]
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();
   }));
 
@@ -223,37 +216,13 @@ describe('EPersonFormComponent', () => {
   });
 
   describe('check form validation', () => {
-    let firstName;
-    let lastName;
-    let email;
-    let canLogIn;
-    let requireCertificate;
+    let canLogIn: boolean;
+    let requireCertificate: boolean;
 
-    let expected;
     beforeEach(() => {
-      firstName = 'testName';
-      lastName = 'testLastName';
-      email = 'testEmail@test.com';
       canLogIn = false;
       requireCertificate = false;
 
-      expected = Object.assign(new EPerson(), {
-        metadata: {
-          'eperson.firstname': [
-            {
-              value: firstName
-            }
-          ],
-          'eperson.lastname': [
-            {
-              value: lastName
-            },
-          ],
-        },
-        email: email,
-        canLogIn: canLogIn,
-        requireCertificate: requireCertificate,
-      });
       spyOn(component.submitForm, 'emit');
       component.canLogIn.value = canLogIn;
       component.requireCertificate.value = requireCertificate;
@@ -343,15 +312,13 @@ describe('EPersonFormComponent', () => {
         });
       }));
     });
-
-
-
   });
+
   describe('when submitting the form', () => {
     let firstName;
     let lastName;
     let email;
-    let canLogIn;
+    let canLogIn: boolean;
     let requireCertificate;
 
     let expected;
@@ -380,6 +347,7 @@ describe('EPersonFormComponent', () => {
         requireCertificate: requireCertificate,
       });
       spyOn(component.submitForm, 'emit');
+      component.ngOnInit();
       component.firstName.value = firstName;
       component.lastName.value = lastName;
       component.email.value = email;
@@ -421,9 +389,17 @@ describe('EPersonFormComponent', () => {
           email: email,
           canLogIn: canLogIn,
           requireCertificate: requireCertificate,
-          _links: undefined
+          _links: {
+            groups: {
+              href: '',
+            },
+            self: {
+              href: '',
+            },
+          },
         });
         spyOn(ePersonDataServiceStub, 'getActiveEPerson').and.returnValue(observableOf(expectedWithId));
+        component.ngOnInit();
         component.onSubmit();
         fixture.detectChanges();
       });
@@ -473,22 +449,19 @@ describe('EPersonFormComponent', () => {
   });
 
   describe('delete', () => {
-
-    let ePersonId;
     let eperson: EPerson;
     let modalService;
 
     beforeEach(() => {
       spyOn(authService, 'impersonate').and.callThrough();
-      ePersonId = 'testEPersonId';
       eperson = EPersonMock;
       component.epersonInitial = eperson;
       component.canDelete$ = observableOf(true);
       spyOn(component.epersonService, 'getActiveEPerson').and.returnValue(observableOf(eperson));
       modalService = (component as any).modalService;
       spyOn(modalService, 'open').and.returnValue(Object.assign({ componentInstance: Object.assign({ response: observableOf(true) }) }));
+      component.ngOnInit();
       fixture.detectChanges();
-
     });
 
     it('the delete button should be active if the eperson can be deleted', () => {
diff --git a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
index d009d560589..296038ca2ba 100644
--- a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
+++ b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
@@ -137,6 +137,11 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
    */
   canImpersonate$: Observable<boolean>;
 
+  /**
+   * The current {@link EPerson}
+   */
+  activeEPerson$: Observable<EPerson>;
+
   /**
    * List of subscriptions
    */
@@ -195,7 +200,11 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
     private epersonRegistrationService: EpersonRegistrationService,
     public dsoNameService: DSONameService,
   ) {
-    this.subs.push(this.epersonService.getActiveEPerson().subscribe((eperson: EPerson) => {
+  }
+
+  ngOnInit() {
+    this.activeEPerson$ = this.epersonService.getActiveEPerson();
+    this.subs.push(this.activeEPerson$.subscribe((eperson: EPerson) => {
       this.epersonInitial = eperson;
       if (hasValue(eperson)) {
         this.isImpersonated = this.authService.isImpersonatingUser(eperson.id);
@@ -203,9 +212,6 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
         this.submitLabel = 'form.submit';
       }
     }));
-  }
-
-  ngOnInit() {
     this.initialisePage();
   }
 
@@ -213,124 +219,112 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
    * This method will initialise the page
    */
   initialisePage() {
-
-    observableCombineLatest([
-      this.translateService.get(`${this.messagePrefix}.firstName`),
-      this.translateService.get(`${this.messagePrefix}.lastName`),
-      this.translateService.get(`${this.messagePrefix}.email`),
-      this.translateService.get(`${this.messagePrefix}.canLogIn`),
-      this.translateService.get(`${this.messagePrefix}.requireCertificate`),
-      this.translateService.get(`${this.messagePrefix}.emailHint`),
-    ]).subscribe(([firstName, lastName, email, canLogIn, requireCertificate, emailHint]) => {
-      this.firstName = new DynamicInputModel({
-        id: 'firstName',
-        label: firstName,
-        name: 'firstName',
-        validators: {
-          required: null,
-        },
-        required: true,
-      });
-      this.lastName = new DynamicInputModel({
-        id: 'lastName',
-        label: lastName,
-        name: 'lastName',
-        validators: {
-          required: null,
-        },
-        required: true,
+    this.firstName = new DynamicInputModel({
+      id: 'firstName',
+      label: this.translateService.instant(`${this.messagePrefix}.firstName`),
+      name: 'firstName',
+      validators: {
+        required: null,
+      },
+      required: true,
+    });
+    this.lastName = new DynamicInputModel({
+      id: 'lastName',
+      label: this.translateService.instant(`${this.messagePrefix}.lastName`),
+      name: 'lastName',
+      validators: {
+        required: null,
+      },
+      required: true,
+    });
+    this.email = new DynamicInputModel({
+      id: 'email',
+      label: this.translateService.instant(`${this.messagePrefix}.email`),
+      name: 'email',
+      validators: {
+        required: null,
+        pattern: '^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$',
+      },
+      required: true,
+      errorMessages: {
+        emailTaken: 'error.validation.emailTaken',
+        pattern: 'error.validation.NotValidEmail'
+      },
+      hint: this.translateService.instant(`${this.messagePrefix}.emailHint`),
+    });
+    this.canLogIn = new DynamicCheckboxModel(
+      {
+        id: 'canLogIn',
+        label: this.translateService.instant(`${this.messagePrefix}.canLogIn`),
+        name: 'canLogIn',
+        value: (this.epersonInitial != null ? this.epersonInitial.canLogIn : true)
       });
-      this.email = new DynamicInputModel({
-        id: 'email',
-        label: email,
-        name: 'email',
-        validators: {
-          required: null,
-          pattern: '^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$',
-        },
-        required: true,
-        errorMessages: {
-          emailTaken: 'error.validation.emailTaken',
-          pattern: 'error.validation.NotValidEmail'
-        },
-        hint: emailHint
+    this.requireCertificate = new DynamicCheckboxModel(
+      {
+        id: 'requireCertificate',
+        label: this.translateService.instant(`${this.messagePrefix}.requireCertificate`),
+        name: 'requireCertificate',
+        value: (this.epersonInitial != null ? this.epersonInitial.requireCertificate : false)
       });
-      this.canLogIn = new DynamicCheckboxModel(
-        {
-          id: 'canLogIn',
-          label: canLogIn,
-          name: 'canLogIn',
-          value: (this.epersonInitial != null ? this.epersonInitial.canLogIn : true)
+    this.formModel = [
+      this.firstName,
+      this.lastName,
+      this.email,
+      this.canLogIn,
+      this.requireCertificate,
+    ];
+    this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
+    this.subs.push(this.activeEPerson$.subscribe((eperson: EPerson) => {
+      if (eperson != null) {
+        this.groups = this.groupsDataService.findListByHref(eperson._links.groups.href, {
+          currentPage: 1,
+          elementsPerPage: this.config.pageSize
         });
-      this.requireCertificate = new DynamicCheckboxModel(
-        {
-          id: 'requireCertificate',
-          label: requireCertificate,
-          name: 'requireCertificate',
-          value: (this.epersonInitial != null ? this.epersonInitial.requireCertificate : false)
+      }
+      this.formGroup.patchValue({
+        firstName: eperson != null ? eperson.firstMetadataValue('eperson.firstname') : '',
+        lastName: eperson != null ? eperson.firstMetadataValue('eperson.lastname') : '',
+        email: eperson != null ? eperson.email : '',
+        canLogIn: eperson != null ? eperson.canLogIn : true,
+        requireCertificate: eperson != null ? eperson.requireCertificate : false
+      });
+
+      if (eperson === null && !!this.formGroup.controls.email) {
+        this.formGroup.controls.email.setAsyncValidators(ValidateEmailNotTaken.createValidator(this.epersonService));
+        this.emailValueChangeSubscribe = this.email.valueChanges.pipe(debounceTime(300)).subscribe(() => {
+          this.changeDetectorRef.detectChanges();
         });
-      this.formModel = [
-        this.firstName,
-        this.lastName,
-        this.email,
-        this.canLogIn,
-        this.requireCertificate,
-      ];
-      this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
-      this.subs.push(this.epersonService.getActiveEPerson().subscribe((eperson: EPerson) => {
+      }
+    }));
+
+    this.groups = this.activeEPerson$.pipe(
+      switchMap((eperson) => {
+        return observableCombineLatest([observableOf(eperson), this.paginationService.getFindListOptions(this.config.id, {
+          currentPage: 1,
+          elementsPerPage: this.config.pageSize
+        })]);
+      }),
+      switchMap(([eperson, findListOptions]) => {
         if (eperson != null) {
-          this.groups = this.groupsDataService.findListByHref(eperson._links.groups.href, {
-            currentPage: 1,
-            elementsPerPage: this.config.pageSize
-          });
+          return this.groupsDataService.findListByHref(eperson._links.groups.href, findListOptions, true, true, followLink('object'));
         }
-        this.formGroup.patchValue({
-          firstName: eperson != null ? eperson.firstMetadataValue('eperson.firstname') : '',
-          lastName: eperson != null ? eperson.firstMetadataValue('eperson.lastname') : '',
-          email: eperson != null ? eperson.email : '',
-          canLogIn: eperson != null ? eperson.canLogIn : true,
-          requireCertificate: eperson != null ? eperson.requireCertificate : false
-        });
+        return observableOf(undefined);
+      })
+    );
 
-        if (eperson === null && !!this.formGroup.controls.email) {
-          this.formGroup.controls.email.setAsyncValidators(ValidateEmailNotTaken.createValidator(this.epersonService));
-          this.emailValueChangeSubscribe = this.email.valueChanges.pipe(debounceTime(300)).subscribe(() => {
-            this.changeDetectorRef.detectChanges();
-          });
+    this.canImpersonate$ = this.activeEPerson$.pipe(
+      switchMap((eperson) => {
+        if (hasValue(eperson)) {
+          return this.authorizationService.isAuthorized(FeatureID.LoginOnBehalfOf, eperson.self);
+        } else {
+          return observableOf(false);
         }
-      }));
-
-      const activeEPerson$ = this.epersonService.getActiveEPerson();
-
-      this.groups = activeEPerson$.pipe(
-        switchMap((eperson) => {
-          return observableCombineLatest([observableOf(eperson), this.paginationService.getFindListOptions(this.config.id, {
-            currentPage: 1,
-            elementsPerPage: this.config.pageSize
-          })]);
-        }),
-        switchMap(([eperson, findListOptions]) => {
-          if (eperson != null) {
-            return this.groupsDataService.findListByHref(eperson._links.groups.href, findListOptions, true, true, followLink('object'));
-          }
-          return observableOf(undefined);
-        })
-      );
-
-      this.canImpersonate$ = activeEPerson$.pipe(
-        switchMap((eperson) => {
-          if (hasValue(eperson)) {
-            return this.authorizationService.isAuthorized(FeatureID.LoginOnBehalfOf, eperson.self);
-          } else {
-            return observableOf(false);
-          }
-        })
-      );
-      this.canDelete$ = activeEPerson$.pipe(
-        switchMap((eperson) => this.authorizationService.isAuthorized(FeatureID.CanDelete, hasValue(eperson) ? eperson.self : undefined))
-      );
-      this.canReset$ = observableOf(true);
-    });
+      })
+    );
+    this.canDelete$ = this.activeEPerson$.pipe(
+      switchMap((eperson) => this.authorizationService.isAuthorized(FeatureID.CanDelete, hasValue(eperson) ? eperson.self : undefined))
+    );
+    this.canReset$ = observableOf(true);
   }
 
   /**
@@ -348,7 +342,7 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
    * Emit the updated/created eperson using the EventEmitter submitForm
    */
   onSubmit() {
-    this.epersonService.getActiveEPerson().pipe(take(1)).subscribe(
+    this.activeEPerson$.pipe(take(1)).subscribe(
       (ePerson: EPerson) => {
         const values = {
           metadata: {
@@ -464,7 +458,7 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
    * It'll either show a success or error message depending on whether the delete was successful or not.
    */
   delete(): void {
-    this.epersonService.getActiveEPerson().pipe(
+    this.activeEPerson$.pipe(
       take(1),
       switchMap((eperson: EPerson) => {
         const modalRef = this.modalService.open(ConfirmationModalComponent);
@@ -545,7 +539,7 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
    * This method will ensure that the page gets reset and that the cache is cleared
    */
   reset() {
-    this.epersonService.getActiveEPerson().pipe(take(1)).subscribe((eperson: EPerson) => {
+    this.activeEPerson$.pipe(take(1)).subscribe((eperson: EPerson) => {
       this.requestService.removeByHrefSubstring(eperson.self);
     });
     this.initialisePage();
@@ -577,7 +571,7 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
    * Update the list of groups by fetching it from the rest api or cache
    */
   private updateGroups(options) {
-    this.subs.push(this.epersonService.getActiveEPerson().subscribe((eperson: EPerson) => {
+    this.subs.push(this.activeEPerson$.subscribe((eperson: EPerson) => {
       this.groups = this.groupsDataService.findListByHref(eperson._links.groups.href, options);
     }));
   }

From d3019e4006aaa72f1dd8561a8d83050e48a9cebb Mon Sep 17 00:00:00 2001
From: Alexandre Vryghem <alexandre@atmire.com>
Date: Tue, 3 Sep 2024 18:44:49 +0200
Subject: [PATCH 2/6] 117287: Removed method calls returning observables from
 the Registry Formats page

---
 .../bitstream-formats.component.html          | 16 +++----
 .../bitstream-formats.component.spec.ts       | 22 ++++------
 .../bitstream-formats.component.ts            | 42 +++++++++----------
 3 files changed, 34 insertions(+), 46 deletions(-)

diff --git a/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html b/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html
index 0a2e9f0f926..97740d5ea10 100644
--- a/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html
+++ b/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html
@@ -9,10 +9,10 @@ <h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-format
 
 
       <ds-pagination
-        *ngIf="(bitstreamFormats | async)?.payload?.totalElements > 0"
+        *ngIf="(bitstreamFormats$ | async)?.payload?.totalElements > 0"
         [paginationOptions]="pageConfig"
-        [pageInfoState]="(bitstreamFormats | async)?.payload"
-        [collectionSize]="(bitstreamFormats | async)?.payload?.totalElements"
+        [pageInfoState]="(bitstreamFormats$ | async)?.payload"
+        [collectionSize]="(bitstreamFormats$ | async)?.payload?.totalElements"
         [hideGear]="false"
         [hidePagerWhenSinglePage]="true">
         <div class="table-responsive">
@@ -27,11 +27,11 @@ <h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-format
             </tr>
             </thead>
             <tbody>
-            <tr *ngFor="let bitstreamFormat of (bitstreamFormats | async)?.payload?.page">
+            <tr *ngFor="let bitstreamFormat of (bitstreamFormats$ | async)?.payload?.page">
               <td>
                 <label class="mb-0">
                   <input type="checkbox"
-                         [checked]="isSelected(bitstreamFormat) | async"
+                         [checked]="(selectedBitstreamFormatIDs$ | async)?.includes(bitstreamFormat.id)"
                          (change)="selectBitStreamFormat(bitstreamFormat, $event)"
                   >
                 </label>
@@ -45,13 +45,13 @@ <h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-format
           </table>
         </div>
       </ds-pagination>
-      <div *ngIf="(bitstreamFormats | async)?.payload?.totalElements == 0" class="alert alert-info" role="alert">
+      <div *ngIf="(bitstreamFormats$ | async)?.payload?.totalElements == 0" class="alert alert-info" role="alert">
         {{'admin.registries.bitstream-formats.no-items' | translate}}
       </div>
 
       <div>
-        <button *ngIf="(bitstreamFormats | async)?.payload?.page?.length > 0" class="btn btn-primary deselect" (click)="deselectAll()">{{'admin.registries.bitstream-formats.table.deselect-all' | translate}}</button>
-        <button *ngIf="(bitstreamFormats | async)?.payload?.page?.length > 0" type="submit" class="btn btn-danger float-right" (click)="deleteFormats()">{{'admin.registries.bitstream-formats.table.delete' | translate}}</button>
+        <button *ngIf="(bitstreamFormats$ | async)?.payload?.page?.length > 0" class="btn btn-primary deselect" (click)="deselectAll()">{{'admin.registries.bitstream-formats.table.deselect-all' | translate}}</button>
+        <button *ngIf="(bitstreamFormats$ | async)?.payload?.page?.length > 0" type="submit" class="btn btn-danger float-right" (click)="deleteFormats()">{{'admin.registries.bitstream-formats.table.delete' | translate}}</button>
       </div>
     </div>
   </div>
diff --git a/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.spec.ts b/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.spec.ts
index 8a44240b7e2..ec59f57c80e 100644
--- a/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.spec.ts
+++ b/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.spec.ts
@@ -15,8 +15,7 @@ import { NotificationsService } from '../../../shared/notifications/notification
 import { NotificationsServiceStub } from '../../../shared/testing/notifications-service.stub';
 import { BitstreamFormat } from '../../../core/shared/bitstream-format.model';
 import { BitstreamFormatSupportLevel } from '../../../core/shared/bitstream-format-support-level';
-import { cold, getTestScheduler, hot } from 'jasmine-marbles';
-import { TestScheduler } from 'rxjs/testing';
+import { hot } from 'jasmine-marbles';
 import {
   createNoContentRemoteDataObject$,
   createSuccessfulRemoteDataObject,
@@ -31,7 +30,6 @@ describe('BitstreamFormatsComponent', () => {
   let comp: BitstreamFormatsComponent;
   let fixture: ComponentFixture<BitstreamFormatsComponent>;
   let bitstreamFormatService;
-  let scheduler: TestScheduler;
   let notificationsServiceStub;
   let paginationService;
 
@@ -86,8 +84,6 @@ describe('BitstreamFormatsComponent', () => {
   const initAsync = () => {
     notificationsServiceStub = new NotificationsServiceStub();
 
-    scheduler = getTestScheduler();
-
     bitstreamFormatService = jasmine.createSpyObj('bitstreamFormatService', {
       findAll: observableOf(mockFormatsRD),
       find: createSuccessfulRemoteDataObject$(mockFormatsList[0]),
@@ -178,17 +174,17 @@ describe('BitstreamFormatsComponent', () => {
     beforeEach(waitForAsync(initAsync));
     beforeEach(initBeforeEach);
     it('should return an observable of true if the provided bistream is in the list returned by the service', () => {
-      const result = comp.isSelected(bitstreamFormat1);
-
-      expect(result).toBeObservable(cold('b', { b: true }));
+      comp.selectedBitstreamFormatIDs().subscribe((selectedBitstreamFormatIDs: string[]) => {
+        expect(selectedBitstreamFormatIDs).toContain(bitstreamFormat1.id);
+      });
     });
     it('should return an observable of false if the provided bistream is not in the list returned by the service', () => {
       const format = new BitstreamFormat();
       format.uuid = 'new';
 
-      const result = comp.isSelected(format);
-
-      expect(result).toBeObservable(cold('b', { b: false }));
+      comp.selectedBitstreamFormatIDs().subscribe((selectedBitstreamFormatIDs: string[]) => {
+        expect(selectedBitstreamFormatIDs).not.toContain(format.id);
+      });
     });
   });
 
@@ -214,8 +210,6 @@ describe('BitstreamFormatsComponent', () => {
     beforeEach(waitForAsync(() => {
         notificationsServiceStub = new NotificationsServiceStub();
 
-        scheduler = getTestScheduler();
-
         bitstreamFormatService = jasmine.createSpyObj('bitstreamFormatService', {
           findAll: observableOf(mockFormatsRD),
           find: createSuccessfulRemoteDataObject$(mockFormatsList[0]),
@@ -263,8 +257,6 @@ describe('BitstreamFormatsComponent', () => {
     beforeEach(waitForAsync(() => {
         notificationsServiceStub = new NotificationsServiceStub();
 
-        scheduler = getTestScheduler();
-
         bitstreamFormatService = jasmine.createSpyObj('bitstreamFormatService', {
           findAll: observableOf(mockFormatsRD),
           find: createSuccessfulRemoteDataObject$(mockFormatsList[0]),
diff --git a/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.ts b/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.ts
index 162bf2bdb28..263c1aede2a 100644
--- a/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.ts
+++ b/src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
-import { combineLatest as observableCombineLatest, Observable} from 'rxjs';
+import { Observable} from 'rxjs';
 import { RemoteData } from '../../../core/data/remote-data';
 import { PaginatedList } from '../../../core/data/paginated-list.model';
 import { PaginationComponentOptions } from '../../../shared/pagination/pagination-component-options.model';
@@ -7,7 +7,6 @@ import { BitstreamFormat } from '../../../core/shared/bitstream-format.model';
 import { BitstreamFormatDataService } from '../../../core/data/bitstream-format-data.service';
 import { map, mergeMap, switchMap, take, toArray } from 'rxjs/operators';
 import { NotificationsService } from '../../../shared/notifications/notifications.service';
-import { Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
 import { NoContent } from '../../../core/shared/NoContent.model';
 import { PaginationService } from '../../../core/pagination/pagination.service';
@@ -26,7 +25,12 @@ export class BitstreamFormatsComponent implements OnInit, OnDestroy {
   /**
    * A paginated list of bitstream formats to be shown on the page
    */
-  bitstreamFormats: Observable<RemoteData<PaginatedList<BitstreamFormat>>>;
+  bitstreamFormats$: Observable<RemoteData<PaginatedList<BitstreamFormat>>>;
+
+  /**
+   * The currently selected {@link BitstreamFormat} IDs
+   */
+  selectedBitstreamFormatIDs$: Observable<string[]>;
 
   /**
    * The current pagination configuration for the page
@@ -39,7 +43,6 @@ export class BitstreamFormatsComponent implements OnInit, OnDestroy {
   });
 
   constructor(private notificationsService: NotificationsService,
-              private router: Router,
               private translateService: TranslateService,
               private bitstreamFormatService: BitstreamFormatDataService,
               private paginationService: PaginationService,
@@ -94,14 +97,11 @@ export class BitstreamFormatsComponent implements OnInit, OnDestroy {
   }
 
   /**
-   * Checks whether a given bitstream format is selected in the list (checkbox)
-   * @param bitstreamFormat
+   * Returns the list of all the bitstream formats that are selected in the list (checkbox)
    */
-  isSelected(bitstreamFormat: BitstreamFormat): Observable<boolean> {
+  selectedBitstreamFormatIDs(): Observable<string[]> {
     return this.bitstreamFormatService.getSelectedBitstreamFormats().pipe(
-      map((bitstreamFormats: BitstreamFormat[]) => {
-        return bitstreamFormats.find((selectedFormat) => selectedFormat.id === bitstreamFormat.id) != null;
-      })
+      map((bitstreamFormats: BitstreamFormat[]) => bitstreamFormats.map((selectedFormat) => selectedFormat.id)),
     );
   }
 
@@ -125,27 +125,23 @@ export class BitstreamFormatsComponent implements OnInit, OnDestroy {
     const prefix = 'admin.registries.bitstream-formats.delete';
     const suffix = success ? 'success' : 'failure';
 
-    const messages = observableCombineLatest(
-      this.translateService.get(`${prefix}.${suffix}.head`),
-      this.translateService.get(`${prefix}.${suffix}.amount`, {amount: amount})
-    );
-    messages.subscribe(([head, content]) => {
+    const head: string = this.translateService.instant(`${prefix}.${suffix}.head`);
+    const content: string = this.translateService.instant(`${prefix}.${suffix}.amount`, { amount: amount });
 
-      if (success) {
-        this.notificationsService.success(head, content);
-      } else {
-        this.notificationsService.error(head, content);
-      }
-    });
+    if (success) {
+      this.notificationsService.success(head, content);
+    } else {
+      this.notificationsService.error(head, content);
+    }
   }
 
   ngOnInit(): void {
-
-    this.bitstreamFormats = this.paginationService.getFindListOptions(this.pageConfig.id, this.pageConfig).pipe(
+    this.bitstreamFormats$ = this.paginationService.getFindListOptions(this.pageConfig.id, this.pageConfig).pipe(
       switchMap((findListOptions: FindListOptions) => {
         return this.bitstreamFormatService.findAll(findListOptions);
       })
     );
+    this.selectedBitstreamFormatIDs$ = this.selectedBitstreamFormatIDs();
   }
 
 

From 680ed3bccf38732ada602a7f01487c60035067ac Mon Sep 17 00:00:00 2001
From: Alexandre Vryghem <alexandre@atmire.com>
Date: Tue, 3 Sep 2024 22:08:38 +0200
Subject: [PATCH 3/6] 117287: Removed method calls returning observables from
 the Group form

---
 .../group-form/group-form.component.html      |  35 +-
 .../group-form/group-form.component.spec.ts   | 140 +++++---
 .../group-form/group-form.component.ts        | 331 ++++++++----------
 3 files changed, 256 insertions(+), 250 deletions(-)

diff --git a/src/app/access-control/group-registry/group-form/group-form.component.html b/src/app/access-control/group-registry/group-form/group-form.component.html
index 77a81a8daa0..546d4598dff 100644
--- a/src/app/access-control/group-registry/group-form/group-form.component.html
+++ b/src/app/access-control/group-registry/group-form/group-form.component.html
@@ -2,7 +2,7 @@
   <div class="group-form row">
     <div class="col-12">
 
-      <div *ngIf="groupDataService.getActiveGroup() | async; then editheader; else createHeader"></div>
+      <div *ngIf="activeGroup$ | async; then editheader; else createHeader"></div>
 
       <ng-template #createHeader>
         <h2 class="border-bottom pb-2">{{messagePrefix + '.head.create' | translate}}</h2>
@@ -23,11 +23,15 @@ <h2 class="border-bottom pb-2">
         </h2>
       </ng-template>
 
-      <ds-alert *ngIf="groupBeingEdited?.permanent" [type]="AlertTypeEnum.Warning"
-                [content]="messagePrefix + '.alert.permanent'"></ds-alert>
-      <ds-alert *ngIf="!(canEdit$ | async) && (groupDataService.getActiveGroup() | async)" [type]="AlertTypeEnum.Warning"
-                [content]="(messagePrefix + '.alert.workflowGroup' | translate:{ name: dsoNameService.getName((getLinkedDSO(groupBeingEdited) | async)?.payload), comcol: (getLinkedDSO(groupBeingEdited) | async)?.payload?.type, comcolEditRolesRoute: (getLinkedEditRolesRoute(groupBeingEdited) | async) })">
-      </ds-alert>
+      <ng-container *ngIf="(activeGroup$ | async) as groupBeingEdited">
+        <ds-alert *ngIf="groupBeingEdited?.permanent" [type]="AlertType.Warning"
+                  [content]="messagePrefix + '.alert.permanent'"></ds-alert>
+        <ng-container *ngIf="(activeGroupLinkedDSO$ | async) as activeGroupLinkedDSO">
+          <ds-alert *ngIf="!(canEdit$ | async)" [type]="AlertType.Warning"
+                    [content]="(messagePrefix + '.alert.workflowGroup' | translate:{ name: dsoNameService.getName(activeGroupLinkedDSO), comcol: activeGroupLinkedDSO.type, comcolEditRolesRoute: (linkedEditRolesRoute$ | async) })">
+          </ds-alert>
+        </ng-container>
+      </ng-container>
 
       <ds-form [formId]="formId"
                [formModel]="formModel"
@@ -39,7 +43,7 @@ <h2 class="border-bottom pb-2">
           <button (click)="onCancel()"
                   class="btn btn-outline-secondary"><i class="fas fa-arrow-left"></i> {{messagePrefix + '.return' | translate}}</button>
         </div>
-        <div after *ngIf="groupBeingEdited != null" class="btn-group">
+        <div after *ngIf="(activeGroup$ | async) as groupBeingEdited" class="btn-group">
           <button class="btn btn-danger delete-button" [disabled]="!(canEdit$ | async) || groupBeingEdited.permanent"
                   (click)="delete()">
             <i class="fa fa-trash"></i> {{ messagePrefix + '.actions.delete' | translate}}
@@ -47,15 +51,14 @@ <h2 class="border-bottom pb-2">
         </div>
       </ds-form>
 
-      <div class="mb-5">
-        <ds-members-list *ngIf="groupBeingEdited != null"
-                         [messagePrefix]="messagePrefix + '.members-list'"></ds-members-list>
-      </div>
-      <ds-subgroups-list *ngIf="groupBeingEdited != null"
-                         [messagePrefix]="messagePrefix + '.subgroups-list'"></ds-subgroups-list>
-
-
-
+      <ng-container *ngIf="(activeGroup$ | async) as groupBeingEdited">
+        <div class="mb-5">
+          <ds-members-list *ngIf="groupBeingEdited != null"
+                           [messagePrefix]="messagePrefix + '.members-list'"></ds-members-list>
+        </div>
+        <ds-subgroups-list *ngIf="groupBeingEdited != null"
+                           [messagePrefix]="messagePrefix + '.subgroups-list'"></ds-subgroups-list>
+      </ng-container>
     </div>
   </div>
 </div>
diff --git a/src/app/access-control/group-registry/group-form/group-form.component.spec.ts b/src/app/access-control/group-registry/group-form/group-form.component.spec.ts
index f8c5f3cd870..8d148b66fb9 100644
--- a/src/app/access-control/group-registry/group-form/group-form.component.spec.ts
+++ b/src/app/access-control/group-registry/group-form/group-form.component.spec.ts
@@ -1,13 +1,13 @@
 import { CommonModule } from '@angular/common';
 import { HttpClient } from '@angular/common/http';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { UntypedFormControl, UntypedFormGroup, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import { BrowserModule, By } from '@angular/platform-browser';
 import { ActivatedRoute, Router } from '@angular/router';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { Store } from '@ngrx/store';
-import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
 import { Observable, of as observableOf } from 'rxjs';
 import { RemoteDataBuildService } from '../../../core/cache/builders/remote-data-build.service';
 import { ObjectCacheService } from '../../../core/cache/object-cache.service';
@@ -29,8 +29,6 @@ import { GroupMock, GroupMock2 } from '../../../shared/testing/group-mock';
 import { GroupFormComponent } from './group-form.component';
 import { createSuccessfulRemoteDataObject$ } from '../../../shared/remote-data.utils';
 import { getMockFormBuilderService } from '../../../shared/mocks/form-builder-service.mock';
-import { getMockTranslateService } from '../../../shared/mocks/translate.service.mock';
-import { TranslateLoaderMock } from '../../../shared/testing/translate-loader.mock';
 import { RouterMock } from '../../../shared/mocks/router.mock';
 import { NotificationsServiceStub } from '../../../shared/testing/notifications-service.stub';
 import { Operation } from 'fast-json-patch';
@@ -38,23 +36,24 @@ import { ValidateGroupExists } from './validators/group-exists.validator';
 import { NoContent } from '../../../core/shared/NoContent.model';
 import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
 import { DSONameServiceMock } from '../../../shared/mocks/dso-name.service.mock';
+import { ActivatedRouteStub } from '../../../shared/testing/active-router.stub';
 
 describe('GroupFormComponent', () => {
   let component: GroupFormComponent;
   let fixture: ComponentFixture<GroupFormComponent>;
-  let translateService: TranslateService;
   let builderService: FormBuilderService;
   let ePersonDataServiceStub: any;
   let groupsDataServiceStub: any;
   let dsoDataServiceStub: any;
   let authorizationService: AuthorizationDataService;
   let notificationService: NotificationsServiceStub;
-  let router;
+  let router: RouterMock;
+  let route: ActivatedRouteStub;
 
-  let groups;
-  let groupName;
-  let groupDescription;
-  let expected;
+  let groups: Group[];
+  let groupName: string;
+  let groupDescription: string;
+  let expected: Group;
 
   beforeEach(waitForAsync(() => {
     groups = [GroupMock, GroupMock2];
@@ -69,6 +68,15 @@ describe('GroupFormComponent', () => {
           }
         ],
       },
+      object: createSuccessfulRemoteDataObject$(undefined),
+      _links: {
+        self: {
+          href: 'group-selflink',
+        },
+        object: {
+          href: 'group-objectlink',
+        }
+      },
     });
     ePersonDataServiceStub = {};
     groupsDataServiceStub = {
@@ -105,7 +113,14 @@ describe('GroupFormComponent', () => {
       create(group: Group): Observable<RemoteData<Group>> {
         this.allGroups = [...this.allGroups, group];
         this.createdGroup = Object.assign({}, group, {
-          _links: { self: { href: 'group-selflink' } }
+          _links: {
+            self: {
+              href: 'group-selflink',
+            },
+            object: {
+              href: 'group-objectlink',
+            },
+          },
         });
         return createSuccessfulRemoteDataObject$(this.createdGroup);
       },
@@ -187,17 +202,13 @@ describe('GroupFormComponent', () => {
         return typeof value === 'object' && value !== null;
       }
     });
-    translateService = getMockTranslateService();
     router = new RouterMock();
+    route = new ActivatedRouteStub();
     notificationService = new NotificationsServiceStub();
+
     return TestBed.configureTestingModule({
       imports: [CommonModule, NgbModule, FormsModule, ReactiveFormsModule, BrowserModule,
-        TranslateModule.forRoot({
-          loader: {
-            provide: TranslateLoader,
-            useClass: TranslateLoaderMock
-          }
-        }),
+        TranslateModule.forRoot(),
       ],
       declarations: [GroupFormComponent],
       providers: [
@@ -214,14 +225,11 @@ describe('GroupFormComponent', () => {
         { provide: Store, useValue: {} },
         { provide: RemoteDataBuildService, useValue: {} },
         { provide: HALEndpointService, useValue: {} },
-        {
-          provide: ActivatedRoute,
-          useValue: { data: observableOf({ dso: { payload: {} } }), params: observableOf({}) }
-        },
+        { provide: ActivatedRoute, useValue: route },
         { provide: Router, useValue: router },
         { provide: AuthorizationDataService, useValue: authorizationService },
       ],
-      schemas: [NO_ERRORS_SCHEMA]
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();
   }));
 
@@ -234,8 +242,8 @@ describe('GroupFormComponent', () => {
   describe('when submitting the form', () => {
     beforeEach(() => {
       spyOn(component.submitForm, 'emit');
-      component.groupName.value = groupName;
-      component.groupDescription.value = groupDescription;
+      component.groupName.setValue(groupName);
+      component.groupDescription.setValue(groupDescription);
     });
     describe('without active Group', () => {
       beforeEach(() => {
@@ -243,14 +251,22 @@ describe('GroupFormComponent', () => {
         fixture.detectChanges();
       });
 
-      it('should emit a new group using the correct values', (async () => {
-        await fixture.whenStable().then(() => {
-          expect(component.submitForm.emit).toHaveBeenCalledWith(expected);
-        });
+      it('should emit a new group using the correct values', (() => {
+        expect(component.submitForm.emit).toHaveBeenCalledWith(jasmine.objectContaining({
+          name: groupName,
+          metadata: {
+            'dc.description': [
+              {
+                value: groupDescription,
+              },
+            ],
+          },
+        }));
       }));
     });
+
     describe('with active Group', () => {
-      let expected2;
+      let expected2: Group;
       beforeEach(() => {
         expected2 = Object.assign(new Group(), {
           name: 'newGroupName',
@@ -261,15 +277,24 @@ describe('GroupFormComponent', () => {
               }
             ],
           },
+          object: createSuccessfulRemoteDataObject$(undefined),
+          _links: {
+            self: {
+              href: 'group-selflink',
+            },
+            object: {
+              href: 'group-objectlink',
+            },
+          },
         });
         spyOn(groupsDataServiceStub, 'getActiveGroup').and.returnValue(observableOf(expected));
         spyOn(groupsDataServiceStub, 'patch').and.returnValue(createSuccessfulRemoteDataObject$(expected2));
-        component.groupName.value = 'newGroupName';
-        component.onSubmit();
-        fixture.detectChanges();
+        component.ngOnInit();
       });
 
       it('should edit with name and description operations', () => {
+        component.groupName.setValue('newGroupName');
+        component.onSubmit();
         const operations = [{
           op: 'add',
           path: '/metadata/dc.description',
@@ -283,9 +308,8 @@ describe('GroupFormComponent', () => {
       });
 
       it('should edit with description operations', () => {
-        component.groupName.value = null;
+        component.groupName.setValue(null);
         component.onSubmit();
-        fixture.detectChanges();
         const operations = [{
           op: 'add',
           path: '/metadata/dc.description',
@@ -295,9 +319,9 @@ describe('GroupFormComponent', () => {
       });
 
       it('should edit with name operations', () => {
-        component.groupDescription.value = null;
+        component.groupName.setValue('newGroupName');
+        component.groupDescription.setValue(null);
         component.onSubmit();
-        fixture.detectChanges();
         const operations = [{
           op: 'replace',
           path: '/name',
@@ -306,12 +330,13 @@ describe('GroupFormComponent', () => {
         expect(groupsDataServiceStub.patch).toHaveBeenCalledWith(expected, operations);
       });
 
-      it('should emit the existing group using the correct new values', (async () => {
-        await fixture.whenStable().then(() => {
-          expect(component.submitForm.emit).toHaveBeenCalledWith(expected2);
-        });
-      }));
+      it('should emit the existing group using the correct new values', () => {
+        component.onSubmit();
+        expect(component.submitForm.emit).toHaveBeenCalledWith(expected2);
+      });
+
       it('should emit success notification', () => {
+        component.onSubmit();
         expect(notificationService.success).toHaveBeenCalled();
       });
     });
@@ -326,11 +351,8 @@ describe('GroupFormComponent', () => {
 
 
   describe('check form validation', () => {
-    let groupCommunity;
-
     beforeEach(() => {
       groupName = 'testName';
-      groupCommunity = 'testgroupCommunity';
       groupDescription = 'testgroupDescription';
 
       expected = Object.assign(new Group(), {
@@ -342,8 +364,17 @@ describe('GroupFormComponent', () => {
             }
           ],
         },
+        _links: {
+          self: {
+            href: 'group-selflink',
+          },
+          object: {
+            href: 'group-objectlink',
+          },
+        },
       });
       spyOn(component.submitForm, 'emit');
+      spyOn(dsoDataServiceStub, 'findByHref').and.returnValue(observableOf(expected));
 
       fixture.detectChanges();
       component.initialisePage();
@@ -393,21 +424,20 @@ describe('GroupFormComponent', () => {
   });
 
   describe('delete', () => {
-    let deleteButton;
-
-    beforeEach(() => {
-      component.initialisePage();
+    let deleteButton: HTMLButtonElement;
 
+    beforeEach(async () => {
+      spyOn(groupsDataServiceStub, 'delete').and.callThrough();
+      component.activeGroup$ = observableOf({
+        id: 'active-group',
+        permanent: false,
+      } as Group);
       component.canEdit$ = observableOf(true);
-      component.groupBeingEdited = {
-        permanent: false
-      } as Group;
+
+      component.initialisePage();
 
       fixture.detectChanges();
       deleteButton = fixture.debugElement.query(By.css('.delete-button')).nativeElement;
-
-      spyOn(groupsDataServiceStub, 'delete').and.callThrough();
-      spyOn(groupsDataServiceStub, 'getActiveGroup').and.returnValue(observableOf({ id: 'active-group' }));
     });
 
     describe('if confirmed via modal', () => {
diff --git a/src/app/access-control/group-registry/group-form/group-form.component.ts b/src/app/access-control/group-registry/group-form/group-form.component.ts
index 3c0547cca50..37ce30473f2 100644
--- a/src/app/access-control/group-registry/group-form/group-form.component.ts
+++ b/src/app/access-control/group-registry/group-form/group-form.component.ts
@@ -1,5 +1,5 @@
 import { Component, EventEmitter, HostListener, OnDestroy, OnInit, Output, ChangeDetectorRef } from '@angular/core';
-import { UntypedFormGroup } from '@angular/forms';
+import { UntypedFormGroup, AbstractControl } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import {
@@ -10,13 +10,10 @@ import {
 } from '@ng-dynamic-forms/core';
 import { TranslateService } from '@ngx-translate/core';
 import {
-  ObservedValueOf,
-  combineLatest as observableCombineLatest,
   Observable,
-  of as observableOf,
-  Subscription,
+  Subscription, combineLatest,
 } from 'rxjs';
-import { catchError, map, switchMap, take, filter, debounceTime } from 'rxjs/operators';
+import { map, switchMap, take, debounceTime, startWith, filter } from 'rxjs/operators';
 import { getCollectionEditRolesRoute } from '../../../collection-page/collection-page-routing-paths';
 import { getCommunityEditRolesRoute } from '../../../community-page/community-page-routing-paths';
 import { DSpaceObjectDataService } from '../../../core/data/dspace-object-data.service';
@@ -25,21 +22,20 @@ import { FeatureID } from '../../../core/data/feature-authorization/feature-id';
 import { PaginatedList } from '../../../core/data/paginated-list.model';
 import { RemoteData } from '../../../core/data/remote-data';
 import { RequestService } from '../../../core/data/request.service';
-import { EPersonDataService } from '../../../core/eperson/eperson-data.service';
 import { GroupDataService } from '../../../core/eperson/group-data.service';
 import { Group } from '../../../core/eperson/models/group.model';
 import { Collection } from '../../../core/shared/collection.model';
 import { Community } from '../../../core/shared/community.model';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import {
+  getAllCompletedRemoteData,
   getRemoteDataPayload,
   getFirstSucceededRemoteData,
   getFirstCompletedRemoteData,
-  getFirstSucceededRemoteDataPayload
 } from '../../../core/shared/operators';
 import { AlertType } from '../../../shared/alert/aletr-type';
 import { ConfirmationModalComponent } from '../../../shared/confirmation-modal/confirmation-modal.component';
-import { hasValue, isNotEmpty, hasValueOperator } from '../../../shared/empty.util';
+import { hasValue, isNotEmpty, hasValueOperator, hasNoValue } from '../../../shared/empty.util';
 import { FormBuilderService } from '../../../shared/form/builder/form-builder.service';
 import { NotificationsService } from '../../../shared/notifications/notifications.service';
 import { followLink } from '../../../shared/utils/follow-link-config.model';
@@ -68,9 +64,9 @@ export class GroupFormComponent implements OnInit, OnDestroy {
   /**
    * Dynamic models for the inputs of form
    */
-  groupName: DynamicInputModel;
-  groupCommunity: DynamicInputModel;
-  groupDescription: DynamicTextAreaModel;
+  groupName: AbstractControl;
+  groupCommunity: AbstractControl;
+  groupDescription: AbstractControl;
 
   /**
    * A list of all dynamic input models
@@ -114,20 +110,29 @@ export class GroupFormComponent implements OnInit, OnDestroy {
   subs: Subscription[] = [];
 
   /**
-   * Group currently being edited
+   * Observable whether or not the logged in user is allowed to delete the Group & doesn't have a linked object (community / collection linked to workspace group
    */
-  groupBeingEdited: Group;
+  canEdit$: Observable<boolean>;
 
   /**
-   * Observable whether or not the logged in user is allowed to delete the Group & doesn't have a linked object (community / collection linked to workspace group
+   * The current {@link Group}
    */
-  canEdit$: Observable<boolean>;
+  activeGroup$: Observable<Group>;
+
+  /**
+   * The current {@link Group}'s linked {@link Community}/{@link Collection}
+   */
+  activeGroupLinkedDSO$: Observable<DSpaceObject>;
+
+  /**
+   * Link to the current {@link Group}'s {@link Community}/{@link Collection} edit role tab
+   */
+  linkedEditRolesRoute$: Observable<string>;
 
   /**
    * The AlertType enumeration
-   * @type {AlertType}
    */
-  public AlertTypeEnum = AlertType;
+  public readonly AlertType = AlertType;
 
   /**
    * Subscription to email field value change
@@ -137,124 +142,110 @@ export class GroupFormComponent implements OnInit, OnDestroy {
 
   constructor(
     public groupDataService: GroupDataService,
-    private ePersonDataService: EPersonDataService,
-    private dSpaceObjectDataService: DSpaceObjectDataService,
-    private formBuilderService: FormBuilderService,
-    private translateService: TranslateService,
-    private notificationsService: NotificationsService,
-    private route: ActivatedRoute,
+    protected dSpaceObjectDataService: DSpaceObjectDataService,
+    protected formBuilderService: FormBuilderService,
+    protected translateService: TranslateService,
+    protected notificationsService: NotificationsService,
+    protected route: ActivatedRoute,
     protected router: Router,
-    private authorizationService: AuthorizationDataService,
-    private modalService: NgbModal,
+    protected authorizationService: AuthorizationDataService,
+    protected modalService: NgbModal,
     public requestService: RequestService,
     protected changeDetectorRef: ChangeDetectorRef,
     public dsoNameService: DSONameService,
   ) {
   }
 
-  ngOnInit() {
+  ngOnInit(): void {
+    if (this.route.snapshot.params.groupId !== 'newGroup') {
+      this.setActiveGroup(this.route.snapshot.params.groupId);
+    }
+    this.activeGroup$ = this.groupDataService.getActiveGroup();
+    this.activeGroupLinkedDSO$ = this.getActiveGroupLinkedDSO();
+    this.linkedEditRolesRoute$ = this.getLinkedEditRolesRoute();
+    this.canEdit$ = this.activeGroupLinkedDSO$.pipe(
+      filter((dso: DSpaceObject) => hasNoValue(dso)),
+      switchMap(() => this.activeGroup$),
+      hasValueOperator(),
+      switchMap((group: Group) => this.authorizationService.isAuthorized(FeatureID.CanDelete, group.self)),
+      startWith(false),
+    );
     this.initialisePage();
   }
 
   initialisePage() {
-    this.subs.push(this.route.params.subscribe((params) => {
-      if (params.groupId !== 'newGroup') {
-        this.setActiveGroup(params.groupId);
-      }
-    }));
-    this.canEdit$ = this.groupDataService.getActiveGroup().pipe(
-      hasValueOperator(),
-      switchMap((group: Group) => {
-        return observableCombineLatest(
-          this.authorizationService.isAuthorized(FeatureID.CanDelete, isNotEmpty(group) ? group.self : undefined),
-          this.hasLinkedDSO(group),
-          (isAuthorized: ObservedValueOf<Observable<boolean>>, hasLinkedDSO: ObservedValueOf<Observable<boolean>>) => {
-            return isAuthorized && !hasLinkedDSO;
-          });
-      })
-    );
-    observableCombineLatest(
-      this.translateService.get(`${this.messagePrefix}.groupName`),
-      this.translateService.get(`${this.messagePrefix}.groupCommunity`),
-      this.translateService.get(`${this.messagePrefix}.groupDescription`)
-    ).subscribe(([groupName, groupCommunity, groupDescription]) => {
-      this.groupName = new DynamicInputModel({
-        id: 'groupName',
-        label: groupName,
-        name: 'groupName',
-        validators: {
-          required: null,
-        },
-        required: true,
-      });
-      this.groupCommunity = new DynamicInputModel({
-        id: 'groupCommunity',
-        label: groupCommunity,
-        name: 'groupCommunity',
-        required: false,
-        readOnly: true,
-      });
-      this.groupDescription = new DynamicTextAreaModel({
-        id: 'groupDescription',
-        label: groupDescription,
-        name: 'groupDescription',
-        required: false,
-        spellCheck: environment.form.spellCheck,
+    const groupNameModel = new DynamicInputModel({
+      id: 'groupName',
+      label: this.translateService.instant(`${this.messagePrefix}.groupName`),
+      name: 'groupName',
+      validators: {
+        required: null,
+      },
+      required: true,
+    });
+    const groupCommunityModel = new DynamicInputModel({
+      id: 'groupCommunity',
+      label: this.translateService.instant(`${this.messagePrefix}.groupCommunity`),
+      name: 'groupCommunity',
+      required: false,
+      readOnly: true,
+    });
+    const groupDescriptionModel = new DynamicTextAreaModel({
+      id: 'groupDescription',
+      label: this.translateService.instant(`${this.messagePrefix}.groupDescription`),
+      name: 'groupDescription',
+      required: false,
+      spellCheck: environment.form.spellCheck,
+    });
+    this.formModel = [
+      groupNameModel,
+      groupDescriptionModel,
+    ];
+    this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
+    this.groupName = this.formGroup.get('groupName');
+    this.groupDescription = this.formGroup.get('groupDescription');
+
+    if (hasValue(this.groupName)) {
+      this.groupName.setAsyncValidators(ValidateGroupExists.createValidator(this.groupDataService));
+      this.groupNameValueChangeSubscribe = this.groupName.valueChanges.pipe(debounceTime(300)).subscribe(() => {
+        this.changeDetectorRef.detectChanges();
       });
-      this.formModel = [
-        this.groupName,
-        this.groupDescription,
-      ];
-      this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
-
-      if (!!this.formGroup.controls.groupName) {
-        this.formGroup.controls.groupName.setAsyncValidators(ValidateGroupExists.createValidator(this.groupDataService));
-        this.groupNameValueChangeSubscribe = this.groupName.valueChanges.pipe(debounceTime(300)).subscribe(() => {
-          this.changeDetectorRef.detectChanges();
-        });
-      }
-
-      this.subs.push(
-        observableCombineLatest(
-          this.groupDataService.getActiveGroup(),
-          this.canEdit$,
-          this.groupDataService.getActiveGroup()
-            .pipe(filter((activeGroup) => hasValue(activeGroup)),switchMap((activeGroup) => this.getLinkedDSO(activeGroup).pipe(getFirstSucceededRemoteDataPayload())))
-        ).subscribe(([activeGroup, canEdit, linkedObject]) => {
-
-          if (activeGroup != null) {
-
-            // Disable group name exists validator
-            this.formGroup.controls.groupName.clearAsyncValidators();
-
-            this.groupBeingEdited = activeGroup;
+    }
 
-            if (linkedObject?.name) {
-              this.formBuilderService.insertFormGroupControl(1, this.formGroup, this.formModel, this.groupCommunity);
-              this.formGroup.patchValue({
-                groupName: activeGroup.name,
-                groupCommunity: linkedObject?.name ?? '',
-                groupDescription: activeGroup.firstMetadataValue('dc.description'),
-              });
-            } else {
-              this.formModel = [
-                this.groupName,
-                this.groupDescription,
-              ];
-              this.formGroup.patchValue({
-                groupName: activeGroup.name,
-                groupDescription: activeGroup.firstMetadataValue('dc.description'),
-              });
-            }
-            setTimeout(() => {
-              if (!canEdit || activeGroup.permanent) {
-                this.formGroup.disable();
-              }
-            }, 200);
+    this.subs.push(
+      combineLatest([
+        this.activeGroup$,
+        this.canEdit$,
+        this.activeGroupLinkedDSO$.pipe(take(1)),
+      ]).subscribe(([activeGroup, canEdit, linkedObject]) => {
+
+        if (activeGroup != null) {
+
+          // Disable group name exists validator
+          this.formGroup.controls.groupName.clearAsyncValidators();
+
+          if (linkedObject?.name) {
+            this.formBuilderService.insertFormGroupControl(1, this.formGroup, this.formModel, groupCommunityModel);
+            this.groupDescription = this.formGroup.get('groupCommunity');
+            this.formGroup.patchValue({
+              groupName: activeGroup.name,
+              groupCommunity: linkedObject?.name ?? '',
+              groupDescription: activeGroup.firstMetadataValue('dc.description'),
+            });
+          } else {
+            this.formGroup.patchValue({
+              groupName: activeGroup.name,
+              groupDescription: activeGroup.firstMetadataValue('dc.description'),
+            });
           }
-        })
-      );
-    });
+          setTimeout(() => {
+            if (!canEdit || activeGroup.permanent) {
+              this.formGroup.disable();
+            }
+          }, 200);
+        }
+      })
+    );
   }
 
   /**
@@ -273,25 +264,22 @@ export class GroupFormComponent implements OnInit, OnDestroy {
    * Emit the updated/created eperson using the EventEmitter submitForm
    */
   onSubmit() {
-    this.groupDataService.getActiveGroup().pipe(take(1)).subscribe(
-      (group: Group) => {
-        const values = {
+    this.activeGroup$.pipe(take(1)).subscribe((group: Group) => {
+      if (group === null) {
+        this.createNewGroup({
           name: this.groupName.value,
           metadata: {
             'dc.description': [
               {
-                value: this.groupDescription.value
-              }
-            ]
+                value: this.groupDescription.value,
+              },
+            ],
           },
-        };
-        if (group === null) {
-          this.createNewGroup(values);
-        } else {
-          this.editGroup(group);
-        }
+        });
+      } else {
+        this.editGroup(group);
       }
-    );
+    });
   }
 
   /**
@@ -397,7 +385,7 @@ export class GroupFormComponent implements OnInit, OnDestroy {
    * @param groupSelfLink   SelfLink of group to set as active
    */
   setActiveGroupWithLink(groupSelfLink: string) {
-    this.groupDataService.getActiveGroup().pipe(take(1)).subscribe((activeGroup: Group) => {
+    this.activeGroup$.pipe(take(1)).subscribe((activeGroup: Group) => {
       if (activeGroup === null) {
         this.groupDataService.cancelEditGroup();
         this.groupDataService.findByHref(groupSelfLink, false, false, followLink('subgroups'), followLink('epersons'), followLink('object'))
@@ -416,7 +404,7 @@ export class GroupFormComponent implements OnInit, OnDestroy {
    * It'll either show a success or error message depending on whether the delete was successful or not.
    */
   delete() {
-    this.groupDataService.getActiveGroup().pipe(take(1)).subscribe((group: Group) => {
+    this.activeGroup$.pipe(take(1)).subscribe((group: Group) => {
       const modalRef = this.modalService.open(ConfirmationModalComponent);
       modalRef.componentInstance.dso = group;
       modalRef.componentInstance.headerLabel = this.messagePrefix + '.delete-group.modal.header';
@@ -460,52 +448,37 @@ export class GroupFormComponent implements OnInit, OnDestroy {
   }
 
   /**
-   * Check if group has a linked object (community or collection linked to a workflow group)
-   * @param group
-   */
-  hasLinkedDSO(group: Group): Observable<boolean> {
-    if (hasValue(group) && hasValue(group._links.object.href)) {
-      return this.getLinkedDSO(group).pipe(
-        map((rd: RemoteData<DSpaceObject>) => {
-          return hasValue(rd) && hasValue(rd.payload);
-        }),
-        catchError(() => observableOf(false)),
-      );
-    }
-  }
-
-  /**
-   * Get group's linked object if it has one (community or collection linked to a workflow group)
-   * @param group
+   * Get the active {@link Group}'s linked object if it has one ({@link Community} or {@link Collection} linked to a
+   * workflow group)
    */
-  getLinkedDSO(group: Group): Observable<RemoteData<DSpaceObject>> {
-    if (hasValue(group) && hasValue(group._links.object.href)) {
-      if (group.object === undefined) {
-        return this.dSpaceObjectDataService.findByHref(group._links.object.href);
-      }
-      return group.object;
-    }
+  getActiveGroupLinkedDSO(): Observable<DSpaceObject> {
+    return this.activeGroup$.pipe(
+      hasValueOperator(),
+      switchMap((group: Group) => {
+        if (group.object === undefined) {
+          return this.dSpaceObjectDataService.findByHref(group._links.object.href);
+        }
+        return group.object;
+      }),
+      getAllCompletedRemoteData(),
+      getRemoteDataPayload(),
+    );
   }
 
   /**
-   * Get the route to the edit roles tab of the group's linked object (community or collection linked to a workflow group) if it has one
-   * @param group
+   * Get the route to the edit roles tab of the active {@link Group}'s linked object (community or collection linked
+   * to a workflow group) if it has one
    */
-  getLinkedEditRolesRoute(group: Group): Observable<string> {
-    if (hasValue(group) && hasValue(group._links.object.href)) {
-      return this.getLinkedDSO(group).pipe(
-        map((rd: RemoteData<DSpaceObject>) => {
-          if (hasValue(rd) && hasValue(rd.payload)) {
-            const dso = rd.payload;
-            switch ((dso as any).type) {
-              case Community.type.value:
-                return getCommunityEditRolesRoute(rd.payload.id);
-              case Collection.type.value:
-                return getCollectionEditRolesRoute(rd.payload.id);
-            }
-          }
-        })
-      );
-    }
+  getLinkedEditRolesRoute(): Observable<string> {
+    return this.activeGroupLinkedDSO$.pipe(
+      map((dso: DSpaceObject) => {
+        switch ((dso as any).type) {
+          case Community.type.value:
+            return getCommunityEditRolesRoute(dso.id);
+          case Collection.type.value:
+            return getCollectionEditRolesRoute(dso.id);
+        }
+      })
+    );
   }
 }

From b55686e1870cfb5083832239b5b2dbe18160c419 Mon Sep 17 00:00:00 2001
From: Alexandre Vryghem <alexandre@atmire.com>
Date: Tue, 3 Sep 2024 22:32:32 +0200
Subject: [PATCH 4/6] 117287: Removed method calls returning observables from
 the pagination component

---
 .../pagination/pagination.component.html      |   2 +-
 .../shared/pagination/pagination.component.ts | 106 +++++++++---------
 2 files changed, 52 insertions(+), 56 deletions(-)

diff --git a/src/app/shared/pagination/pagination.component.html b/src/app/shared/pagination/pagination.component.html
index 7d90c6a439d..d1a820b1daf 100644
--- a/src/app/shared/pagination/pagination.component.html
+++ b/src/app/shared/pagination/pagination.component.html
@@ -3,7 +3,7 @@
     <div class="row">
       <div *ngIf="!hidePaginationDetail && collectionSize > 0" class="col-auto pagination-info">
           <span class="align-middle hidden-xs-down">{{ 'pagination.showing.label' | translate }}</span>
-          <span class="align-middle">{{ 'pagination.showing.detail' | translate:(getShowingDetails(collectionSize)|async)}}</span>
+          <span class="align-middle">{{ 'pagination.showing.detail' | translate:(showingDetails$ | async)}}</span>
       </div>
       <div class="col">
         <div *ngIf="!hideGear" ngbDropdown #paginationControls="ngbDropdown" placement="bottom-right" class="d-inline-block float-right">
diff --git a/src/app/shared/pagination/pagination.component.ts b/src/app/shared/pagination/pagination.component.ts
index 6da813cbc7d..0e393455952 100644
--- a/src/app/shared/pagination/pagination.component.ts
+++ b/src/app/shared/pagination/pagination.component.ts
@@ -4,27 +4,33 @@ import {
   Component,
   EventEmitter,
   Input,
+  OnChanges,
   OnDestroy,
   OnInit,
   Output,
-  ViewEncapsulation
+  SimpleChanges,
+  ViewEncapsulation,
 } from '@angular/core';
 
-import { Observable, of as observableOf, Subscription } from 'rxjs';
+import { Observable, of as observableOf, Subscription, switchMap } from 'rxjs';
 
 import { HostWindowService } from '../host-window.service';
-import { HostWindowState } from '../search/host-window.reducer';
 import { PaginationComponentOptions } from './pagination-component-options.model';
 import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
-import { hasValue } from '../empty.util';
+import { hasValue, hasValueOperator } from '../empty.util';
 import { PageInfo } from '../../core/shared/page-info.model';
 import { PaginationService } from '../../core/pagination/pagination.service';
-import { map, take } from 'rxjs/operators';
+import { map, take, startWith } from 'rxjs/operators';
 import { RemoteData } from '../../core/data/remote-data';
 import { PaginatedList } from '../../core/data/paginated-list.model';
 import { ListableObject } from '../object-collection/shared/listable-object.model';
 import { ViewMode } from '../../core/shared/view-mode.model';
 
+interface PaginationDetails {
+  range: string;
+  total: number;
+}
+
 /**
  * The default pagination controls component.
  */
@@ -36,7 +42,7 @@ import { ViewMode } from '../../core/shared/view-mode.model';
   changeDetection: ChangeDetectionStrategy.Default,
   encapsulation: ViewEncapsulation.Emulated
 })
-export class PaginationComponent implements OnDestroy, OnInit {
+export class PaginationComponent implements OnChanges, OnDestroy, OnInit {
   /**
    * ViewMode that should be passed to {@link ListableObjectComponentLoaderComponent}.
    */
@@ -143,11 +149,6 @@ export class PaginationComponent implements OnDestroy, OnInit {
    */
   public currentPageState: number = undefined;
 
-  /**
-   * An observable of HostWindowState type
-   */
-  public hostWindow: Observable<HostWindowState>;
-
   /**
    * ID for the pagination instance. This ID is used in the routing to retrieve the pagination options.
    * This ID needs to be unique between different pagination components when more than one will be displayed on the same page.
@@ -186,6 +187,9 @@ export class PaginationComponent implements OnDestroy, OnInit {
   public sortField$;
   public defaultSortField = 'name';
 
+
+  public showingDetails$: Observable<PaginationDetails>;
+
   /**
    * Array to track all subscriptions and unsubscribe them onDestroy
    * @type {Array}
@@ -214,6 +218,12 @@ export class PaginationComponent implements OnDestroy, OnInit {
     this.initializeConfig();
   }
 
+  ngOnChanges(changes: SimpleChanges): void {
+    if (changes.collectionSize.currentValue !== changes.collectionSize.previousValue) {
+      this.showingDetails$ = this.getShowingDetails(this.collectionSize);
+    }
+  }
+
   /**
    * Method provided by Angular. Invoked when the instance is destroyed.
    */
@@ -251,19 +261,11 @@ export class PaginationComponent implements OnDestroy, OnInit {
       );
   }
 
-  /**
-   * @param cdRef
-   *    ChangeDetectorRef is a singleton service provided by Angular.
-   * @param route
-   *    Route is a singleton service provided by Angular.
-   * @param router
-   *    Router is a singleton service provided by Angular.
-   * @param hostWindowService
-   *    the HostWindowService singleton.
-   */
-  constructor(private cdRef: ChangeDetectorRef,
-              private paginationService: PaginationService,
-              public hostWindowService: HostWindowService) {
+  constructor(
+    protected cdRef: ChangeDetectorRef,
+    protected paginationService: PaginationService,
+    public hostWindowService: HostWindowService,
+  ) {
   }
 
   /**
@@ -299,17 +301,6 @@ export class PaginationComponent implements OnDestroy, OnInit {
     this.emitPaginationChange();
   }
 
-  /**
-   * Method to change the route to the given sort field
-   *
-   * @param sortField
-   *    The sort field being navigated to.
-   */
-  public doSortFieldChange(field: string) {
-    this.updateParams({ pageId: this.id, page: 1, sortField: field });
-    this.emitPaginationChange();
-  }
-
   /**
    * Method to emit a general pagination change event
    */
@@ -328,26 +319,31 @@ export class PaginationComponent implements OnDestroy, OnInit {
   /**
    * Method to get pagination details of the current viewed page.
    */
-  public getShowingDetails(collectionSize: number): Observable<any> {
-    let showingDetails = observableOf({ range: null + ' - ' + null, total: null });
-    if (collectionSize) {
-      showingDetails = this.paginationService.getCurrentPagination(this.id, this.paginationOptions).pipe(
-        map((currentPaginationOptions) => {
-          let firstItem;
-          let lastItem;
-          const pageMax = currentPaginationOptions.pageSize * currentPaginationOptions.currentPage;
-
-          firstItem = currentPaginationOptions.pageSize * (currentPaginationOptions.currentPage - 1) + 1;
-          if (collectionSize > pageMax) {
-            lastItem = pageMax;
-          } else {
-            lastItem = collectionSize;
-          }
-          return {range: firstItem + ' - ' + lastItem, total: collectionSize};
-        })
-      );
-    }
-    return showingDetails;
+  public getShowingDetails(collectionSize: number): Observable<PaginationDetails> {
+    return observableOf(collectionSize).pipe(
+      hasValueOperator(),
+      switchMap(() => this.paginationService.getCurrentPagination(this.id, this.paginationOptions)),
+      map((currentPaginationOptions) => {
+        let firstItem: number;
+        let lastItem: number;
+        const pageMax = currentPaginationOptions.pageSize * currentPaginationOptions.currentPage;
+
+        firstItem = currentPaginationOptions.pageSize * (currentPaginationOptions.currentPage - 1) + 1;
+        if (collectionSize > pageMax) {
+          lastItem = pageMax;
+        } else {
+          lastItem = collectionSize;
+        }
+        return {
+          range: `${firstItem} - ${lastItem}`,
+          total: collectionSize,
+        };
+      }),
+      startWith({
+        range: `${null} - ${null}`,
+        total: null,
+      }),
+    );
   }
 
   /**

From c74c178533d8ffd2c4cca926896b703e10af00b8 Mon Sep 17 00:00:00 2001
From: Alexandre Vryghem <alexandre@atmire.com>
Date: Thu, 5 Sep 2024 10:50:13 +0200
Subject: [PATCH 5/6] 117287: Removed method calls returning observables from
 the metadata registry

---
 .../metadata-registry.component.html          |   4 +-
 .../metadata-registry.component.spec.ts       |  42 ++---
 .../metadata-registry.component.ts            | 128 +++++++---------
 .../metadata-schema-form.component.html       |   2 +-
 .../metadata-schema-form.component.spec.ts    |  37 ++---
 .../metadata-schema-form.component.ts         | 143 +++++++++---------
 .../shared/testing/registry.service.stub.ts   | 107 +++++++++++++
 7 files changed, 267 insertions(+), 196 deletions(-)
 create mode 100644 src/app/shared/testing/registry.service.stub.ts

diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.html b/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.html
index 35bffad185c..0f9df119c71 100644
--- a/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.html
+++ b/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.html
@@ -27,11 +27,11 @@ <h2 id="header" class="border-bottom pb-2">{{'admin.registries.metadata.head' |
                         </thead>
                         <tbody>
                         <tr *ngFor="let schema of (metadataSchemas | async)?.payload?.page"
-                            [ngClass]="{'table-primary' : isActive(schema) | async}">
+                            [ngClass]="{'table-primary' : (activeMetadataSchema$ | async)?.id === schema.id}">
                             <td>
                                 <label class="mb-0">
                                     <input type="checkbox"
-                                           [checked]="isSelected(schema) | async"
+                                           [checked]="(selectedMetadataSchemaIDs$ | async)?.includes(schema.id)"
                                            (change)="selectMetadataSchema(schema, $event)"
                                     >
                                 </label>
diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.spec.ts b/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.spec.ts
index 944288a7a51..d69d14aacf6 100644
--- a/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.spec.ts
+++ b/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.spec.ts
@@ -1,7 +1,6 @@
 import { MetadataRegistryComponent } from './metadata-registry.component';
 import { ComponentFixture, inject, TestBed, waitForAsync } from '@angular/core/testing';
 import { of as observableOf } from 'rxjs';
-import { buildPaginatedList } from '../../../core/data/paginated-list.model';
 import { TranslateModule } from '@ngx-translate/core';
 import { By } from '@angular/platform-browser';
 import { CommonModule } from '@angular/common';
@@ -15,18 +14,21 @@ import { HostWindowService } from '../../../shared/host-window.service';
 import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
 import { NotificationsService } from '../../../shared/notifications/notifications.service';
 import { NotificationsServiceStub } from '../../../shared/testing/notifications-service.stub';
-import { RestResponse } from '../../../core/cache/response.models';
 import { MetadataSchema } from '../../../core/metadata/metadata-schema.model';
 import { createSuccessfulRemoteDataObject$ } from '../../../shared/remote-data.utils';
 import { PaginationService } from '../../../core/pagination/pagination.service';
 import { PaginationServiceStub } from '../../../shared/testing/pagination-service.stub';
+import { RegistryServiceStub } from '../../../shared/testing/registry.service.stub';
+import { createPaginatedList } from '../../../shared/testing/utils.test';
 
 describe('MetadataRegistryComponent', () => {
   let comp: MetadataRegistryComponent;
   let fixture: ComponentFixture<MetadataRegistryComponent>;
-  let registryService: RegistryService;
-  let paginationService;
-  const mockSchemasList = [
+
+  let paginationService: PaginationServiceStub;
+  let registryService: RegistryServiceStub;
+
+  const mockSchemasList: MetadataSchema[] = [
     {
       id: 1,
       _links: {
@@ -47,32 +49,18 @@ describe('MetadataRegistryComponent', () => {
       prefix: 'mock',
       namespace: 'http://dspace.org/mockschema'
     }
-  ];
-  const mockSchemas = createSuccessfulRemoteDataObject$(buildPaginatedList(null, mockSchemasList));
-  /* eslint-disable no-empty,@typescript-eslint/no-empty-function */
-  const registryServiceStub = {
-    getMetadataSchemas: () => mockSchemas,
-    getActiveMetadataSchema: () => observableOf(undefined),
-    getSelectedMetadataSchemas: () => observableOf([]),
-    editMetadataSchema: (schema) => {
-    },
-    cancelEditMetadataSchema: () => {
-    },
-    deleteMetadataSchema: () => observableOf(new RestResponse(true, 200, 'OK')),
-    deselectAllMetadataSchema: () => {
-    },
-    clearMetadataSchemaRequests: () => observableOf(undefined)
-  };
-  /* eslint-enable no-empty, @typescript-eslint/no-empty-function */
-
-  paginationService = new PaginationServiceStub();
+  ] as MetadataSchema[];
 
   beforeEach(waitForAsync(() => {
+    paginationService = new PaginationServiceStub();
+    registryService = new RegistryServiceStub();
+    spyOn(registryService, 'getMetadataSchemas').and.returnValue(createSuccessfulRemoteDataObject$(createPaginatedList(mockSchemasList)));
+
     TestBed.configureTestingModule({
       imports: [CommonModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), NgbModule],
       declarations: [MetadataRegistryComponent, PaginationComponent, EnumKeysPipe],
       providers: [
-        { provide: RegistryService, useValue: registryServiceStub },
+        { provide: RegistryService, useValue: registryService },
         { provide: HostWindowService, useValue: new HostWindowServiceStub(0) },
         { provide: PaginationService, useValue: paginationService },
         { provide: NotificationsService, useValue: new NotificationsServiceStub() }
@@ -123,7 +111,7 @@ describe('MetadataRegistryComponent', () => {
     }));
 
     it('should cancel editing the selected schema when clicked again', waitForAsync(() => {
-      spyOn(registryService, 'getActiveMetadataSchema').and.returnValue(observableOf(mockSchemasList[0] as MetadataSchema));
+      comp.activeMetadataSchema$ = observableOf(mockSchemasList[0] as MetadataSchema);
       spyOn(registryService, 'cancelEditMetadataSchema');
       row.click();
       fixture.detectChanges();
@@ -138,7 +126,7 @@ describe('MetadataRegistryComponent', () => {
 
     beforeEach(() => {
       spyOn(registryService, 'deleteMetadataSchema').and.callThrough();
-      spyOn(registryService, 'getSelectedMetadataSchemas').and.returnValue(observableOf(selectedSchemas as MetadataSchema[]));
+      comp.selectedMetadataSchemaIDs$ = observableOf(selectedSchemas.map((selectedSchema: MetadataSchema) => selectedSchema.id));
       comp.deleteSchemas();
       fixture.detectChanges();
     });
diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.ts b/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.ts
index 857034604e9..dbeb2b4f52a 100644
--- a/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.ts
+++ b/src/app/admin/admin-registries/metadata-registry/metadata-registry.component.ts
@@ -1,13 +1,11 @@
-import { Component } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
 import { RegistryService } from '../../../core/registry/registry.service';
-import { BehaviorSubject, combineLatest as observableCombineLatest, Observable, zip } from 'rxjs';
+import { BehaviorSubject, Observable, zip, Subscription } from 'rxjs';
 import { RemoteData } from '../../../core/data/remote-data';
 import { PaginatedList } from '../../../core/data/paginated-list.model';
 import { PaginationComponentOptions } from '../../../shared/pagination/pagination-component-options.model';
 import { filter, map, switchMap, take } from 'rxjs/operators';
-import { hasValue } from '../../../shared/empty.util';
 import { NotificationsService } from '../../../shared/notifications/notifications.service';
-import { Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
 import { MetadataSchema } from '../../../core/metadata/metadata-schema.model';
 import { toFindListOptions } from '../../../shared/pagination/pagination.utils';
@@ -24,13 +22,23 @@ import { PaginationService } from '../../../core/pagination/pagination.service';
  * A component used for managing all existing metadata schemas within the repository.
  * The admin can create, edit or delete metadata schemas here.
  */
-export class MetadataRegistryComponent {
+export class MetadataRegistryComponent implements OnDestroy, OnInit {
 
   /**
    * A list of all the current metadata schemas within the repository
    */
   metadataSchemas: Observable<RemoteData<PaginatedList<MetadataSchema>>>;
 
+  /**
+   * The {@link MetadataSchema}that is being edited
+   */
+  activeMetadataSchema$: Observable<MetadataSchema>;
+
+  /**
+   * The selected {@link MetadataSchema} IDs
+   */
+  selectedMetadataSchemaIDs$: Observable<number[]>;
+
   /**
    * Pagination config used to display the list of metadata schemas
    */
@@ -40,15 +48,25 @@ export class MetadataRegistryComponent {
   });
 
   /**
-   * Whether or not the list of MetadataSchemas needs an update
+   * Whether the list of MetadataSchemas needs an update
    */
   needsUpdate$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(true);
 
-  constructor(private registryService: RegistryService,
-              private notificationsService: NotificationsService,
-              private router: Router,
-              private paginationService: PaginationService,
-              private translateService: TranslateService) {
+  subscriptions: Subscription[] = [];
+
+  constructor(
+    protected registryService: RegistryService,
+    protected notificationsService: NotificationsService,
+    protected paginationService: PaginationService,
+    protected translateService: TranslateService,
+  ) {
+  }
+
+  ngOnInit(): void {
+    this.activeMetadataSchema$ = this.registryService.getActiveMetadataSchema();
+    this.selectedMetadataSchemaIDs$ = this.registryService.getSelectedMetadataSchemas().pipe(
+      map((schemas: MetadataSchema[]) => schemas.map((schema: MetadataSchema) => schema.id)),
+    );
     this.updateSchemas();
   }
 
@@ -77,30 +95,13 @@ export class MetadataRegistryComponent {
    * @param schema
    */
   editSchema(schema: MetadataSchema) {
-    this.getActiveSchema().pipe(take(1)).subscribe((activeSchema) => {
+    this.subscriptions.push(this.activeMetadataSchema$.pipe(take(1)).subscribe((activeSchema: MetadataSchema) => {
       if (schema === activeSchema) {
         this.registryService.cancelEditMetadataSchema();
       } else {
         this.registryService.editMetadataSchema(schema);
       }
-    });
-  }
-
-  /**
-   * Checks whether the given metadata schema is active (being edited)
-   * @param schema
-   */
-  isActive(schema: MetadataSchema): Observable<boolean> {
-    return this.getActiveSchema().pipe(
-      map((activeSchema) => schema === activeSchema)
-    );
-  }
-
-  /**
-   * Gets the active metadata schema (being edited)
-   */
-  getActiveSchema(): Observable<MetadataSchema> {
-    return this.registryService.getActiveMetadataSchema();
+    }));
   }
 
   /**
@@ -114,42 +115,25 @@ export class MetadataRegistryComponent {
       this.registryService.deselectMetadataSchema(schema);
   }
 
-  /**
-   * Checks whether a given metadata schema is selected in the list (checkbox)
-   * @param schema
-   */
-  isSelected(schema: MetadataSchema): Observable<boolean> {
-    return this.registryService.getSelectedMetadataSchemas().pipe(
-      map((schemas) => schemas.find((selectedSchema) => selectedSchema === schema) != null)
-    );
-  }
-
   /**
    * Delete all the selected metadata schemas
    */
   deleteSchemas() {
-    this.registryService.getSelectedMetadataSchemas().pipe(take(1)).subscribe(
-      (schemas) => {
-        const tasks$ = [];
-        for (const schema of schemas) {
-          if (hasValue(schema.id)) {
-            tasks$.push(this.registryService.deleteMetadataSchema(schema.id).pipe(getFirstCompletedRemoteData()));
-          }
-        }
-        zip(...tasks$).subscribe((responses: RemoteData<NoContent>[]) => {
-          const successResponses = responses.filter((response: RemoteData<NoContent>) => response.hasSucceeded);
-          const failedResponses = responses.filter((response: RemoteData<NoContent>) => response.hasFailed);
-          if (successResponses.length > 0) {
-            this.showNotification(true, successResponses.length);
-          }
-          if (failedResponses.length > 0) {
-            this.showNotification(false, failedResponses.length);
-          }
-          this.registryService.deselectAllMetadataSchema();
-          this.registryService.cancelEditMetadataSchema();
-        });
+    this.subscriptions.push(this.selectedMetadataSchemaIDs$.pipe(
+      take(1),
+      switchMap((schemaIDs: number[]) => zip(schemaIDs.map((schemaID: number) => this.registryService.deleteMetadataSchema(schemaID).pipe(getFirstCompletedRemoteData())))),
+    ).subscribe((responses: RemoteData<NoContent>[]) => {
+      const successResponses: RemoteData<NoContent>[] = responses.filter((response: RemoteData<NoContent>) => response.hasSucceeded);
+      const failedResponses: RemoteData<NoContent>[] = responses.filter((response: RemoteData<NoContent>) => response.hasFailed);
+      if (successResponses.length > 0) {
+        this.showNotification(true, successResponses.length);
       }
-    );
+      if (failedResponses.length > 0) {
+        this.showNotification(false, failedResponses.length);
+      }
+      this.registryService.deselectAllMetadataSchema();
+      this.registryService.cancelEditMetadataSchema();
+    }));
   }
 
   /**
@@ -160,20 +144,20 @@ export class MetadataRegistryComponent {
   showNotification(success: boolean, amount: number) {
     const prefix = 'admin.registries.schema.notification';
     const suffix = success ? 'success' : 'failure';
-    const messages = observableCombineLatest(
-      this.translateService.get(success ? `${prefix}.${suffix}` : `${prefix}.${suffix}`),
-      this.translateService.get(`${prefix}.deleted.${suffix}`, {amount: amount})
-    );
-    messages.subscribe(([head, content]) => {
-      if (success) {
-        this.notificationsService.success(head, content);
-      } else {
-        this.notificationsService.error(head, content);
-      }
-    });
+
+    const head: string = this.translateService.instant(success ? `${prefix}.${suffix}` : `${prefix}.${suffix}`);
+    const content: string = this.translateService.instant(`${prefix}.deleted.${suffix}`, {amount: amount});
+
+    if (success) {
+      this.notificationsService.success(head, content);
+    } else {
+      this.notificationsService.error(head, content);
+    }
   }
+
   ngOnDestroy(): void {
     this.paginationService.clearPagination(this.config.id);
+    this.subscriptions.map((subscription: Subscription) => subscription.unsubscribe());
   }
 
 }
diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.html b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.html
index a4a4613565e..521fb06a6e0 100644
--- a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.html
+++ b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.html
@@ -1,4 +1,4 @@
-<div *ngIf="registryService.getActiveMetadataSchema() | async; then editheader; else createHeader"></div>
+<div *ngIf="activeMetadataSchema$ | async; then editheader; else createHeader"></div>
 
 <ng-template #createHeader>
     <h4>{{messagePrefix + '.create' | translate}}</h4>
diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.spec.ts b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.spec.ts
index b758767ddbe..442a06dc672 100644
--- a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.spec.ts
+++ b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.spec.ts
@@ -1,6 +1,6 @@
 import { ComponentFixture, inject, TestBed, waitForAsync } from '@angular/core/testing';
 import { MetadataSchemaFormComponent } from './metadata-schema-form.component';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { RouterTestingModule } from '@angular/router/testing';
 import { TranslateModule } from '@ngx-translate/core';
@@ -10,41 +10,26 @@ import { RegistryService } from '../../../../core/registry/registry.service';
 import { FormBuilderService } from '../../../../shared/form/builder/form-builder.service';
 import { of as observableOf } from 'rxjs';
 import { MetadataSchema } from '../../../../core/metadata/metadata-schema.model';
+import { RegistryServiceStub } from '../../../../shared/testing/registry.service.stub';
+import { getMockFormBuilderService } from '../../../../shared/mocks/form-builder-service.mock';
 
 describe('MetadataSchemaFormComponent', () => {
   let component: MetadataSchemaFormComponent;
   let fixture: ComponentFixture<MetadataSchemaFormComponent>;
-  let registryService: RegistryService;
 
-  /* eslint-disable no-empty,@typescript-eslint/no-empty-function */
-  const registryServiceStub = {
-    getActiveMetadataSchema: () => observableOf(undefined),
-    createOrUpdateMetadataSchema: (schema: MetadataSchema) => observableOf(schema),
-    cancelEditMetadataSchema: () => {
-    },
-    clearMetadataSchemaRequests: () => observableOf(undefined)
-  };
-  const formBuilderServiceStub = {
-    createFormGroup: () => {
-      return {
-        patchValue: () => {
-        },
-        reset(_value?: any, _options?: { onlySelf?: boolean; emitEvent?: boolean; }): void {
-        },
-      };
-    }
-  };
-  /* eslint-enable no-empty, @typescript-eslint/no-empty-function */
+  let registryService: RegistryServiceStub;
 
   beforeEach(waitForAsync(() => {
+    registryService = new RegistryServiceStub();
+
     return TestBed.configureTestingModule({
       imports: [CommonModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), NgbModule],
       declarations: [MetadataSchemaFormComponent, EnumKeysPipe],
       providers: [
-        { provide: RegistryService, useValue: registryServiceStub },
-        { provide: FormBuilderService, useValue: formBuilderServiceStub }
+        { provide: RegistryService, useValue: registryService },
+        { provide: FormBuilderService, useValue: getMockFormBuilderService() }
       ],
-      schemas: [NO_ERRORS_SCHEMA]
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();
   }));
 
@@ -75,7 +60,7 @@ describe('MetadataSchemaFormComponent', () => {
 
     describe('without an active schema', () => {
       beforeEach(() => {
-        spyOn(registryService, 'getActiveMetadataSchema').and.returnValue(observableOf(undefined));
+        component.activeMetadataSchema$ = observableOf(undefined);
         component.onSubmit();
         fixture.detectChanges();
       });
@@ -94,7 +79,7 @@ describe('MetadataSchemaFormComponent', () => {
       } as MetadataSchema);
 
       beforeEach(() => {
-        spyOn(registryService, 'getActiveMetadataSchema').and.returnValue(observableOf(expectedWithId));
+        component.activeMetadataSchema$ = observableOf(expectedWithId);
         component.onSubmit();
         fixture.detectChanges();
       });
diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts
index 1992289ff77..78680f6d9a6 100644
--- a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts
+++ b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts
@@ -8,10 +8,10 @@ import {
 import { UntypedFormGroup } from '@angular/forms';
 import { RegistryService } from '../../../../core/registry/registry.service';
 import { FormBuilderService } from '../../../../shared/form/builder/form-builder.service';
-import { take } from 'rxjs/operators';
+import { take, switchMap } from 'rxjs/operators';
 import { TranslateService } from '@ngx-translate/core';
-import { combineLatest } from 'rxjs';
 import { MetadataSchema } from '../../../../core/metadata/metadata-schema.model';
+import { Subscription, Observable } from 'rxjs';
 
 @Component({
   selector: 'ds-metadata-schema-form',
@@ -73,64 +73,71 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy {
    */
   @Output() submitForm: EventEmitter<any> = new EventEmitter();
 
-  constructor(public registryService: RegistryService, private formBuilderService: FormBuilderService, private translateService: TranslateService) {
+  /**
+   * The {@link MetadataSchema} that is currently being edited
+   */
+  activeMetadataSchema$: Observable<MetadataSchema>;
+
+  subscriptions: Subscription[] = [];
+
+  constructor(
+    protected registryService: RegistryService,
+    protected formBuilderService: FormBuilderService,
+    protected translateService: TranslateService,
+  ) {
   }
 
   ngOnInit() {
-    combineLatest([
-      this.translateService.get(`${this.messagePrefix}.name`),
-      this.translateService.get(`${this.messagePrefix}.namespace`)
-    ]).subscribe(([name, namespace]) => {
-      this.name = new DynamicInputModel({
-          id: 'name',
-          label: name,
-          name: 'name',
-          validators: {
-            required: null,
-            pattern: '^[^. ,]*$',
-            maxLength: 32,
-          },
-          required: true,
-          errorMessages: {
-            pattern: 'error.validation.metadata.name.invalid-pattern',
-            maxLength: 'error.validation.metadata.name.max-length',
-          },
-        });
-      this.namespace = new DynamicInputModel({
-          id: 'namespace',
-          label: namespace,
-          name: 'namespace',
-          validators: {
-            required: null,
-            maxLength: 256,
-          },
-          required: true,
-          errorMessages: {
-            maxLength: 'error.validation.metadata.namespace.max-length',
+    this.name = new DynamicInputModel({
+        id: 'name',
+        label: this.translateService.instant(`${this.messagePrefix}.name`),
+        name: 'name',
+        validators: {
+          required: null,
+          pattern: '^[^. ,]*$',
+          maxLength: 32,
+        },
+        required: true,
+        errorMessages: {
+          pattern: 'error.validation.metadata.name.invalid-pattern',
+          maxLength: 'error.validation.metadata.name.max-length',
+        },
+      });
+    this.namespace = new DynamicInputModel({
+        id: 'namespace',
+        label: this.translateService.instant(`${this.messagePrefix}.namespace`),
+        name: 'namespace',
+        validators: {
+          required: null,
+          maxLength: 256,
+        },
+        required: true,
+        errorMessages: {
+          maxLength: 'error.validation.metadata.namespace.max-length',
+        },
+      });
+    this.formModel = [
+      new DynamicFormGroupModel(
+        {
+          id: 'metadatadataschemagroup',
+          group:[this.namespace, this.name]
+        })
+    ];
+    this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
+    this.activeMetadataSchema$ = this.registryService.getActiveMetadataSchema();
+    this.subscriptions.push(this.activeMetadataSchema$.subscribe((schema: MetadataSchema) => {
+      if (schema == null) {
+        this.clearFields();
+      } else {
+        this.formGroup.patchValue({
+          metadatadataschemagroup: {
+            name: schema.prefix,
+            namespace: schema.namespace,
           },
         });
-      this.formModel = [
-        new DynamicFormGroupModel(
-          {
-            id: 'metadatadataschemagroup',
-            group:[this.namespace, this.name]
-          })
-      ];
-      this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
-      this.registryService.getActiveMetadataSchema().subscribe((schema: MetadataSchema) => {
-        if (schema == null) {
-          this.clearFields();
-        } else {
-          this.formGroup.patchValue({
-            metadatadataschemagroup: {
-              name: schema.prefix,
-              namespace: schema.namespace,
-            },
-          });
-          this.name.disabled = true;
-        }
-      });
-    });
+        this.name.disabled = true;
+      }
+    }));
   }
 
   /**
@@ -148,29 +155,28 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy {
    */
   onSubmit(): void {
     this.registryService.clearMetadataSchemaRequests().subscribe();
-    this.registryService.getActiveMetadataSchema().pipe(take(1)).subscribe(
-      (schema: MetadataSchema) => {
+    this.subscriptions.push(this.activeMetadataSchema$.pipe(
+      take(1),
+      switchMap((schema: MetadataSchema) => {
         const values = {
           prefix: this.name.value,
           namespace: this.namespace.value
         };
         if (schema == null) {
-          this.registryService.createOrUpdateMetadataSchema(Object.assign(new MetadataSchema(), values)).subscribe((newSchema) => {
-            this.submitForm.emit(newSchema);
-          });
+          return this.registryService.createOrUpdateMetadataSchema(Object.assign(new MetadataSchema(), values));
         } else {
-          this.registryService.createOrUpdateMetadataSchema(Object.assign(new MetadataSchema(), schema, {
+          return this.registryService.createOrUpdateMetadataSchema(Object.assign(new MetadataSchema(), schema, {
             id: schema.id,
             prefix: schema.prefix,
             namespace: values.namespace,
-          })).subscribe((updatedSchema: MetadataSchema) => {
-            this.submitForm.emit(updatedSchema);
-          });
+          }));
         }
-        this.clearFields();
-        this.registryService.cancelEditMetadataSchema();
-      }
-    );
+      }),
+    ).subscribe((schema: MetadataSchema) => {
+      this.clearFields();
+      this.registryService.cancelEditMetadataSchema();
+      this.submitForm.emit(schema);
+    }));
   }
 
   /**
@@ -186,5 +192,6 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy {
    */
   ngOnDestroy(): void {
     this.onCancel();
+    this.subscriptions.forEach((subscription: Subscription) => subscription.unsubscribe());
   }
 }
diff --git a/src/app/shared/testing/registry.service.stub.ts b/src/app/shared/testing/registry.service.stub.ts
new file mode 100644
index 00000000000..de5e4f933f9
--- /dev/null
+++ b/src/app/shared/testing/registry.service.stub.ts
@@ -0,0 +1,107 @@
+/* eslint-disable no-empty,@typescript-eslint/no-empty-function */
+import { FindListOptions } from '../../core/data/find-list-options.model';
+import { FollowLinkConfig } from '../utils/follow-link-config.model';
+import { MetadataSchema } from '../../core/metadata/metadata-schema.model';
+import { Observable, of as observableOf } from 'rxjs';
+import { RemoteData } from '../../core/data/remote-data';
+import { PaginatedList } from '../../core/data/paginated-list.model';
+import { createSuccessfulRemoteDataObject$ } from '../remote-data.utils';
+import { createPaginatedList } from './utils.test';
+import { MetadataField } from '../../core/metadata/metadata-field.model';
+import { NoContent } from '../../core/shared/NoContent.model';
+
+/**
+ * Stub class of {@link RegistryService}
+ */
+export class RegistryServiceStub {
+
+  getMetadataSchemas(_options: FindListOptions = {}, _useCachedVersionIfAvailable = true, _reRequestOnStale = true, ..._linksToFollow: FollowLinkConfig<MetadataSchema>[]): Observable<RemoteData<PaginatedList<MetadataSchema>>> {
+    return createSuccessfulRemoteDataObject$(createPaginatedList());
+  }
+
+  getMetadataSchemaByPrefix(_prefix: string, _useCachedVersionIfAvailable = true, _reRequestOnStale = true, ..._linksToFollow: FollowLinkConfig<MetadataSchema>[]): Observable<RemoteData<MetadataSchema>> {
+    return createSuccessfulRemoteDataObject$(undefined);
+  }
+
+  getMetadataFieldsBySchema(_schema: MetadataSchema, _options: FindListOptions = {}, _useCachedVersionIfAvailable = true, _reRequestOnStale = true, ..._linksToFollow: FollowLinkConfig<MetadataField>[]): Observable<RemoteData<PaginatedList<MetadataField>>> {
+    return createSuccessfulRemoteDataObject$(createPaginatedList());
+  }
+
+  editMetadataSchema(_schema: MetadataSchema): void {
+  }
+
+  cancelEditMetadataSchema(): void {
+  }
+
+  getActiveMetadataSchema(): Observable<MetadataSchema> {
+    return observableOf(undefined);
+  }
+
+  selectMetadataSchema(_schema: MetadataSchema): void {
+  }
+
+  deselectMetadataSchema(_schema: MetadataSchema): void {
+  }
+
+  deselectAllMetadataSchema(): void {
+  }
+
+  getSelectedMetadataSchemas(): Observable<MetadataSchema[]> {
+    return observableOf([]);
+  }
+
+  editMetadataField(_field: MetadataField): void {
+  }
+
+  cancelEditMetadataField(): void {
+  }
+
+  getActiveMetadataField(): Observable<MetadataField> {
+    return observableOf(undefined);
+  }
+
+  selectMetadataField(_field: MetadataField): void {
+  }
+
+  deselectMetadataField(_field: MetadataField): void {
+  }
+
+  deselectAllMetadataField(): void {
+  }
+
+  getSelectedMetadataFields(): Observable<MetadataField[]> {
+    return observableOf([]);
+  }
+
+  createOrUpdateMetadataSchema(schema: MetadataSchema): Observable<MetadataSchema> {
+    return observableOf(schema);
+  }
+
+  deleteMetadataSchema(_id: number): Observable<RemoteData<NoContent>> {
+    return createSuccessfulRemoteDataObject$(undefined);
+  }
+
+  clearMetadataSchemaRequests(): Observable<string> {
+    return observableOf('');
+  }
+
+  createMetadataField(_field: MetadataField, _schema: MetadataSchema): Observable<MetadataField> {
+    return observableOf(undefined);
+  }
+
+  updateMetadataField(_field: MetadataField): Observable<MetadataField> {
+    return observableOf(undefined);
+  }
+
+  deleteMetadataField(_id: number): Observable<RemoteData<NoContent>> {
+    return createSuccessfulRemoteDataObject$(undefined);
+  }
+
+  clearMetadataFieldRequests(): void {
+  }
+
+  queryMetadataFields(_query: string, _options: FindListOptions = {}, _useCachedVersionIfAvailable = true, _reRequestOnStale = true, ..._linksToFollow: FollowLinkConfig<MetadataField>[]): Observable<RemoteData<PaginatedList<MetadataField>>> {
+    return createSuccessfulRemoteDataObject$(createPaginatedList());
+  }
+
+}

From f03ed89687e12fa849e73b336e95fb2ab2996033 Mon Sep 17 00:00:00 2001
From: Alexandre Vryghem <alexandre@atmire.com>
Date: Thu, 5 Sep 2024 11:49:18 +0200
Subject: [PATCH 6/6] 117287: Removed method calls returning observables from
 the metadata schema registry

---
 .../metadata-field-form.component.spec.ts     |  38 ++---
 .../metadata-schema.component.html            |   4 +-
 .../metadata-schema.component.spec.ts         |  65 ++++----
 .../metadata-schema.component.ts              | 139 +++++++-----------
 .../shared/testing/registry.service.stub.ts   |   8 +-
 5 files changed, 95 insertions(+), 159 deletions(-)

diff --git a/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.spec.ts b/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.spec.ts
index ad7b54945dd..7ae672f9e13 100644
--- a/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.spec.ts
+++ b/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.spec.ts
@@ -9,14 +9,17 @@ import { TranslateModule } from '@ngx-translate/core';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 import { EnumKeysPipe } from '../../../../shared/utils/enum-keys-pipe';
 import { FormBuilderService } from '../../../../shared/form/builder/form-builder.service';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { MetadataField } from '../../../../core/metadata/metadata-field.model';
 import { MetadataSchema } from '../../../../core/metadata/metadata-schema.model';
+import { getMockFormBuilderService } from '../../../../shared/mocks/form-builder-service.mock';
+import { RegistryServiceStub } from '../../../../shared/testing/registry.service.stub';
 
 describe('MetadataFieldFormComponent', () => {
   let component: MetadataFieldFormComponent;
   let fixture: ComponentFixture<MetadataFieldFormComponent>;
-  let registryService: RegistryService;
+
+  let registryService: RegistryServiceStub;
 
   const metadataSchema = Object.assign(new MetadataSchema(), {
     id: 1,
@@ -24,38 +27,17 @@ describe('MetadataFieldFormComponent', () => {
     prefix: 'fake'
   });
 
-  /* eslint-disable no-empty,@typescript-eslint/no-empty-function */
-  const registryServiceStub = {
-    getActiveMetadataField: () => observableOf(undefined),
-    createMetadataField: (field: MetadataField) => observableOf(field),
-    updateMetadataField: (field: MetadataField) => observableOf(field),
-    cancelEditMetadataField: () => {
-    },
-    cancelEditMetadataSchema: () => {
-    },
-    clearMetadataFieldRequests: () => observableOf(undefined)
-  };
-  const formBuilderServiceStub = {
-    createFormGroup: () => {
-      return {
-        patchValue: () => {
-        },
-        reset(_value?: any, _options?: { onlySelf?: boolean; emitEvent?: boolean; }): void {
-        },
-      };
-    }
-  };
-  /* eslint-enable no-empty, @typescript-eslint/no-empty-function */
-
   beforeEach(waitForAsync(() => {
+    registryService = new RegistryServiceStub();
+
     return TestBed.configureTestingModule({
       imports: [CommonModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), NgbModule],
       declarations: [MetadataFieldFormComponent, EnumKeysPipe],
       providers: [
-        { provide: RegistryService, useValue: registryServiceStub },
-        { provide: FormBuilderService, useValue: formBuilderServiceStub }
+        { provide: RegistryService, useValue: registryService },
+        { provide: FormBuilderService, useValue: getMockFormBuilderService() }
       ],
-      schemas: [NO_ERRORS_SCHEMA]
+      schemas: [CUSTOM_ELEMENTS_SCHEMA]
     }).compileComponents();
   }));
 
diff --git a/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.html b/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.html
index 557741df80c..6d895d187ba 100644
--- a/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.html
+++ b/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.html
@@ -32,11 +32,11 @@ <h3>{{'admin.registries.schema.fields.head' | translate}}</h3>
               </thead>
               <tbody>
               <tr *ngFor="let field of fields?.page"
-                  [ngClass]="{'table-primary' : isActive(field) | async}">
+                  [ngClass]="{'table-primary' : (activeField$ | async)?.id === field.id}">
                 <td>
                   <label class="mb-0">
                     <input type="checkbox"
-                           [checked]="isSelected(field) | async"
+                           [checked]="(selectedMetadataFieldIDs$ | async)?.includes(field.id)"
                            (change)="selectMetadataField(field, $event)">
                   </label>
                 </td>
diff --git a/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.spec.ts b/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.spec.ts
index 2b660a63634..ce4987a02cf 100644
--- a/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.spec.ts
+++ b/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.spec.ts
@@ -4,7 +4,7 @@ import { of as observableOf } from 'rxjs';
 import { buildPaginatedList } from '../../../core/data/paginated-list.model';
 import { TranslateModule } from '@ngx-translate/core';
 import { CommonModule } from '@angular/common';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { By } from '@angular/platform-browser';
 import { RegistryService } from '../../../core/registry/registry.service';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
@@ -12,25 +12,28 @@ import { EnumKeysPipe } from '../../../shared/utils/enum-keys-pipe';
 import { PaginationComponent } from '../../../shared/pagination/pagination.component';
 import { HostWindowServiceStub } from '../../../shared/testing/host-window-service.stub';
 import { HostWindowService } from '../../../shared/host-window.service';
-import { RouterStub } from '../../../shared/testing/router.stub';
 import { RouterTestingModule } from '@angular/router/testing';
 import { ActivatedRouteStub } from '../../../shared/testing/active-router.stub';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { NotificationsService } from '../../../shared/notifications/notifications.service';
 import { NotificationsServiceStub } from '../../../shared/testing/notifications-service.stub';
-import { RestResponse } from '../../../core/cache/response.models';
 import { MetadataSchema } from '../../../core/metadata/metadata-schema.model';
 import { MetadataField } from '../../../core/metadata/metadata-field.model';
 import { createSuccessfulRemoteDataObject$ } from '../../../shared/remote-data.utils';
 import { VarDirective } from '../../../shared/utils/var.directive';
 import { PaginationService } from '../../../core/pagination/pagination.service';
 import { PaginationServiceStub } from '../../../shared/testing/pagination-service.stub';
+import { RegistryServiceStub } from '../../../shared/testing/registry.service.stub';
 
 describe('MetadataSchemaComponent', () => {
   let comp: MetadataSchemaComponent;
   let fixture: ComponentFixture<MetadataSchemaComponent>;
-  let registryService: RegistryService;
-  const mockSchemasList = [
+
+  let registryService: RegistryServiceStub;
+  let activatedRoute: ActivatedRouteStub;
+  let paginationService: PaginationServiceStub;
+
+  const mockSchemasList: MetadataSchema[] = [
     {
       id: 1,
       _links: {
@@ -51,8 +54,8 @@ describe('MetadataSchemaComponent', () => {
       prefix: 'mock',
       namespace: 'http://dspace.org/mockschema'
     }
-  ];
-  const mockFieldsList = [
+  ] as MetadataSchema[];
+  const mockFieldsList: MetadataField[] = [
     {
       id: 1,
       _links: {
@@ -101,47 +104,29 @@ describe('MetadataSchemaComponent', () => {
       scopeNote: null,
       schema: createSuccessfulRemoteDataObject$(mockSchemasList[1])
     }
-  ];
-  const mockSchemas = createSuccessfulRemoteDataObject$(buildPaginatedList(null, mockSchemasList));
-  /* eslint-disable no-empty,@typescript-eslint/no-empty-function */
-  const registryServiceStub = {
-    getMetadataSchemas: () => mockSchemas,
-    getMetadataFieldsBySchema: (schema: MetadataSchema) => createSuccessfulRemoteDataObject$(buildPaginatedList(null, mockFieldsList.filter((value) => value.id === 3 || value.id === 4))),
-    getMetadataSchemaByPrefix: (schemaName: string) => createSuccessfulRemoteDataObject$(mockSchemasList.filter((value) => value.prefix === schemaName)[0]),
-    getActiveMetadataField: () => observableOf(undefined),
-    getSelectedMetadataFields: () => observableOf([]),
-    editMetadataField: (schema) => {
-    },
-    cancelEditMetadataField: () => {
-    },
-    deleteMetadataField: () => observableOf(new RestResponse(true, 200, 'OK')),
-    deselectAllMetadataField: () => {
-    },
-    clearMetadataFieldRequests: () => observableOf(undefined)
-  };
-  /* eslint-enable no-empty, @typescript-eslint/no-empty-function */
+  ] as MetadataField[];
   const schemaNameParam = 'mock';
-  const activatedRouteStub = Object.assign(new ActivatedRouteStub(), {
-    params: observableOf({
-      schemaName: schemaNameParam
-    })
-  });
-
-  const paginationService = new PaginationServiceStub();
 
   beforeEach(waitForAsync(() => {
+    activatedRoute = new ActivatedRouteStub({
+      schemaName: schemaNameParam,
+    });
+    paginationService = new PaginationServiceStub();
+    registryService = new RegistryServiceStub();
+    spyOn(registryService, 'getMetadataFieldsBySchema').and.returnValue(createSuccessfulRemoteDataObject$(buildPaginatedList(null, mockFieldsList.filter((value) => value.id === 3 || value.id === 4))));
+    spyOn(registryService, 'getMetadataSchemaByPrefix').and.callFake((schemaName) => createSuccessfulRemoteDataObject$(mockSchemasList.filter((value) => value.prefix === schemaName)[0]));
+
     TestBed.configureTestingModule({
       imports: [CommonModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), NgbModule],
       declarations: [MetadataSchemaComponent, PaginationComponent, EnumKeysPipe, VarDirective],
       providers: [
-        { provide: RegistryService, useValue: registryServiceStub },
-        { provide: ActivatedRoute, useValue: activatedRouteStub },
+        { provide: RegistryService, useValue: registryService },
+        { provide: ActivatedRoute, useValue: activatedRoute },
         { provide: HostWindowService, useValue: new HostWindowServiceStub(0) },
-        { provide: Router, useValue: new RouterStub() },
         { provide: PaginationService, useValue: paginationService },
         { provide: NotificationsService, useValue: new NotificationsServiceStub() }
       ],
-      schemas: [NO_ERRORS_SCHEMA]
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();
   }));
 
@@ -190,7 +175,7 @@ describe('MetadataSchemaComponent', () => {
     }));
 
     it('should cancel editing the selected field when clicked again', waitForAsync(() => {
-      spyOn(registryService, 'getActiveMetadataField').and.returnValue(observableOf(mockFieldsList[2] as MetadataField));
+      comp.activeField$ = observableOf(mockFieldsList[2] as MetadataField);
       spyOn(registryService, 'cancelEditMetadataField');
       row.click();
       fixture.detectChanges();
@@ -205,7 +190,7 @@ describe('MetadataSchemaComponent', () => {
 
     beforeEach(() => {
       spyOn(registryService, 'deleteMetadataField').and.callThrough();
-      spyOn(registryService, 'getSelectedMetadataFields').and.returnValue(observableOf(selectedFields as MetadataField[]));
+      comp.selectedMetadataFieldIDs$ = observableOf(selectedFields.map((metadataField: MetadataField) => metadataField.id));
       comp.deleteFields();
       fixture.detectChanges();
     });
diff --git a/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.ts b/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.ts
index d0827e6e4d5..1a5fd15ccdf 100644
--- a/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.ts
+++ b/src/app/admin/admin-registries/metadata-schema/metadata-schema.component.ts
@@ -1,19 +1,18 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
 import { RegistryService } from '../../../core/registry/registry.service';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import {
   BehaviorSubject,
-  combineLatest as observableCombineLatest,
   combineLatest,
   Observable,
   of as observableOf,
-  zip
+  zip,
+  Subscription,
 } from 'rxjs';
 import { RemoteData } from '../../../core/data/remote-data';
 import { PaginatedList } from '../../../core/data/paginated-list.model';
 import { PaginationComponentOptions } from '../../../shared/pagination/pagination-component-options.model';
 import { map, switchMap, take } from 'rxjs/operators';
-import { hasValue } from '../../../shared/empty.util';
 import { NotificationsService } from '../../../shared/notifications/notifications.service';
 import { TranslateService } from '@ngx-translate/core';
 import { MetadataField } from '../../../core/metadata/metadata-field.model';
@@ -32,7 +31,7 @@ import { PaginationService } from '../../../core/pagination/pagination.service';
  * A component used for managing all existing metadata fields within the current metadata schema.
  * The admin can create, edit or delete metadata fields here.
  */
-export class MetadataSchemaComponent implements OnInit {
+export class MetadataSchemaComponent implements OnDestroy, OnInit {
   /**
    * The metadata schema
    */
@@ -57,27 +56,33 @@ export class MetadataSchemaComponent implements OnInit {
    */
   needsUpdate$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(true);
 
-  constructor(private registryService: RegistryService,
-              private route: ActivatedRoute,
-              private notificationsService: NotificationsService,
-              private router: Router,
-              private paginationService: PaginationService,
-              private translateService: TranslateService) {
+  /**
+   * The current {@link MetadataField} that is being edited
+   */
+  activeField$: Observable<MetadataField>;
 
-  }
+  /**
+   * The selected {@link MetadataField} IDs
+   */
+  selectedMetadataFieldIDs$: Observable<number[]>;
 
-  ngOnInit(): void {
-    this.route.params.subscribe((params) => {
-      this.initialize(params);
-    });
+  subscriptions: Subscription[] = [];
+
+  constructor(
+    protected registryService: RegistryService,
+    protected route: ActivatedRoute,
+    protected notificationsService: NotificationsService,
+    protected paginationService: PaginationService,
+    protected translateService: TranslateService,
+  ) {
   }
 
-  /**
-   * Initialize the component using the params within the url (schemaName)
-   * @param params
-   */
-  initialize(params) {
-    this.metadataSchema$ = this.registryService.getMetadataSchemaByPrefix(params.schemaName).pipe(getFirstSucceededRemoteDataPayload());
+  ngOnInit(): void {
+    this.metadataSchema$ = this.registryService.getMetadataSchemaByPrefix(this.route.snapshot.params.schemaName).pipe(getFirstSucceededRemoteDataPayload());
+    this.activeField$ = this.registryService.getActiveMetadataField();
+    this.selectedMetadataFieldIDs$ = this.registryService.getSelectedMetadataFields().pipe(
+      map((metadataFields: MetadataField[]) => metadataFields.map((metadataField: MetadataField) => metadataField.id)),
+    );
     this.updateFields();
   }
 
@@ -86,7 +91,7 @@ export class MetadataSchemaComponent implements OnInit {
    */
   private updateFields() {
     this.metadataFields$ = this.paginationService.getCurrentPagination(this.config.id, this.config).pipe(
-      switchMap((currentPagination) => combineLatest(this.metadataSchema$, this.needsUpdate$, observableOf(currentPagination))),
+      switchMap((currentPagination) => combineLatest([this.metadataSchema$, this.needsUpdate$, observableOf(currentPagination)])),
       switchMap(([schema, update, currentPagination]: [MetadataSchema, boolean, PaginationComponentOptions]) => {
         if (update) {
           this.needsUpdate$.next(false);
@@ -110,30 +115,13 @@ export class MetadataSchemaComponent implements OnInit {
    * @param field
    */
   editField(field: MetadataField) {
-    this.getActiveField().pipe(take(1)).subscribe((activeField) => {
+    this.subscriptions.push(this.activeField$.pipe(take(1)).subscribe((activeField) => {
       if (field === activeField) {
         this.registryService.cancelEditMetadataField();
       } else {
         this.registryService.editMetadataField(field);
       }
-    });
-  }
-
-  /**
-   * Checks whether the given metadata field is active (being edited)
-   * @param field
-   */
-  isActive(field: MetadataField): Observable<boolean> {
-    return this.getActiveField().pipe(
-      map((activeField) => field === activeField)
-    );
-  }
-
-  /**
-   * Gets the active metadata field (being edited)
-   */
-  getActiveField(): Observable<MetadataField> {
-    return this.registryService.getActiveMetadataField();
+    }));
   }
 
   /**
@@ -147,42 +135,25 @@ export class MetadataSchemaComponent implements OnInit {
       this.registryService.deselectMetadataField(field);
   }
 
-  /**
-   * Checks whether a given metadata field is selected in the list (checkbox)
-   * @param field
-   */
-  isSelected(field: MetadataField): Observable<boolean> {
-    return this.registryService.getSelectedMetadataFields().pipe(
-      map((fields) => fields.find((selectedField) => selectedField === field) != null)
-    );
-  }
-
   /**
    * Delete all the selected metadata fields
    */
   deleteFields() {
-    this.registryService.getSelectedMetadataFields().pipe(take(1)).subscribe(
-      (fields) => {
-        const tasks$ = [];
-        for (const field of fields) {
-          if (hasValue(field.id)) {
-            tasks$.push(this.registryService.deleteMetadataField(field.id).pipe(getFirstCompletedRemoteData()));
-          }
-        }
-        zip(...tasks$).subscribe((responses: RemoteData<NoContent>[]) => {
-          const successResponses = responses.filter((response: RemoteData<NoContent>) => response.hasSucceeded);
-          const failedResponses = responses.filter((response: RemoteData<NoContent>) => response.hasFailed);
-          if (successResponses.length > 0) {
-            this.showNotification(true, successResponses.length);
-          }
-          if (failedResponses.length > 0) {
-            this.showNotification(false, failedResponses.length);
-          }
-          this.registryService.deselectAllMetadataField();
-          this.registryService.cancelEditMetadataField();
-        });
+    this.subscriptions.push(this.selectedMetadataFieldIDs$.pipe(
+      take(1),
+      switchMap((fieldIDs) => zip(fieldIDs.map((fieldID) => this.registryService.deleteMetadataField(fieldID).pipe(getFirstCompletedRemoteData())))),
+    ).subscribe((responses: RemoteData<NoContent>[]) => {
+      const successResponses = responses.filter((response: RemoteData<NoContent>) => response.hasSucceeded);
+      const failedResponses = responses.filter((response: RemoteData<NoContent>) => response.hasFailed);
+      if (successResponses.length > 0) {
+        this.showNotification(true, successResponses.length);
       }
-    );
+      if (failedResponses.length > 0) {
+        this.showNotification(false, failedResponses.length);
+      }
+      this.registryService.deselectAllMetadataField();
+      this.registryService.cancelEditMetadataField();
+    }));
   }
 
   /**
@@ -193,20 +164,18 @@ export class MetadataSchemaComponent implements OnInit {
   showNotification(success: boolean, amount: number) {
     const prefix = 'admin.registries.schema.notification';
     const suffix = success ? 'success' : 'failure';
-    const messages = observableCombineLatest(
-      this.translateService.get(success ? `${prefix}.${suffix}` : `${prefix}.${suffix}`),
-      this.translateService.get(`${prefix}.field.deleted.${suffix}`, { amount: amount })
-    );
-    messages.subscribe(([head, content]) => {
-      if (success) {
-        this.notificationsService.success(head, content);
-      } else {
-        this.notificationsService.error(head, content);
-      }
-    });
+    const head = this.translateService.instant(success ? `${prefix}.${suffix}` : `${prefix}.${suffix}`);
+    const content = this.translateService.instant(`${prefix}.field.deleted.${suffix}`, { amount: amount });
+    if (success) {
+      this.notificationsService.success(head, content);
+    } else {
+      this.notificationsService.error(head, content);
+    }
   }
+
   ngOnDestroy(): void {
     this.paginationService.clearPagination(this.config.id);
+    this.subscriptions.forEach((subscription: Subscription) => subscription.unsubscribe());
   }
 
 }
diff --git a/src/app/shared/testing/registry.service.stub.ts b/src/app/shared/testing/registry.service.stub.ts
index de5e4f933f9..b52f32af4e4 100644
--- a/src/app/shared/testing/registry.service.stub.ts
+++ b/src/app/shared/testing/registry.service.stub.ts
@@ -85,12 +85,12 @@ export class RegistryServiceStub {
     return observableOf('');
   }
 
-  createMetadataField(_field: MetadataField, _schema: MetadataSchema): Observable<MetadataField> {
-    return observableOf(undefined);
+  createMetadataField(field: MetadataField, _schema: MetadataSchema): Observable<MetadataField> {
+    return observableOf(field);
   }
 
-  updateMetadataField(_field: MetadataField): Observable<MetadataField> {
-    return observableOf(undefined);
+  updateMetadataField(field: MetadataField): Observable<MetadataField> {
+    return observableOf(field);
   }
 
   deleteMetadataField(_id: number): Observable<RemoteData<NoContent>> {