Development: Upgrade to Angular 18

[JohannesWt]

Checklist

General

• This is a small issue that I tested locally and was confirmed by another developer on a test server.
• Language: I followed the guidelines for inclusive, diversity-sensitive, and appreciative language.
• I chose a title conforming to the naming conventions for pull requests.

Client

• I strictly followed the client coding and design guidelines.
• Following the theming guidelines, I specified colors only in the theming variable files and checked that the changes look consistent in both the light and the dark theme.

Motivation and Context

This PR fixes issues preventing the upgrade to Angular 18

Due to the version changes the following things mainly have been changed:

• add a tracking id to @for loops in Angular
• upgrade loadings spinners to new syntax of FontAwesome
• fix tests due to deprecation

Description

In this PR several issues have been resolved which prevented the upgrade to Angular 18. Using [styles] in a component is not supported anymore. Therefore the affected places have been mainly restructured using bootstrap classes and some custom (but simplified) css. Additionally the [spin] attribute of fa-icons is not supported anymore which also has been replaced by its new alternative.
Also quite a lot of tests had to be refactored due to changes/deprecation of Angular or some other npm packages

Testserver States

Note

These badges show the state of the test servers.
Green = Currently available, Red = Currently locked

Review Progress

Code Review

• Code Review 1
• Code Review 2

[JohannesStoehr]

Tested in Testing session. Did not find any problems

[az108]

Tested in Testing Session, no errors were found

[EneaGore]

Tested on TS4. Did not encounter any issues.

[BBesrour]

Demonstrated and tested in a testing session

[dmytropolityka]

didn't find any issues while testing in a testing session

[coolchock]

tested in testing session, no weird behaviour observed

[pzdr7]

Code

[marlon-luca-bu]

Code

[sarpsahinalp]

Code