From 02485d4a89efbabc966f9d425ac98639ac92be39 Mon Sep 17 00:00:00 2001
From: jpaberzs <janis.paberzs18@gmail.com>
Date: Sun, 30 Aug 2026 19:54:35 +0300
Subject: [PATCH 1/3] feat: refactor router input into signal

---
 .../22-router-input/src/app/app.config.ts     |  4 +--
 .../22-router-input/src/app/test.component.ts | 25 +++++++++----------
 2 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/apps/angular/22-router-input/src/app/app.config.ts b/apps/angular/22-router-input/src/app/app.config.ts
index ed404941f..a7c1007b9 100644
--- a/apps/angular/22-router-input/src/app/app.config.ts
+++ b/apps/angular/22-router-input/src/app/app.config.ts
@@ -1,7 +1,7 @@
 import { ApplicationConfig } from '@angular/core';
-import { provideRouter } from '@angular/router';
+import { provideRouter, withComponentInputBinding } from '@angular/router';
 import { appRoutes } from './app.routes';
 
 export const appConfig: ApplicationConfig = {
-  providers: [provideRouter(appRoutes)],
+  providers: [provideRouter(appRoutes, withComponentInputBinding())],
 };
diff --git a/apps/angular/22-router-input/src/app/test.component.ts b/apps/angular/22-router-input/src/app/test.component.ts
index 699321ec5..8e686d1ae 100644
--- a/apps/angular/22-router-input/src/app/test.component.ts
+++ b/apps/angular/22-router-input/src/app/test.component.ts
@@ -1,22 +1,21 @@
-import { AsyncPipe } from '@angular/common';
-import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-import { map } from 'rxjs';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  input,
+  InputSignal,
+} from '@angular/core';
 
 @Component({
   selector: 'app-subscription',
-  imports: [AsyncPipe],
   changeDetection: ChangeDetectionStrategy.Eager,
   template: `
-    <div>TestId: {{ testId$ | async }}</div>
-    <div>Permission: {{ permission$ | async }}</div>
-    <div>User: {{ user$ | async }}</div>
+    <div>TestId: {{ testId() }}</div>
+    <div>Permission: {{ permission() }}</div>
+    <div>User: {{ user() }}</div>
   `,
 })
 export default class TestComponent {
-  private activatedRoute = inject(ActivatedRoute);
-
-  testId$ = this.activatedRoute.params.pipe(map((p) => p['testId']));
-  permission$ = this.activatedRoute.data.pipe(map((d) => d['permission']));
-  user$ = this.activatedRoute.queryParams.pipe(map((q) => q['user']));
+  public testId: InputSignal<string> = input<string>('');
+  public permission: InputSignal<string> = input<string>('');
+  public user: InputSignal<string> = input<string>('');
 }

From 037643b8763d037ab28c2ca675db9a7ef96cc4ac Mon Sep 17 00:00:00 2001
From: jpaberzs <janis.paberzs18@gmail.com>
Date: Sun, 30 Aug 2026 20:04:22 +0300
Subject: [PATCH 2/3] fix: fixed code review comment

---
 apps/angular/22-router-input/src/app/test.component.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/angular/22-router-input/src/app/test.component.ts b/apps/angular/22-router-input/src/app/test.component.ts
index 8e686d1ae..69340d9a6 100644
--- a/apps/angular/22-router-input/src/app/test.component.ts
+++ b/apps/angular/22-router-input/src/app/test.component.ts
@@ -17,5 +17,5 @@ import {
 export default class TestComponent {
   public testId: InputSignal<string> = input<string>('');
   public permission: InputSignal<string> = input<string>('');
-  public user: InputSignal<string> = input<string>('');
+  public user: InputSignal<string | undefined> = input<string | undefined>('');
 }

From f1ccf29483ead90532d10bd0527f4f0cac47df66 Mon Sep 17 00:00:00 2001
From: jpaberzs <janis.paberzs18@gmail.com>
Date: Sun, 30 Aug 2026 20:05:54 +0300
Subject: [PATCH 3/3] fix: fixed code review comment

---
 apps/angular/22-router-input/src/app/test.component.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/angular/22-router-input/src/app/test.component.ts b/apps/angular/22-router-input/src/app/test.component.ts
index 69340d9a6..f7ee44f0b 100644
--- a/apps/angular/22-router-input/src/app/test.component.ts
+++ b/apps/angular/22-router-input/src/app/test.component.ts
@@ -7,7 +7,7 @@ import {
 
 @Component({
   selector: 'app-subscription',
-  changeDetection: ChangeDetectionStrategy.Eager,
+  changeDetection: ChangeDetectionStrategy.OnPush,
   template: `
     <div>TestId: {{ testId() }}</div>
     <div>Permission: {{ permission() }}</div>