added paperless ui

src-ui/src/app/components/common/toasts/toasts.component.css

@@ -0,0 +1,7 @@
+:host {
+  position: fixed;
+  top: 0;
+  right: 0;
+  margin: 0.5em;
+  z-index: 1200;
+}

src-ui/src/app/components/common/toasts/toasts.component.html

@@ -0,0 +1,6 @@
+<ngb-toast
+  *ngFor="let toast of toasts"
+  [header]="toast.title" [autohide]="true" [delay]="toast.delay"
+  (hide)="toastService.closeToast(toast)">
+  {{toast.content}}
+</ngb-toast>

src-ui/src/app/components/common/toasts/toasts.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ToastsComponent } from './toasts.component';
+
+describe('ToastsComponent', () => {
+  let component: ToastsComponent;
+  let fixture: ComponentFixture<ToastsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ToastsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ToastsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src-ui/src/app/components/common/toasts/toasts.component.ts

@@ -0,0 +1,26 @@
+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { Subscription } from 'rxjs';
+import { Toast, ToastService } from 'src/app/services/toast.service';
+
+@Component({
+  selector: 'app-toasts',
+  templateUrl: './toasts.component.html',
+  styleUrls: ['./toasts.component.css']
+})
+export class ToastsComponent implements OnInit, OnDestroy {
+
+  constructor(private toastService: ToastService) { }
+
+  subscription: Subscription
+
+  toasts: Toast[] = []
+
+  ngOnDestroy(): void {
+    this.subscription.unsubscribe()
+  }
+
+  ngOnInit(): void {
+    this.subscription = this.toastService.getToasts().subscribe(toasts => this.toasts = toasts)
+  }
+
+}