Merge remote-tracking branch 'gitHub/main' into task/main/DURACOM-426

Author: FrancescoMolinaro

package-lock.json

@@ -77,22 +77,22 @@
     }
   },
   "dependencies": {
-    "@angular/animations": "^20.3.14",
+    "@angular/animations": "^20.3.16",
     "@angular/cdk": "^20.2.14",
-    "@angular/common": "^20.3.14",
-    "@angular/compiler": "^20.3.14",
-    "@angular/core": "^20.3.14",
-    "@angular/forms": "^20.3.14",
-    "@angular/localize": "^20.3.14",
-    "@angular/platform-browser": "^20.3.14",
-    "@angular/platform-browser-dynamic": "^20.3.14",
-    "@angular/platform-server": "^20.3.14",
-    "@angular/router": "^20.3.14",
+    "@angular/common": "^20.3.16",
+    "@angular/compiler": "^20.3.16",
+    "@angular/core": "^20.3.16",
+    "@angular/forms": "^20.3.16",
+    "@angular/localize": "^20.3.16",
+    "@angular/platform-browser": "^20.3.16",
+    "@angular/platform-browser-dynamic": "^20.3.16",
+    "@angular/platform-server": "^20.3.16",
+    "@angular/router": "^20.3.16",
     "@angular/ssr": "^20.3.10",
     "@kolkov/ngx-gallery": "^2.0.1",
     "@ng-bootstrap/ng-bootstrap": "^15.1.2",
-    "@4science_ng-dynamic-forms/core": "^19.0.1",
-    "@4science_ng-dynamic-forms/ui-ng-bootstrap": "^19.0.4",
+    "@4science_ng-dynamic-forms/core": "^19.1.0",
+    "@4science_ng-dynamic-forms/ui-ng-bootstrap": "^19.1.0",
     "@ngrx/effects": "^20.1.0",
     "@ngrx/router-store": "^20.1.0",
     "@ngrx/store": "^20.1.0",
@@ -161,7 +161,7 @@
     "@angular-eslint/schematics": "^20.7.0",
     "@angular-eslint/template-parser": "^20.6.0",
     "@angular-eslint/utils": "^20.7.0",
-    "@angular/cli": "^20.3.12",
+    "@angular/cli": "^20.3.15",
     "@angular/compiler-cli": "^20.3.12",
     "@cypress/schematic": "^1.5.0",
     "@fortawesome/fontawesome-free": "^6.7.2",
@@ -218,7 +218,7 @@
     "postcss-loader": "^4.0.3",
     "postcss-preset-env": "^7.4.2",
     "rimraf": "^6.1.2",
-    "sass": "~1.94.2",
+    "sass": "~1.97.3",
     "sass-loader": "^12.6.0",
     "sass-resources-loader": "^2.2.5",
     "ts-node": "^8.10.2",

package.json

@@ -8,6 +8,7 @@ import { By } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { APP_CONFIG } from '@dspace/config/app-config.interface';
 import { BitstreamDataService } from '@dspace/core/data/bitstream-data.service';
+import { LocaleService } from '@dspace/core/locale/locale.service';
 import { NotificationsService } from '@dspace/core/notification-system/notifications.service';
 import { PaginationService } from '@dspace/core/pagination/pagination.service';
 import { Bitstream } from '@dspace/core/shared/bitstream.model';
@@ -37,6 +38,12 @@ import { FullFileSectionComponent } from './full-file-section.component';
 describe('FullFileSectionComponent', () => {
   let comp: FullFileSectionComponent;
   let fixture: ComponentFixture<FullFileSectionComponent>;
+  let localeService: any;
+  const languageList = ['en;q=1', 'de;q=0.8'];
+  const mockLocaleService = jasmine.createSpyObj('LocaleService', {
+    getCurrentLanguageCode: jasmine.createSpy('getCurrentLanguageCode'),
+    getLanguageCodeList: of(languageList),
+  });
 
   const mockBitstream: Bitstream = Object.assign(new Bitstream(),
     {
@@ -93,6 +100,7 @@ describe('FullFileSectionComponent', () => {
         { provide: NotificationsService, useValue: new NotificationsServiceStub() },
         { provide: SearchConfigurationService, useValue: jasmine.createSpyObj(['getCurrentConfiguration']) },
         { provide: PaginationService, useValue: paginationService },
+        { provide: LocaleService, useValue: mockLocaleService },
         { provide: APP_CONFIG, useValue: environment },
       ],
       schemas: [NO_ERRORS_SCHEMA],
@@ -104,6 +112,8 @@ describe('FullFileSectionComponent', () => {
   }));
 
   beforeEach(waitForAsync(() => {
+    localeService = TestBed.inject(LocaleService);
+    localeService.getCurrentLanguageCode.and.returnValue(of('en'));
     fixture = TestBed.createComponent(FullFileSectionComponent);
     comp = fixture.componentInstance;
     fixture.detectChanges();

src/app/item-page/full/field-components/file-section/full-file-section.component.spec.ts

@@ -10,6 +10,7 @@ import { ActivatedRoute } from '@angular/router';
 import { APP_CONFIG } from '@dspace/config/app-config.interface';
 import { BitstreamDataService } from '@dspace/core/data/bitstream-data.service';
 import { APP_DATA_SERVICES_MAP } from '@dspace/core/data-services-map-type';
+import { LocaleService } from '@dspace/core/locale/locale.service';
 import { NotificationsService } from '@dspace/core/notification-system/notifications.service';
 import { Bitstream } from '@dspace/core/shared/bitstream.model';
 import { PageInfo } from '@dspace/core/shared/page-info.model';
@@ -38,6 +39,12 @@ import { FileSectionComponent } from './file-section.component';
 describe('FileSectionComponent', () => {
   let comp: FileSectionComponent;
   let fixture: ComponentFixture<FileSectionComponent>;
+  let localeService: any;
+  const languageList = ['en;q=1', 'de;q=0.8'];
+  const mockLocaleService = jasmine.createSpyObj('LocaleService', {
+    getCurrentLanguageCode: jasmine.createSpy('getCurrentLanguageCode'),
+    getLanguageCodeList: of(languageList),
+  });
 
   const bitstreamDataService = jasmine.createSpyObj('bitstreamDataService', {
     findAllByItemAndBundleName: createSuccessfulRemoteDataObject$(createPaginatedList([])),
@@ -88,6 +95,7 @@ describe('FileSectionComponent', () => {
         { provide: APP_CONFIG, useValue: environment },
         { provide: ThemeService, useValue: getMockThemeService() },
         { provide: ActivatedRoute, useValue: new ActivatedRouteStub() },
+        { provide: LocaleService, useValue: mockLocaleService },
         provideMockStore(),
       ],
       schemas: [NO_ERRORS_SCHEMA],
@@ -103,6 +111,8 @@ describe('FileSectionComponent', () => {
   }));
 
   beforeEach(waitForAsync(() => {
+    localeService = TestBed.inject(LocaleService);
+    localeService.getCurrentLanguageCode.and.returnValue(of('en'));
     fixture = TestBed.createComponent(FileSectionComponent);
     comp = fixture.componentInstance;
     fixture.detectChanges();

src/app/item-page/simple/field-components/file-section/file-section.component.spec.ts

@@ -23,6 +23,7 @@ import { DSONameService } from '@dspace/core/breadcrumbs/dso-name.service';
 import { BitstreamDataService } from '@dspace/core/data/bitstream-data.service';
 import { PaginatedList } from '@dspace/core/data/paginated-list.model';
 import { ProcessDataService } from '@dspace/core/data/processes/process-data.service';
+import { LocaleService } from '@dspace/core/locale/locale.service';
 import { NotificationsService } from '@dspace/core/notification-system/notifications.service';
 import { Process } from '@dspace/core/processes/process.model';
 import { Bitstream } from '@dspace/core/shared/bitstream.model';
@@ -60,6 +61,12 @@ describe('ProcessDetailComponent', () => {
   let router: RouterStub;
   let modalService;
   let notificationsService: NotificationsServiceStub;
+  let localeService: any;
+  const languageList = ['en;q=1', 'de;q=0.8'];
+  const mockLocaleService = jasmine.createSpyObj('LocaleService', {
+    getCurrentLanguageCode: jasmine.createSpy('getCurrentLanguageCode'),
+    getLanguageCodeList: of(languageList),
+  });
 
   let process: Process;
   let fileName: string;
@@ -169,6 +176,7 @@ describe('ProcessDetailComponent', () => {
         { provide: NgbModal, useValue: modalService },
         { provide: NotificationsService, useValue: notificationsService },
         { provide: Router, useValue: router },
+        { provide: LocaleService, useValue: mockLocaleService },
       ],
       schemas: [CUSTOM_ELEMENTS_SCHEMA],
     })
@@ -186,7 +194,10 @@ describe('ProcessDetailComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(ProcessDetailComponent);
     component = fixture.componentInstance;
+    localeService = TestBed.inject(LocaleService);
+    localeService.getCurrentLanguageCode.and.returnValue(of('en'));
   });
+
   afterEach(fakeAsync(() => {
     TestBed.resetTestingModule();
     fixture.destroy();

src/app/process-page/detail/process-detail.component.spec.ts

@@ -49,14 +49,15 @@
         </button>
       }
       <button class="dropdown-item collection-item text-truncate"
+        [class.active]="selectedIndex === 0"
         (click)="onSelect(undefined); sdRef.close()" (mousedown)="onSelect(undefined); sdRef.close()"
         title="{{ 'dropdown.clear.tooltip' | translate }}" role="option"
         type="button">
         <i>{{ 'dropdown.clear' | translate }}</i>
       </button>
       @for (listEntry of optionsList; track listEntry; let i = $index) {
         <button class="dropdown-item collection-item text-truncate"
-          [class.active]="i === selectedIndex"
+          [class.active]="selectedIndex === (i + 1)"
           (keydown.enter)="onSelect(listEntry); sdRef.close()" (mousedown)="onSelect(listEntry); sdRef.close()"
           title="{{ inputFormatter(listEntry) }}" role="option" type="button"
           [attr.id]="inputFormatter(listEntry) === (currentValue|async) ? ('combobox_' + id + '_selected') : null">

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

@@ -156,7 +156,7 @@ export class DsDynamicScrollableDropdownComponent extends DsDynamicVocabularyCom
     }
   }
 
-  loadOptions(fromInit: boolean) {
+  loadOptions(fromInit: boolean, scrollAfterLoad: boolean = false) {
     this.loading = true;
     this.getDataFromService().pipe(
       getFirstSucceededRemoteDataPayload(),
@@ -174,7 +174,11 @@ export class DsDynamicScrollableDropdownComponent extends DsDynamicVocabularyCom
         list.pageInfo.totalElements,
         list.pageInfo.totalPages,
       );
-      this.selectedIndex = 0;
+
+      if (!fromInit) {
+        this.setSelectedIndexToCurrentValue(scrollAfterLoad);
+      }
+
       this.cdr.detectChanges();
     });
   }
@@ -192,26 +196,60 @@ export class DsDynamicScrollableDropdownComponent extends DsDynamicVocabularyCom
     if (!this.model.readOnly) {
       this.group.markAsUntouched();
       this.inputText = null;
-      this.updatePageInfo(this.model.maxOptions, 1);
-      this.loadOptions(false);
+
+      const pageSize = Math.min(this.pageInfo.totalElements, 200);
+      this.updatePageInfo(pageSize, 1);
+
+      this.loadOptions(false, true);
+      this.setSelectedIndexToCurrentValue(true);
       sdRef.open();
     }
   }
 
+  /**
+   * Set the selectedIndex to match the current value when dropdown opens
+   * @param shouldScroll Whether to scroll to the selected item after setting the index
+   */
+  private setSelectedIndexToCurrentValue(shouldScroll: boolean = false): void {
+    if (this.currentValue) {
+      this.currentValue.pipe(take(1)).subscribe(currentVal => {
+        if (currentVal && this.optionsList.length > 0) {
+          const foundIndex = this.optionsList.findIndex(entry =>
+            this.inputFormatter(entry) === currentVal,
+          );
+          this.selectedIndex = foundIndex >= 0 ? foundIndex + 1 : 0;
+        } else {
+          this.selectedIndex = 0;
+        }
+
+        if (shouldScroll && this.selectedIndex > 0) {
+          // Ensure DOM is updated before scrolling
+          this.cdr.detectChanges();
+          // Use setTimeout to ensure the active class is applied and rendered
+          setTimeout(() => this.scrollToSelected(), 0);
+        }
+      });
+    } else {
+      this.selectedIndex = 0;
+    }
+  }
+
   navigateDropdown(event: KeyboardEvent) {
+    const totalItems = this.optionsList.length + 1;
+
     if (event.key === 'ArrowDown') {
-      this.selectedIndex = Math.min(this.selectedIndex + 1, this.optionsList.length - 1);
+      this.selectedIndex = Math.min(this.selectedIndex + 1, totalItems - 1);
     } else if (event.key === 'ArrowUp') {
       this.selectedIndex = Math.max(this.selectedIndex - 1, 0);
     }
     this.scrollToSelected();
   }
 
   scrollToSelected() {
-    const dropdownItems = this.dropdownMenu.nativeElement.querySelectorAll('.dropdown-item');
+    const dropdownItems = this.dropdownMenu.nativeElement.querySelectorAll('.dropdown-item:not(.disabled)');
     const selectedItem = dropdownItems[this.selectedIndex];
     if (selectedItem) {
-      selectedItem.scrollIntoView({ block: 'nearest' });
+      selectedItem.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
     }
   }
 
@@ -227,7 +265,11 @@ export class DsDynamicScrollableDropdownComponent extends DsDynamicVocabularyCom
       event.preventDefault();
       event.stopPropagation();
       if (sdRef.isOpen()) {
-        this.onSelect(this.optionsList[this.selectedIndex]);
+        if (this.selectedIndex === 0) {
+          this.onSelect(undefined);
+        } else {
+          this.onSelect(this.optionsList[this.selectedIndex - 1]);
+        }
         sdRef.close();
       } else {
         sdRef.open();

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

@@ -2,7 +2,9 @@ import {
   Pipe,
   PipeTransform,
 } from '@angular/core';
+import { LocaleService } from '@dspace/core/locale/locale.service';
 import { filesize } from 'filesize';
+import { take } from 'rxjs/operators';
 
 /*
  * Convert bytes into largest possible unit.
@@ -18,7 +20,20 @@ import { filesize } from 'filesize';
   name: 'dsFileSize',
 })
 export class FileSizePipe implements PipeTransform {
+
+  private currentLocale: string;
+
+  constructor(private localeService: LocaleService) {
+    this.localeService.getCurrentLanguageCode().pipe(take(1)).subscribe(locale => {
+      this.currentLocale = locale;
+    });
+  }
+
   transform(bytes: number = 0, precision: number = 2): string {
-    return filesize(bytes, { standard: 'jedec', round: precision });
+    return filesize(bytes, {
+      standard: 'jedec',
+      round: precision,
+      locale: this.currentLocale,
+    });
   }
 }

src/app/shared/utils/file-size-pipe.ts

@@ -241,7 +241,8 @@ describe('SubmissionSectionCcLicensesComponent', () => {
     });
 
     it('should have section status incomplete', () => {
-      expect(component.getSectionStatus()).toBeObservable(cold('(a|)', { a: false }));
+      component.required$.next(true);
+      expect(component.getSectionStatus()).toBeObservable(cold('(a)', { a: false }));
     });
 
     describe('when all options have a value selected', () => {
@@ -271,7 +272,13 @@ describe('SubmissionSectionCcLicensesComponent', () => {
       });
 
       it('should have section status incomplete', () => {
-        expect(component.getSectionStatus()).toBeObservable(cold('(a|)', { a: false }));
+        component.required$.next(true);
+        expect(component.getSectionStatus()).toBeObservable(cold('(a)', { a: false }));
+      });
+
+      it('should have section status complete if not required', () => {
+        component.required$.next(false);
+        expect(component.getSectionStatus()).toBeObservable(cold('(a)', { a: true }));
       });
 
       describe('when the cc license is accepted', () => {
@@ -282,7 +289,8 @@ describe('SubmissionSectionCcLicensesComponent', () => {
         });
 
         it('should have section status complete', () => {
-          expect(component.getSectionStatus()).toBeObservable(cold('(a|)', { a: true }));
+          component.required$.next(false);
+          expect(component.getSectionStatus()).toBeObservable(cold('(a)', { a: true })); // first true is because the section is not required
         });
       });
     });

src/app/submission/sections/cc-license/submission-section-cc-licenses.component.spec.ts

@@ -39,6 +39,7 @@ import {
 import { TranslateModule } from '@ngx-translate/core';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 import {
+  BehaviorSubject,
   Observable,
   of,
   Subscription,
@@ -154,6 +155,11 @@ export class SubmissionSectionCcLicensesComponent extends SectionModelComponent
 
   ccLicenseLink$: Observable<string>;
 
+  /**
+   * Is the section required
+   */
+  public required$ = new BehaviorSubject<boolean>(false);
+
   constructor(
     protected modalService: NgbModal,
     protected sectionService: SectionsService,
@@ -178,6 +184,7 @@ export class SubmissionSectionCcLicensesComponent extends SectionModelComponent
     if (hasNoValue(this.ccLicenseLink$)) {
       this.ccLicenseLink$ = this.getCcLicenseLink$();
     }
+    this.required$.next(this.sectionData.mandatory);
   }
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -310,7 +317,10 @@ export class SubmissionSectionCcLicensesComponent extends SectionModelComponent
    *     the section status
    */
   getSectionStatus(): Observable<boolean> {
-    return of(this.accepted);
+    return this.required$.pipe(
+      map((required) => !required || this.accepted),
+      distinctUntilChanged(),
+    );
   }
 
   /**