Angular Upgrade v21.x

[KhizerRehan]

What this PR does / why we need it:
This PR upgrades the KKP Dashboard Angular frontend from v20.3.x to v21.2.x version.

Which issue(s) this PR fixes:

Fixes #7951

/kind chore

What type of PR is this?

Special notes for your reviewer:

• Updated Angular packages to version 21.x in package.json.
• Replaced ngx-clipboard with Angular CDK's clipboard functionality in multiple components.

Removed Package

• ngx-clipboard": "16.0.0" in favour of built support for copy to clipboard by angular CDK

There are few packages that are no longer maintainer and therefore "PEER" depedency issue as supported version are not available however older verison of packages still works but adding overrides for few reasons:

Two packages in the project are overridden to force Angular 21 peer dependencies:

Package	Version	Status	Override Reason
@angular/flex-layout	15.0.0-beta.42	Archived (2022)	Declares Angular 15 peers; last release pre-v21
@swimlane/ngx-charts	23.1.0	Slow maintenance	No Angular 21 release available

What the override does:

• Silences npm peer-dependency mismatch warnings

$ = version variable in npm overrides.                                              
                                                                                    
  $@angular/core means "use the same version as root-level @angular/core".            
                                                                                      
Example:                                                                                                                                                                  

  Root package.json:                                                                  
  "@angular/core": "21.2.9"                                                           

  Override:                                                                         
  "@angular/flex-layout": {                                 
    "@angular/core": "$@angular/core"
  }    

FYI: Even without overrrides of these packages these can work and bcz of this line otherwise you can probably see following error and currently those are SILENCED

npm error code ERESOLVE
npm error ERESOLVE could not resolve
npm error
npm error While resolving: @swimlane/ngx-charts@23.1.0
...
...

Useful to Add Overrides property with $

1. Auto-tracking: if you upgrade Angular to v22, overrides automatically use v22. No manual edit needed.
2. Single source of truth: one place (@angular/core: 21.2.9 in root) controls all downstream versions.
3. Alternative without $: "@angular/core": "21.2.9" // hardcoded, stale when you upgrade then in future updated have to manually update.
4. Then you'd have to update override separately easy to forget.

# TODO: This should be removed once we have fixed the issues with peer dependencies
legacy-peer-deps=true

Why overrides are safe — The $@angular/core syntax silences npm's peer-dependency mismatch
errors. It does NOT change compiled code. If these libraries break at runtime, it surfaces as a
runtime error, not a hidden compatibility issue. Both are tracked for replacement in follow-up
tickets.

Does this PR introduce a user-facing change? Then add your Release Note here:

Updates Angular deps to version 21

Documentation:

None

Test issue:

None

[kubermatic-bot]

Skipping CI for Draft Pull Request.
If you want CI signal for your change, please convert it to an actual PR.
You can still manually trigger a test run with /test all

[kubermatic-bot]

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:
Once this PR has been reviewed and has the lgtm label, please assign ahmadhamzh for approval. For more information see the Code Review Process.

The full list of commands accepted by this bot can be found here.

Details

Needs approval from an approver in each of these files:

• modules/web/OWNERS
• modules/web/src/OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[KhizerRehan]

/test all

[KhizerRehan]

/test pre-dashboard-web-integration-tests-ce

[KhizerRehan]

/test all

[KhizerRehan]

/test all

[KhizerRehan]

/test pre-dashboard-web-integration-tests-ce
/test pre-dashboard-web-integration-tests

[KhizerRehan]

/test pre-dashboard-web-integration-tests-ce

[Copilot]

Pull request overview

Copilot reviewed 28 out of 29 changed files in this pull request and generated no new comments.

[KhizerRehan]

/test pre-dashboard-web-integration-tests-ce