Skip to content

feat(): migrate to Angular v22 - #1532

Merged
tomalaforge merged 1 commit into
mainfrom
tomalaforge/angular-v22-migration
Aug 14, 2026
Merged

feat(): migrate to Angular v22#1532
tomalaforge merged 1 commit into
mainfrom
tomalaforge/angular-v22-migration

Conversation

@tomalaforge

Copy link
Copy Markdown
Owner

Upgrades the entire workspace from Angular v21 to v22, including all `@angular/` packages to 22.1.x, `@angular-devkit/` and tooling to 22.1.4, `angular-eslint` to 22.1.0, `ng-packagr` to 22.1.1, and TypeScript to 6.0.3 (now required by Angular 22). Also runs all 8 official Angular v21→v22 schematics migrations: adding `ChangeDetectionStrategy.Eager` to components, `withXhr()` to `provideHttpClient` calls, disabling newly-strict template diagnostics, and updating tsconfigs across the workspace. Adds `"ignoreDeprecations": "6.0"` to `tsconfig.base.json` to handle the TypeScript 6 `baseUrl` deprecation.

@coderabbitai

coderabbitai Bot commented Aug 14, 2026

Copy link
Copy Markdown

Important

Review skipped

Too many files!

This PR contains 183 files, which is 33 over the limit of 150.

To get a review, reduce the PR to 150 files or fewer by splitting it into smaller PRs or changing its base branch.

Upgrade to a paid plan to raise the limit.

This review couldn't start because sufficient usage credits or metered capacity aren't available. Add credits or update usage-based reviews in the billing tab, then retry.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: b60917d8-2b40-4b74-a56d-7b1c4e737e2f

📥 Commits

Reviewing files that changed from the base of the PR and between 3ec9fbc and 5fdebff.

⛔ Files ignored due to path filters (1)
  • pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
📒 Files selected for processing (183)
  • apps/angular/1-projection/src/app/app.component.ts
  • apps/angular/1-projection/src/app/component/teacher-card/teacher-card.component.ts
  • apps/angular/1-projection/src/app/ui/card/card.component.ts
  • apps/angular/1-projection/tsconfig.app.json
  • apps/angular/10-utility-wrapper-pipe/src/app/app.component.ts
  • apps/angular/10-utility-wrapper-pipe/tsconfig.app.json
  • apps/angular/13-highly-customizable-css/src/app/page.component.ts
  • apps/angular/13-highly-customizable-css/src/app/static-text.component.ts
  • apps/angular/13-highly-customizable-css/src/app/text.component.ts
  • apps/angular/13-highly-customizable-css/tsconfig.app.json
  • apps/angular/16-master-dependency-injection/tsconfig.app.json
  • apps/angular/21-anchor-navigation/src/app/app.component.ts
  • apps/angular/21-anchor-navigation/src/app/foo.component.ts
  • apps/angular/21-anchor-navigation/src/app/home.component.ts
  • apps/angular/21-anchor-navigation/src/app/nav-button.component.ts
  • apps/angular/21-anchor-navigation/tsconfig.app.json
  • apps/angular/22-router-input/src/app/app.component.ts
  • apps/angular/22-router-input/src/app/home.component.ts
  • apps/angular/22-router-input/src/app/test.component.ts
  • apps/angular/22-router-input/tsconfig.app.json
  • apps/angular/31-module-to-standalone/src/app/app.component.ts
  • apps/angular/31-module-to-standalone/tsconfig.app.json
  • apps/angular/32-change-detection-bug/src/app/app.component.ts
  • apps/angular/32-change-detection-bug/src/app/bar.component.ts
  • apps/angular/32-change-detection-bug/src/app/foo.component.ts
  • apps/angular/32-change-detection-bug/src/app/main-navigation.component.ts
  • apps/angular/32-change-detection-bug/tsconfig.app.json
  • apps/angular/33-decoupling-components/src/app/app.component.ts
  • apps/angular/33-decoupling-components/tsconfig.app.json
  • apps/angular/39-injection-token/src/app/app.component.ts
  • apps/angular/39-injection-token/src/app/phone.component.ts
  • apps/angular/39-injection-token/src/app/timer-container.component.ts
  • apps/angular/39-injection-token/src/app/timer.component.ts
  • apps/angular/39-injection-token/src/app/video.component.ts
  • apps/angular/39-injection-token/tsconfig.app.json
  • apps/angular/4-typed-context-outlet/src/app/person.component.ts
  • apps/angular/4-typed-context-outlet/tsconfig.app.json
  • apps/angular/44-view-transition/src/app/blog/thumbnail-header.component.ts
  • apps/angular/44-view-transition/src/app/post/post-header.component.ts
  • apps/angular/44-view-transition/tsconfig.app.json
  • apps/angular/45-react-in-angular/src/app/app.component.ts
  • apps/angular/45-react-in-angular/src/app/react/post.component.ts
  • apps/angular/45-react-in-angular/tsconfig.app.json
  • apps/angular/46-simple-animations/src/app/app.component.ts
  • apps/angular/46-simple-animations/tsconfig.app.json
  • apps/angular/5-crud-application/src/app/app.component.ts
  • apps/angular/5-crud-application/src/app/app.config.ts
  • apps/angular/5-crud-application/tsconfig.app.json
  • apps/angular/52-lazy-load-component/src/app/app.component.ts
  • apps/angular/52-lazy-load-component/src/app/placeholder.component.ts
  • apps/angular/52-lazy-load-component/src/app/top.component.ts
  • apps/angular/52-lazy-load-component/tsconfig.app.json
  • apps/angular/55-back-button-navigation/src/app/app.component.ts
  • apps/angular/55-back-button-navigation/src/app/home/home.component.ts
  • apps/angular/55-back-button-navigation/src/app/sensitive-action/sensitive-action.component.ts
  • apps/angular/55-back-button-navigation/src/app/simple-action/simple-action.component.ts
  • apps/angular/55-back-button-navigation/tsconfig.app.json
  • apps/angular/57-content-projection-default/tsconfig.app.json
  • apps/angular/58-content-projection-condition/tsconfig.app.json
  • apps/angular/59-content-projection-defer/src/app/app.config.ts
  • apps/angular/59-content-projection-defer/tsconfig.app.json
  • apps/angular/6-structural-directive/src/app/login.component.ts
  • apps/angular/6-structural-directive/tsconfig.app.json
  • apps/angular/60-async-redirect/tsconfig.app.json
  • apps/angular/8-pure-pipe/src/app/app.component.ts
  • apps/angular/8-pure-pipe/tsconfig.app.json
  • apps/angular/9-wrap-function-pipe/src/app/app.component.ts
  • apps/angular/9-wrap-function-pipe/tsconfig.app.json
  • apps/forms/41-control-value-accessor/src/app/app.component.ts
  • apps/forms/41-control-value-accessor/src/app/feedback-form/feedback-form.component.ts
  • apps/forms/41-control-value-accessor/src/app/rating-control/rating-control.component.ts
  • apps/forms/41-control-value-accessor/tsconfig.app.json
  • apps/forms/48-avoid-losing-form-data/src/app/app.component.ts
  • apps/forms/48-avoid-losing-form-data/tsconfig.app.json
  • apps/forms/61-simplest-signal-form/src/app/app.component.ts
  • apps/forms/61-simplest-signal-form/tsconfig.app.json
  • apps/forms/62-crossfield-validation-signal-form/tsconfig.app.json
  • apps/forms/63-child-forms/tsconfig.app.json
  • apps/forms/64-form-array/src/app/contact-form.component.ts
  • apps/forms/64-form-array/tsconfig.app.json
  • apps/forms/65-signal-form-edition/tsconfig.app.json
  • apps/nx/42-static-vs-dynamic-import/src/app/app.component.ts
  • apps/nx/42-static-vs-dynamic-import/tsconfig.app.json
  • apps/performance/12-optimize-change-detection/src/app/app.component.ts
  • apps/performance/12-optimize-change-detection/tsconfig.app.json
  • apps/performance/34-default-vs-onpush/src/app/app.component.ts
  • apps/performance/34-default-vs-onpush/src/app/person-list.component.ts
  • apps/performance/34-default-vs-onpush/src/app/random.component.ts
  • apps/performance/34-default-vs-onpush/tsconfig.app.json
  • apps/performance/35-memoization/src/app/app.component.ts
  • apps/performance/35-memoization/src/app/person-list.component.ts
  • apps/performance/35-memoization/tsconfig.app.json
  • apps/performance/36-ngfor-optimization/src/app/app.component.ts
  • apps/performance/36-ngfor-optimization/src/app/person-list.component.ts
  • apps/performance/36-ngfor-optimization/tsconfig.app.json
  • apps/performance/37-optimize-big-list/src/app/app.component.ts
  • apps/performance/37-optimize-big-list/tsconfig.app.json
  • apps/performance/40-web-workers/src/app/app.component.ts
  • apps/performance/40-web-workers/src/app/unknown-person/unknown-person.component.ts
  • apps/performance/40-web-workers/tsconfig.app.json
  • apps/rxjs/11-high-order-operator-bug/src/app/app.component.ts
  • apps/rxjs/11-high-order-operator-bug/tsconfig.app.json
  • apps/rxjs/14-race-condition/tsconfig.app.json
  • apps/rxjs/38-catch-error/src/app/app.component.ts
  • apps/rxjs/38-catch-error/src/app/app.config.ts
  • apps/rxjs/38-catch-error/tsconfig.app.json
  • apps/rxjs/49-hold-to-save-button/tsconfig.app.json
  • apps/signal/30-interop-rxjs-signal/src/app/app.component.ts
  • apps/signal/30-interop-rxjs-signal/src/app/app.config.ts
  • apps/signal/30-interop-rxjs-signal/src/app/detail/detail.component.ts
  • apps/signal/30-interop-rxjs-signal/src/app/list/photos.component.ts
  • apps/signal/30-interop-rxjs-signal/tsconfig.app.json
  • apps/signal/43-signal-input/src/app/app.component.ts
  • apps/signal/43-signal-input/tsconfig.app.json
  • apps/signal/50-bug-in-effect/tsconfig.app.json
  • apps/signal/51-function-call-effect/tsconfig.app.json
  • apps/signal/53-big-signal-performance/src/app/app.component.ts
  • apps/signal/53-big-signal-performance/tsconfig.app.json
  • apps/signal/54-pipe-observable-to-signal/tsconfig.app.json
  • apps/signal/56-forms-and-signal/src/app/app.component.ts
  • apps/signal/56-forms-and-signal/tsconfig.app.json
  • apps/testing/17-router/src/app/app.component.ts
  • apps/testing/17-router/tsconfig.app.json
  • apps/testing/18-nested-components/src/app/app.component.ts
  • apps/testing/18-nested-components/tsconfig.app.json
  • apps/testing/19-input-output/src/app/app.component.ts
  • apps/testing/19-input-output/tsconfig.app.json
  • apps/testing/20-modal/src/app/app.component.ts
  • apps/testing/20-modal/src/app/error.dialog.ts
  • apps/testing/20-modal/src/app/profil-confirmation.dialog.ts
  • apps/testing/20-modal/tsconfig.app.json
  • apps/testing/23-harness/src/app/app.component.ts
  • apps/testing/23-harness/src/app/child.component.ts
  • apps/testing/23-harness/tsconfig.app.json
  • apps/testing/24-harness-creation/src/app/app.component.ts
  • apps/testing/24-harness-creation/src/app/slider.component.ts
  • apps/testing/24-harness-creation/tsconfig.app.json
  • apps/testing/28-checkbox/src/app/app.component.ts
  • apps/testing/28-checkbox/tsconfig.app.json
  • apps/testing/29-real-life-application/src/app/app.component.ts
  • apps/testing/29-real-life-application/src/app/detail/detail.component.ts
  • apps/testing/29-real-life-application/src/app/list/list.component.ts
  • apps/testing/29-real-life-application/src/app/list/ui/add.component.ts
  • apps/testing/29-real-life-application/src/app/list/ui/row.component.ts
  • apps/testing/29-real-life-application/tsconfig.app.json
  • apps/typescript/15-function-overload/src/app/app.component.ts
  • apps/typescript/15-function-overload/tsconfig.app.json
  • apps/typescript/47-enums-vs-union-types/src/app/app.component.ts
  • apps/typescript/47-enums-vs-union-types/tsconfig.app.json
  • libs/cli/tsconfig.lib.json
  • libs/custom-plugin/tsconfig.lib.json
  • libs/decoupling/brain/tsconfig.lib.json
  • libs/decoupling/brain/tsconfig.lib.prod.json
  • libs/decoupling/core/tsconfig.lib.json
  • libs/decoupling/core/tsconfig.lib.prod.json
  • libs/decoupling/helmet/tsconfig.lib.json
  • libs/decoupling/helmet/tsconfig.lib.prod.json
  • libs/fake-utils/tsconfig.lib.json
  • libs/fake-utils/tsconfig.lib.prod.json
  • libs/module-to-standalone/admin/feature/src/lib/create-user/create-user.component.ts
  • libs/module-to-standalone/admin/feature/src/lib/dashboard/dashboard.component.ts
  • libs/module-to-standalone/core/providers/tsconfig.lib.json
  • libs/module-to-standalone/core/providers/tsconfig.lib.prod.json
  • libs/module-to-standalone/forbidden/src/lib/forbidden.component.ts
  • libs/module-to-standalone/home/src/lib/home.component.ts
  • libs/module-to-standalone/user/contact/src/lib/create-contact/create-contact.component.ts
  • libs/module-to-standalone/user/contact/src/lib/dashboard/dashboard.component.ts
  • libs/module-to-standalone/user/contact/tsconfig.lib.json
  • libs/module-to-standalone/user/contact/tsconfig.lib.prod.json
  • libs/module-to-standalone/user/home/src/lib/home.component.ts
  • libs/module-to-standalone/user/home/tsconfig.lib.json
  • libs/module-to-standalone/user/home/tsconfig.lib.prod.json
  • libs/module-to-standalone/user/shell/src/lib/user-shell.component.ts
  • libs/module-to-standalone/user/shell/tsconfig.lib.json
  • libs/module-to-standalone/user/shell/tsconfig.lib.prod.json
  • libs/shared/directives/tsconfig.lib.json
  • libs/shared/directives/tsconfig.lib.prod.json
  • libs/shared/ui/src/lib/table.component.ts
  • libs/static-dynamic-import/users/src/lib/user.component.ts
  • libs/static-dynamic-import/users/src/lib/users.component.ts
  • migrations.json
  • package.json
  • tsconfig.base.json

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@tomalaforge
tomalaforge merged commit 2f44187 into main Aug 14, 2026
4 of 5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant