134770: Manual fixes

- Fixed dependencies who moved between packages
  - Special mention for the PlacementArray from @ng-bootstrap/ng-bootstrap which is not exposed by default so had to replace it with Placement[]
- Fixed failing tests
- Updated CI's node version to 20 & 22

(cherry picked from commit 02ea7b2)

Author: alexandrevryghem

.eslintrc.json

@@ -175,6 +175,7 @@
             "ignoreParameters": true
           }
         ],
+        "@angular-eslint/prefer-inject": "off",
         "@typescript-eslint/quotes": [
           "error",
           "single",

.github/workflows/build.yml

@@ -21,7 +21,7 @@ jobs:
       DSPACE_REST_PORT: 8080
       DSPACE_REST_NAMESPACE: '/server'
       DSPACE_REST_SSL: false
-      # Spin up UI on 127.0.0.1 to avoid host resolution issues in e2e tests with Node 18+
+      # Spin up UI on 127.0.0.1 to avoid host resolution issues in e2e tests with Node 20+
       DSPACE_UI_HOST: 127.0.0.1
       DSPACE_UI_PORT: 4000
       # Ensure all SSR caching is disabled in test environment
@@ -44,7 +44,7 @@ jobs:
     strategy:
       # Create a matrix of Node versions to test against (in parallel)
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
       # Do NOT exit immediately if one matrix job fails
       fail-fast: false
     # These are the actual CI steps to perform per job
@@ -114,7 +114,7 @@ jobs:
       # NOTE: Angular CLI only supports code coverage for specs. See https://github.com/angular/angular-cli/issues/6286
       - name: Upload code coverage report to Artifact
         uses: actions/upload-artifact@v4
-        if: matrix.node-version == '18.x'
+        if: matrix.node-version == '20.x'
         with:
           name: coverage-report-${{ matrix.node-version }}
           path: 'coverage/dspace-angular/lcov.info'

Dockerfile

@@ -1,7 +1,7 @@
 # This image will be published as dspace/dspace-angular
 # See https://github.com/DSpace/dspace-angular/tree/main/docker for usage details
 
-FROM docker.io/node:18-alpine
+FROM docker.io/node:20-alpine
 
 # Ensure Python and other build tools are available
 # These are needed to install some node modules, especially on linux/arm64

Dockerfile.dist

@@ -4,7 +4,7 @@
 # Test build:
 # docker build -f Dockerfile.dist -t dspace/dspace-angular:latest-dist .
 
-FROM docker.io/node:18-alpine AS build
+FROM docker.io/node:20-alpine AS build
 
 # Ensure Python and other build tools are available
 # These are needed to install some node modules, especially on linux/arm64
@@ -17,7 +17,7 @@ RUN npm install
 ADD . /app/
 RUN npm run build:prod
 
-FROM node:18-alpine
+FROM node:20-alpine
 RUN npm install --global pm2
 
 COPY --chown=node:node --from=build /app/dist /app/dist

README.md

@@ -35,7 +35,7 @@ https://wiki.lyrasis.org/display/DSDOC9x/Installing+DSpace
 Quick start
 -----------
 
-**Ensure you're running [Node](https://nodejs.org) `v18.x` or `v20.x`, [npm](https://www.npmjs.com/) >= `v10.x`**
+**Ensure you're running [Node](https://nodejs.org) `v20.x` or `v22.x`, [npm](https://www.npmjs.com/) >= `v10.x`**
 
 ```bash
 # clone the repo
@@ -90,7 +90,7 @@ Requirements
 ------------
 
 -	[Node.js](https://nodejs.org)
--	Ensure you're running node `v18.x` or `v20.x`
+-	Ensure you're running node `v20.x` or `v22.x`
 
 If you have [`nvm`](https://github.com/creationix/nvm#install-script) or [`nvm-windows`](https://github.com/coreybutler/nvm-windows) installed, which is highly recommended, you can run `nvm install --lts && nvm use` to install and start using the latest Node LTS.
 

src/app/admin/admin-notify-dashboard/admin-notify-search-result/admin-notify-search-result.component.html

@@ -15,7 +15,7 @@
         <tr>
           <td class="text-nowrap">
             @if (message.queueLastStartTime) {
-              <div>{{ message.queueLastStartTime | date:"YYYY/MM/d hh:mm:ss" }}</div>
+              <div>{{ message.queueLastStartTime | date:"yyyy/MM/d hh:mm:ss" }}</div>
             }
             @if (!message.queueLastStartTime) {
               <div>n/a</div>

src/app/admin/admin-notify-dashboard/admin-notify-search-result/admin-notify-search-result.component.ts

@@ -99,7 +99,7 @@ export class AdminNotifySearchResultComponent extends TabulatableResultListEleme
    * The format for the date values
    * @private
    */
-  private dateFormat = 'YYYY/MM/d hh:mm:ss';
+  private dateFormat = 'yyyy/MM/d hh:mm:ss';
 
   constructor(private modalService: NgbModal,
                 private adminNotifyMessagesService: AdminNotifyMessagesService,

src/app/collection-page/collection-form/collection-form.models.ts

@@ -1,9 +1,9 @@
 import {
   DynamicFormControlModel,
   DynamicInputModel,
+  DynamicSelectModelConfig,
   DynamicTextAreaModel,
 } from '@ng-dynamic-forms/core';
-import { DynamicSelectModelConfig } from '@ng-dynamic-forms/core/lib/model/select/dynamic-select.model';
 
 import { environment } from '../../../environments/environment';
 

src/app/core/lazy-data-service.ts

@@ -1,14 +1,12 @@
-import {
-  Injector,
-  Type,
-} from '@angular/core';
+import { Injector } from '@angular/core';
 import {
   defer,
   Observable,
 } from 'rxjs';
 
 import { LazyDataServicesMap } from '../../config/app-config.interface';
 import { HALDataService } from './data/base/hal-data-service.interface';
+import { GenericConstructor } from './shared/generic-constructor';
 
 /**
  * Loads a service lazily. The service is loaded when the observable is subscribed to.
@@ -32,7 +30,7 @@ export function lazyDataService<T>(
 ): Observable<T> {
   return defer(() => {
     if (dataServicesMap.has(key) && typeof dataServicesMap.get(key) === 'function') {
-      const loader: () => Promise<Type<HALDataService<any>> | { default: HALDataService<any> }> = dataServicesMap.get(key);
+      const loader: () => Promise<GenericConstructor<HALDataService<any>> | { default: GenericConstructor<HALDataService<any>> }> = dataServicesMap.get(key);
       return loader()
         .then((serviceOrDefault) => {
           if ('default' in serviceOrDefault) {

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

@@ -1,8 +1,10 @@
-<select class="form-select" [(ngModel)]="mdValue?.newValue.value" (ngModelChange)="confirm.emit(false)"
-        [attr.aria-label]="(dsoType + '.edit.metadata.edit.value') | translate">
-  @for (entity of (entities$ | async); track entity.label) {
-    <option [value]="entity.label === 'none' ? undefined : entity.label">
-      {{ entity.label }}
-    </option>
-  }
-</select>
+@if (mdValue) {
+  <select class="form-select" [(ngModel)]="mdValue.newValue.value" (ngModelChange)="confirm.emit(false)"
+          [attr.aria-label]="(dsoType + '.edit.metadata.edit.value') | translate">
+    @for (entity of (entities$ | async); track entity.label) {
+      <option [value]="entity.label === 'none' ? undefined : entity.label">
+        {{ entity.label }}
+      </option>
+    }
+  </select>
+}