Skip to content

Upgrade to Angular v21#38

Merged
lukasmatta merged 18 commits into
AbsaOSS:masterfrom
lukasmatta:chores/update-angular
Apr 7, 2026
Merged

Upgrade to Angular v21#38
lukasmatta merged 18 commits into
AbsaOSS:masterfrom
lukasmatta:chores/update-angular

Conversation

@lukasmatta
Copy link
Copy Markdown
Collaborator

@lukasmatta lukasmatta commented Apr 6, 2026

Upgraded Angular and dependencies to v21, refactored DI to use inject(), and modernized Cypress config.

Changes:

  • Bump all Angular and related packages to v21
  • Replace constructor-based DI with inject() across all components and services
  • Migrate Cypress config from cypress.json + plugins file to cypress.config.ts, remove obsolete files
  • Switch tsconfig.json to bundler module resolution
  • Add provideZoneChangeDetection to main bootstrap
  • Fix template syntax
  • Upgraded Node version in CI to v24
  • Increased prod bundle limit by 100 kB, we might want to investigate in case that the bundle size will further grow above 1.1 MB

Release Notes:

  • Upgrade to Angular v21

Closes #36

@lukasmatta lukasmatta changed the title Update to Angular v21 Upgrade to Angular v21 Apr 6, 2026
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR upgrades the StatusBoard UI to Angular v21 and aligns the frontend toolchain with the newer Angular ecosystem by modernizing dependency injection usage and the Cypress configuration.

Changes:

  • Upgrade Angular + related UI/test dependencies to v21-compatible versions.
  • Refactor Angular DI from constructor injection to inject() in services/components and update templates to modern control flow syntax.
  • Migrate Cypress from cypress.json + plugins file to cypress.config.ts and adjust TypeScript/ESLint configs accordingly.

Reviewed changes

Copilot reviewed 21 out of 22 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
ui/tsconfig.spec.json Adjusts TS compiler options for Jest specs (module isolation / JSON imports / synthetic defaults).
ui/tsconfig.json Switches TS module resolution to bundler to match modern Angular tooling.
ui/tsconfig.cy.json Includes cypress.config.ts in the Cypress TypeScript project.
ui/src/main.ts Adds provideZoneChangeDetection() during NgModule bootstrap.
ui/src/app/services/refresh/refresh.service.ts Converts service DI to inject().
ui/src/app/services/card/card.service.ts Converts service DI to inject().
ui/src/app/services/backend/backend.service.ts Converts service DI to inject() and removes constructor.
ui/src/app/components/status-list/status-list.component.ts Converts component DI to inject() and updates constructor accordingly.
ui/src/app/components/status-list/status-list.component.html Migrates *ngIf to the new @if syntax.
ui/src/app/components/dependency-graph/dependency-graph.component.ts Converts dialog DI to inject().
ui/src/app/components/card/card.component.ts Converts component DI to inject() and removes constructor injection.
ui/src/app/components/card-details/card-details.component.ts Converts dialog DI to inject().
ui/src/app/app.component.ts Converts component DI to inject() and removes constructor injection.
ui/package.json Bumps Angular/PrimeNG/CPS UI Kit/testing deps to Angular v21-compatible versions.
ui/jest.config.ts Updates Jest preset config (removes preset global setup) and keeps ESM transform settings.
ui/eslint.config.js Includes cypress.config.ts in Cypress linting scope.
ui/cypress/plugins/index.js Removes obsolete Cypress plugins file.
ui/cypress.json Removes obsolete legacy Cypress JSON config.
ui/cypress.config.ts Adds new Cypress v10+ style TypeScript config.
ui/angular.json Adds Angular schematics defaults to standardize generated artifact naming.
.github/workflows/status-board-ui-tests.yml Updates CI to use Node.js v24 and newer setup-node action.

Comment thread ui/src/app/components/card-details/card-details.component.ts
@lukasmatta lukasmatta merged commit eadc172 into AbsaOSS:master Apr 7, 2026
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

UI/UX UI/UX

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Migrate to Angular 21

3 participants