feat(devtools): add a demo pipe with ngOnDestroy

src/app/demo-app/todo/home/home.module.ts

@@ -5,6 +5,7 @@ import { TodoComponent } from './todos/todo/todo.component';
 import { TodosFilter } from './todos/todos.pipe';
 import { TooltipDirective } from './todos/todo/tooltip.directive';
 import { CommonModule } from '@angular/common';
+import { SamplePipe } from './sample.pipe';
 
 @NgModule({
   imports: [
@@ -17,7 +18,7 @@ import { CommonModule } from '@angular/common';
       },
     ]),
   ],
-  declarations: [TodosComponent, TodoComponent, TodosFilter, TooltipDirective],
+  declarations: [SamplePipe, TodosComponent, TodoComponent, TodosFilter, TooltipDirective],
   exports: [TodosComponent],
 })
 export class HomeModule {}

src/app/demo-app/todo/home/sample.pipe.ts

@@ -0,0 +1,15 @@
+import { Pipe, OnDestroy, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'sample',
+  pure: false,
+})
+export class SamplePipe implements PipeTransform, OnDestroy {
+  transform(val: any): void {
+    return val;
+  }
+
+  ngOnDestroy(): void {
+    console.log('Destroying');
+  }
+}

src/app/demo-app/todo/home/todos/todos.component.html

@@ -2,6 +2,8 @@
 <a [routerLink]="">Home</a>
 <a [routerLink]="">Home</a>
 
+<p>{{ 'Sample text processed by a pipe' | sample }}</p>
+
 <section class="todoapp">
   <header class="header">
     <h1>todos</h1>