feat: add notification functionality

src/app/app.html

@@ -1 +1,4 @@
+@if(this.showNotification()) {
+    <app-notification></app-notification>
+}
 <router-outlet></router-outlet>

src/app/app.spec.ts

@@ -2,19 +2,29 @@ import { TestBed } from '@angular/core/testing';
 import { App } from './app';
 import { strings } from './strings';
 import { STRINGS_INJECTOR } from './app.config';
+import { Notifier } from './services/notifier';
+import { signal } from '@angular/core';
 
 describe('App', () => {
+  let notifier: jasmine.SpyObj<Notifier>;
+
   beforeEach(async () => {
+    notifier = jasmine.createSpyObj(Notifier.name, [], {
+      notification$: signal<Notification | null>(null),
+    });
     await TestBed.configureTestingModule({
       imports: [App],
-      providers: [{ provide: STRINGS_INJECTOR, useValue: strings }],
+      providers: [
+        { provide: STRINGS_INJECTOR, useValue: strings },
+        { provide: Notifier, useValue: notifier },
+      ],
     }).compileComponents();
   });
 
   it('should create the app', () => {
     const fixture = TestBed.createComponent(App);
     const app = fixture.componentInstance;
+    TestBed.tick();
     expect(app).toBeTruthy();
   });
-
 });

src/app/app.ts

@@ -1,11 +1,15 @@
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { RouterOutlet } from '@angular/router';
+import { Notification } from './components/notification/notification';
+import { Notifier } from './services/notifier';
+import { computed } from '@angular/core';
 @Component({
   selector: 'app-root',
-  imports: [RouterOutlet],
+  imports: [RouterOutlet, Notification],
   templateUrl: './app.html',
   styleUrl: './app.scss',
 })
 export class App {
-  
+  private readonly notifier = inject(Notifier);
+  showNotification = computed(() => this.notifier.notification$() !== null);
 }