FIx issues from main alignment, remove leftover removed in Suggestion PR

src/app/admin/admin-ldn-services/ldn-service-form/ldn-service-form.component.html

@@ -1,7 +1,7 @@
 <div class="container">
   <form (ngSubmit)="onSubmit()" [formGroup]="formModel">
     <div class="d-flex">
-      <h2 class="flex-grow-1">{{ isNewService ? ('ldn-create-service.title' | translate) : ('ldn-edit-registered-service.title' | translate) }}</h2>
+      <h1 class="flex-grow-1">{{ isNewService ? ('ldn-create-service.title' | translate) : ('ldn-edit-registered-service.title' | translate) }}</h1>
     </div>
     <!-- In the toggle section -->
     <div class="toggle-switch-container" *ngIf="!isNewService">
@@ -139,7 +139,7 @@ <h2 class="flex-grow-1">{{ isNewService ? ('ldn-create-service.title' | translat
               <div #inboundPatternDropdown="ngbDropdown" class="w-80" display="dynamic"
                    id="additionalInboundPattern{{i}}"
                    ngbDropdown placement="top-start">
-                <div class="position-relative right-addon" role="combobox">
+                <div class="position-relative right-addon" role="combobox"  aria-expanded="false" aria-controls="inboundPatternDropdownButton">
                   <i aria-hidden="true" class="position-absolute scrollable-dropdown-toggle"
                      ngbDropdownToggle></i>
                   <input
@@ -151,6 +151,7 @@ <h2 class="flex-grow-1">{{ isNewService ? ('ldn-create-service.title' | translat
                     id="inboundPatternDropdownButton"
                     ngbDropdownAnchor
                     type="text"
+                    [attr.aria-label]="'ldn-service-input-inbound-pattern-dropdown' | translate"
                   />
                   <div aria-labelledby="inboundPatternDropdownButton"
                        class="dropdown-menu dropdown-menu-top w-100 "
@@ -175,7 +176,7 @@ <h2 class="flex-grow-1">{{ isNewService ? ('ldn-create-service.title' | translat
                 *ngIf="formModel.get('notifyServiceInboundPatterns')['controls'][i].value.pattern">
                 <div #inboundItemfilterDropdown="ngbDropdown" class="w-100" id="constraint{{i}}" ngbDropdown
                      placement="top-start">
-                  <div class="position-relative right-addon" role="combobox">
+                  <div class="position-relative right-addon" aria-expanded="false" aria-controls="inboundItemfilterDropdown" role="combobox">
                     <i aria-hidden="true" class="position-absolute scrollable-dropdown-toggle"
                        ngbDropdownToggle></i>
                     <input
@@ -187,6 +188,7 @@ <h2 class="flex-grow-1">{{ isNewService ? ('ldn-create-service.title' | translat
                       id="inboundItemfilterDropdown"
                       ngbDropdownAnchor
                       type="text"
+                      [attr.aria-label]="'ldn-service-input-inbound-item-filter-dropdown' | translate"
                     />
                     <div aria-labelledby="inboundItemfilterDropdownButton"
                          class="dropdown-menu scrollable-dropdown-menu w-100 "
@@ -226,13 +228,15 @@ <h2 class="flex-grow-1">{{ isNewService ? ('ldn-create-service.title' | translat
             <div class="col-sm-2">
               <div class="btn-group">
                 <button (click)="markForInboundPatternDeletion(i)" class="btn btn-outline-dark trash-button"
+                        [title]="'ldn-service-button-mark-inbound-deletion' | translate"
                         type="button">
                   <i class="fas fa-trash"></i>
                 </button>
 
 
                 <button (click)="unmarkForInboundPatternDeletion(i)"
                         *ngIf="markedForDeletionInboundPattern.includes(i)"
+                        [title]="'ldn-service-button-unmark-inbound-deletion' | translate"
                         class="btn btn-warning "
                         type="button">
                   <i class="fas fa-undo"></i>

src/app/admin/admin-ldn-services/ldn-service-form/ldn-service-form.component.spec.ts

@@ -1,9 +1,9 @@
-import {ComponentFixture, TestBed} from '@angular/core/testing';
+import { ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
 
 import {NgbDropdownModule, NgbModal} from '@ng-bootstrap/ng-bootstrap';
 import {LdnServiceFormComponent} from './ldn-service-form.component';
 import {ChangeDetectorRef, EventEmitter} from '@angular/core';
-import {FormBuilder, ReactiveFormsModule} from '@angular/forms';
+import { FormArray, FormBuilder, FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
 import {ActivatedRoute, Router} from '@angular/router';
 import {TranslateModule, TranslateService} from '@ngx-translate/core';
 import {PaginationService} from 'ngx-pagination';
@@ -13,18 +13,50 @@ import {LdnServicesService} from '../ldn-services-data/ldn-services-data.service
 import {RouterStub} from '../../../shared/testing/router.stub';
 import {MockActivatedRoute} from '../../../shared/mocks/active-router.mock';
 import {NotificationsServiceStub} from '../../../shared/testing/notifications-service.stub';
-import {of} from 'rxjs';
+import { of as observableOf, of } from 'rxjs';
 import {RouteService} from '../../../core/services/route.service';
 import {provideMockStore} from '@ngrx/store/testing';
+import { createSuccessfulRemoteDataObject$ } from '../../../shared/remote-data.utils';
+import { By } from '@angular/platform-browser';
 
 describe('LdnServiceFormEditComponent', () => {
   let component: LdnServiceFormComponent;
   let fixture: ComponentFixture<LdnServiceFormComponent>;
 
-  let ldnServicesService: any;
+  let ldnServicesService: LdnServicesService;
   let ldnItemfiltersService: any;
   let cdRefStub: any;
   let modalService: any;
+  let activatedRoute: MockActivatedRoute;
+
+  const testId = '1234';
+  const routeParams = {
+    serviceId: testId,
+  };
+  const routeUrlSegments = [{path: 'path'}];
+  const formMockValue = {
+    'id': '',
+    'name': 'name',
+    'description': 'description',
+    'url': 'www.test.com',
+    'ldnUrl': 'https://test.com',
+    'lowerIp': '127.0.0.1',
+    'upperIp': '100.100.100.100',
+    'score': 1,
+    'inboundPattern': '',
+    'constraintPattern': '',
+    'enabled': '',
+    'type': 'ldnservice',
+    'notifyServiceInboundPatterns': [
+      {
+        'pattern': '',
+        'patternLabel': 'Select a pattern',
+        'constraint': '',
+        'automatic': false
+      }
+    ]
+  };
+
 
   const translateServiceStub = {
     get: () => of('translated-text'),
@@ -35,9 +67,12 @@ describe('LdnServiceFormEditComponent', () => {
   };
 
   beforeEach(async () => {
-    ldnServicesService = {
-      update: () => ({}),
-    };
+    ldnServicesService = jasmine.createSpyObj('ldnServicesService', {
+      create: observableOf(null),
+      update: observableOf(null),
+      findById: createSuccessfulRemoteDataObject$({}),
+    });
+
     ldnItemfiltersService = {
       findAll: () => of(['item1', 'item2']),
     };
@@ -49,17 +84,20 @@ describe('LdnServiceFormEditComponent', () => {
       }
     };
 
+
+    activatedRoute = new MockActivatedRoute(routeParams, routeUrlSegments);
+
     await TestBed.configureTestingModule({
       imports: [ReactiveFormsModule, TranslateModule.forRoot(), NgbDropdownModule],
       declarations: [LdnServiceFormComponent],
       providers: [
         {provide: LdnServicesService, useValue: ldnServicesService},
         {provide: LdnItemfiltersService, useValue: ldnItemfiltersService},
         {provide: Router, useValue: new RouterStub()},
-        {provide: ActivatedRoute, useValue: new MockActivatedRoute()},
+        {provide: ActivatedRoute, useValue: activatedRoute},
         {provide: ChangeDetectorRef, useValue: cdRefStub},
         {provide: NgbModal, useValue: modalService},
-        {provide: NotificationsService, useValue: NotificationsServiceStub},
+        {provide: NotificationsService, useValue: new NotificationsServiceStub()},
         {provide: TranslateService, useValue: translateServiceStub},
         {provide: PaginationService, useValue: {}},
         FormBuilder,
@@ -71,10 +109,135 @@ describe('LdnServiceFormEditComponent', () => {
 
     fixture = TestBed.createComponent(LdnServiceFormComponent);
     component = fixture.componentInstance;
+    spyOn(component, 'filterPatternObjectsAndAssignLabel').and.callFake((a) => a);
     fixture.detectChanges();
   });
 
   it('should create', () => {
     expect(component).toBeTruthy();
+    expect(component.formModel instanceof FormGroup).toBeTruthy();
+  });
+
+  it('should init properties correctly', fakeAsync(() => {
+    spyOn(component, 'fetchServiceData');
+    spyOn(component, 'setItemfilters');
+    component.ngOnInit();
+    tick(100);
+    expect((component as any).serviceId).toEqual(testId);
+    expect(component.isNewService).toBeFalsy();
+    expect(component.areControlsInitialized).toBeTruthy();
+    expect(component.formModel.controls.notifyServiceInboundPatterns).toBeDefined();
+    expect(component.fetchServiceData).toHaveBeenCalledWith(testId);
+    expect(component.setItemfilters).toHaveBeenCalled();
+  }));
+
+  it('should unsubscribe on destroy', () => {
+    spyOn((component as any).routeSubscription, 'unsubscribe');
+    component.ngOnDestroy();
+    expect((component as any).routeSubscription.unsubscribe).toHaveBeenCalled();
+  });
+
+  it('should handle create service with valid form', () => {
+    spyOn(component, 'fetchServiceData').and.callFake((a) => a);
+    component.formModel.addControl('notifyServiceInboundPatterns', (component as any).formBuilder.array([{pattern: 'patternValue'}]));
+    const nameInput = fixture.debugElement.query(By.css('#name'));
+    const descriptionInput = fixture.debugElement.query(By.css('#description'));
+    const urlInput = fixture.debugElement.query(By.css('#url'));
+    const scoreInput = fixture.debugElement.query(By.css('#score'));
+    const lowerIpInput = fixture.debugElement.query(By.css('#lowerIp'));
+    const upperIpInput = fixture.debugElement.query(By.css('#upperIp'));
+    const ldnUrlInput = fixture.debugElement.query(By.css('#ldnUrl'));
+    component.formModel.patchValue(formMockValue);
+
+    nameInput.nativeElement.value = 'testName';
+    descriptionInput.nativeElement.value = 'testDescription';
+    urlInput.nativeElement.value = 'tetsUrl.com';
+    ldnUrlInput.nativeElement.value = 'tetsLdnUrl.com';
+    scoreInput.nativeElement.value = 1;
+    lowerIpInput.nativeElement.value = '127.0.0.1';
+    upperIpInput.nativeElement.value = '127.0.0.1';
+
+    fixture.detectChanges();
+
+    expect(component.formModel.valid).toBeTruthy();
+  });
+
+  it('should handle create service with invalid form', () => {
+    const nameInput = fixture.debugElement.query(By.css('#name'));
+
+    nameInput.nativeElement.value = 'testName';
+    fixture.detectChanges();
+
+    expect(component.formModel.valid).toBeFalsy();
+  });
+
+  it('should not create service with invalid form', () => {
+    spyOn(component.formModel, 'markAllAsTouched');
+    spyOn(component, 'closeModal');
+    component.createService();
+
+    expect(component.formModel.markAllAsTouched).toHaveBeenCalled();
+    expect(component.closeModal).toHaveBeenCalled();
+  });
+
+  it('should create service with valid form', () => {
+    spyOn(component.formModel, 'markAllAsTouched');
+    spyOn(component, 'closeModal');
+    spyOn(component, 'checkPatterns').and.callFake(() => true);
+    component.formModel.addControl('notifyServiceInboundPatterns', (component as any).formBuilder.array([{pattern: 'patternValue'}]));
+    component.formModel.patchValue(formMockValue);
+    component.createService();
+
+    expect(component.formModel.markAllAsTouched).toHaveBeenCalled();
+    expect(component.closeModal).not.toHaveBeenCalled();
+    expect(ldnServicesService.create).toHaveBeenCalled();
+  });
+
+  it('should check patterns', () => {
+    const arrValid = new FormArray([
+      new FormGroup({
+        pattern: new FormControl('pattern')
+      }),
+    ]);
+
+    const arrInvalid = new FormArray([
+      new FormGroup({
+        pattern: new FormControl('')
+      }),
+    ]);
+
+    expect(component.checkPatterns(arrValid)).toBeTruthy();
+    expect(component.checkPatterns(arrInvalid)).toBeFalsy();
+  });
+
+  it('should fetch service data', () => {
+    component.fetchServiceData(testId);
+    expect(ldnServicesService.findById).toHaveBeenCalledWith(testId);
+    expect(component.filterPatternObjectsAndAssignLabel).toHaveBeenCalled();
+    expect((component as any).ldnService).toEqual({});
+  });
+
+  it('should generate patch operations', () => {
+    spyOn(component as any, 'createReplaceOperation');
+    spyOn(component as any, 'handlePatterns');
+    component.generatePatchOperations();
+    expect((component as any).createReplaceOperation).toHaveBeenCalledTimes(7);
+    expect((component as any).handlePatterns).toHaveBeenCalled();
+  });
+
+  it('should open modal on submit', () => {
+    spyOn(component, 'openConfirmModal');
+    component.onSubmit();
+    expect(component.openConfirmModal).toHaveBeenCalled();
+  });
+
+
+  it('should reset form and leave', () => {
+    spyOn(component as any, 'sendBack');
+    spyOn(component as any, 'closeModal');
+
+    component.resetFormAndLeave();
+    expect((component as any).closeModal).toHaveBeenCalled();
+    expect((component as any).sendBack).toHaveBeenCalled();
   });
 });

src/app/admin/admin-ldn-services/ldn-service-form/ldn-service-form.component.ts

@@ -130,7 +130,8 @@ export class LdnServiceFormComponent implements OnInit, OnDestroy {
    */
   createService() {
     this.formModel.markAllAsTouched();
-    const hasInboundPattern = this.checkPatterns(this.formModel.get('notifyServiceInboundPatterns') as FormArray);
+    const notifyServiceInboundPatterns = this.formModel.get('notifyServiceInboundPatterns') as FormArray;
+    const hasInboundPattern = notifyServiceInboundPatterns?.length > 0 ? this.checkPatterns(notifyServiceInboundPatterns) : false;
 
     if (this.formModel.invalid) {
       this.closeModal();

src/app/admin/admin-ldn-services/ldn-services-directory/ldn-services-directory.component.html

@@ -1,6 +1,6 @@
 <div class="container">
   <div class="d-flex">
-    <h2 class="flex-grow-1">{{ 'ldn-registered-services.title' | translate }}</h2>
+    <h1 class="flex-grow-1">{{ 'ldn-registered-services.title' | translate }}</h1>
   </div>
   <div class="d-flex justify-content-end">
     <button class="btn btn-success" routerLink="/admin/ldn/services/new"><i
@@ -44,10 +44,14 @@ <h2 class="flex-grow-1">{{ 'ldn-registered-services.title' | translate }}</h2>
           </td>
           <td>
             <div class="btn-group">
-              <button (click)="selectServiceToDelete(ldnService.id)" class="btn btn-outline-danger">
+              <button
+                (click)="selectServiceToDelete(ldnService.id)"
+                [attr.aria-label]="'ldn-service-overview-select-delete' | translate"
+                class="btn btn-outline-danger">
                 <i class="fas fa-trash"></i>
               </button>
               <button [routerLink]="['/admin/ldn/services/edit/', ldnService.id]"
+                      [attr.aria-label]="'ldn-service-overview-select-edit' | translate"
                       class="btn btn-outline-dark">
                 <i class="fas fa-edit"></i>
               </button>
@@ -69,6 +73,7 @@ <h2 class="flex-grow-1">{{ 'ldn-registered-services.title' | translate }}</h2>
         <h4>{{'service.overview.delete.header' | translate }}</h4>
       </div>
       <button (click)="closeModal()" aria-label="Close"
+              [attr.aria-label]="'ldn-service-overview-close-modal' | translate"
               class="close" type="button">
         <span aria-hidden="true">×</span>
       </button>
@@ -80,9 +85,11 @@ <h4>{{'service.overview.delete.header' | translate }}</h4>
       </div>
       <div class="mt-4">
         <button (click)="closeModal()"
+                [attr.aria-label]="'ldn-service-overview-close-modal' | translate"
                 class="btn btn-primary mr-2">{{ 'service.detail.delete.cancel' | translate }}</button>
         <button (click)="deleteSelected(this.selectedServiceId.toString(), ldnServicesService)"
                 class="btn btn-danger"
+                [attr.aria-label]="'ldn-service-overview-select-delete' | translate"
                 id="delete-confirm">{{ 'service.overview.delete' | translate }}
         </button>
       </div>

src/app/admin/admin-ldn-services/ldn-services-model/ldn-services.model.ts

@@ -7,6 +7,10 @@ import {typedObject} from '../../../core/cache/builders/build-decorators';
 import {NotifyServicePattern} from './ldn-service-patterns.model';
 
 
+/**
+ * LDN Services bounded to each selected pattern, relation set in service creation
+ */
+
 export interface LdnServiceByPattern {
   allowsMultipleRequests: boolean;
   services: LdnService[];

src/app/admin/admin-ldn-services/ldn-services-patterns/ldn-service-coar-patterns.ts

@@ -1,3 +1,8 @@
+/**
+ * All available patterns for LDN service creation.
+ * They are used to populate a dropdown in the LDN service form creation
+ */
+
 export const notifyPatterns = [
 
   'ack-accept',

src/app/core/coar-notify/notify-info/notify-info.component.html

@@ -10,6 +10,9 @@ <h2>{{ 'coar-notify-support.ldn-inbox.title' | translate }}</h2>
     <p [innerHTML]="('coar-notify-support.ldn-inbox.content' | translate).replace('{ldnInboxUrl}', generateCoarRestApiLinksHTML() | async)"></p>
 
     <h2>{{ 'coar-notify-support.message-moderation.title' | translate }}</h2>
-    <p [innerHTML]="('coar-notify-support.message-moderation.content' | translate)"></p>
+    <p>
+      {{ 'coar-notify-support.message-moderation.content' | translate }}
+      <a routerLink="/info/feedback" >{{ 'coar-notify-support.message-moderation.feedback-form' | translate }}</a>
+    </p>
     </body>
 </div>