feat(doc): move notifivation

apps/ngrx/notification/src/app/school/school.component.ts

@@ -0,0 +1,33 @@
+/* eslint-disable @angular-eslint/component-selector */
+import { AsyncPipe, NgFor } from '@angular/common';
+import { Component, inject } from '@angular/core';
+import { provideComponentStore } from '@ngrx/component-store';
+import { SchoolStore } from './school.store';
+
+@Component({
+  standalone: true,
+  imports: [NgFor, AsyncPipe],
+  providers: [provideComponentStore(SchoolStore)],
+  selector: 'school',
+  template: `
+    <h3>SCHOOL</h3>
+    <div *ngFor="let school of school$ | async">
+      {{ school.name }} - {{ school.version }}
+    </div>
+  `,
+  styles: [
+    `
+      :host {
+        display: block;
+        width: fit-content;
+        height: fit-content;
+        border: 1px solid red;
+        padding: 4px;
+      }
+    `,
+  ],
+})
+export class SchoolComponent {
+  private store = inject(SchoolStore);
+  school$ = this.store.schools$;
+}

apps/ngrx/notification/src/app/school/school.store.ts

@@ -0,0 +1,48 @@
+import { School } from '@angular-challenges/ngrx-notification/model';
+import { Injectable } from '@angular/core';
+import {
+  ComponentStore,
+  OnStoreInit,
+  tapResponse,
+} from '@ngrx/component-store';
+import { pipe, switchMap } from 'rxjs';
+import { HttpService } from '../data-access/http.service';
+
+@Injectable()
+export class SchoolStore
+  extends ComponentStore<{ schools: School[] }>
+  implements OnStoreInit
+{
+  readonly schools$ = this.select((state) => state.schools);
+
+  constructor(private httpService: HttpService) {
+    super({ schools: [] });
+  }
+
+  addSchool = this.updater((state, school: School) => ({
+    ...state,
+    schools: [...state.schools, school],
+  }));
+
+  updateSchool = this.updater((state, school: School) => ({
+    ...state,
+    schools: state.schools.map((t) => (t.id === school.id ? school : t)),
+  }));
+
+  private readonly loadSchools = this.effect<void>(
+    pipe(
+      switchMap(() =>
+        this.httpService.getAllSchools().pipe(
+          tapResponse(
+            (schools) => this.patchState({ schools }),
+            (_) => _
+          )
+        )
+      )
+    )
+  );
+
+  ngrxOnStoreInit() {
+    this.loadSchools();
+  }
+}