Add "Clear All" functionality for persons

src/app/persons/components/person-list/person-list.component.html

@@ -6,7 +6,16 @@
             caption="Add person"
             (click)="onAdd(content)">
     </button>
+
     <app-person-sort-buttons/>
+
+    @if ((personsCount$ | async)! > 0) {
+      <button app-delete-button
+              caption="Clear all persons"
+              confirmationMessage="Are you sure you want to clear all persons?"
+              (deleteConfirmed)="onDeleteAll()">
+      </button>
+    }
   </div>
 
   <div class="d-flex gap-2">

src/app/persons/components/person-list/person-list.component.ts

@@ -14,6 +14,7 @@ import {PersonSortButtonsComponent} from '../../../shared/components/person-sort
 import {PersonSlotFilterComponent} from '../../../shared/components/person-slot-filter/person-slot-filter.component';
 import {SearchFieldComponent} from '../../../shared/components/search-field/search-field.component';
 import {map} from 'rxjs';
+import {DeleteButtonComponent} from '../../../shared/components/delete-button/delete-button.component';
 
 
 @Component({
@@ -29,7 +30,8 @@ import {map} from 'rxjs';
     AddButtonComponent,
     PersonSortButtonsComponent,
     PersonSlotFilterComponent,
-    SearchFieldComponent
+    SearchFieldComponent,
+    DeleteButtonComponent
   ],
   templateUrl: './person-list.component.html',
   styleUrl: './person-list.component.scss'
@@ -79,6 +81,11 @@ export class PersonListComponent {
   }
 
 
+  protected onDeleteAll() {
+    this.personService.removeAllPersons();
+  }
+
+
   private openOffcanvas(content: TemplateRef<any>, title: string) {
     this.offcanvasTitle = title;
 

src/app/persons/services/person.service.ts

@@ -127,6 +127,11 @@ export class PersonService {
   }
 
 
+  public removeAllPersons() {
+    this.persons.forEach(p => this.removePerson(p));
+  }
+
+
   public addAvailablePerson(person: Person) {
     this.availablePersons = this.availablePersons.concat(person);
     this.sortAvailablePersons(this.nameSortOrder(), this.slotSortOrder());

src/app/prior-knowledge/components/prior-knowledge-list/prior-knowledge-list.component.html

@@ -7,10 +7,12 @@
             (click)="onAdd(content)">
     </button>
 
-    <button app-delete-button caption="Clear all prior knowledge"
-            confirmationMessage="Are you sure you want to clear all prior knowledge?"
-            (deleteConfirmed)="onDeleteAll()">
-    </button>
+    @if ((knowledgeList$ | async)!.length > 0) {
+      <button app-delete-button caption="Clear all prior knowledge"
+              confirmationMessage="Are you sure you want to clear all prior knowledge?"
+              (deleteConfirmed)="onDeleteAll()">
+      </button>
+    }
   </div>
 </div>
 

src/app/prior-knowledge/components/prior-knowledge-list/prior-knowledge-list.component.ts

@@ -1,6 +1,5 @@
 import {Component, inject, TemplateRef} from '@angular/core';
 import {PriorKnowledgeService} from '../../services/prior-knowledge.service';
-import {AsyncPipe} from '@angular/common';
 import {PriorKnowledgeViewComponent} from '../prior-knowledge-view/prior-knowledge-view.component';
 import {createPriorKnowledge, PriorKnowledge} from '../../models/prior-knowledge.model';
 import {NgbOffcanvas, NgbOffcanvasOptions} from '@ng-bootstrap/ng-bootstrap';
@@ -9,18 +8,19 @@ import {DataNotAvailableInfoComponent} from "../../../shared/components/data-not
 import {DataNotAvailableViewComponent} from '../../../shared/components/data-not-available-view/data-not-available-view.component';
 import {AddButtonComponent} from "../../../shared/components/add-button/add-button.component";
 import {DeleteButtonComponent} from "../../../shared/components/delete-button/delete-button.component";
+import {AsyncPipe} from '@angular/common';
 
 
 @Component({
   selector: 'app-prior-knowledge-list',
   imports: [
-    AsyncPipe,
     PriorKnowledgeViewComponent,
     PriorKnowledgeEditComponent,
     DataNotAvailableInfoComponent,
     DataNotAvailableViewComponent,
     AddButtonComponent,
-    DeleteButtonComponent
+    DeleteButtonComponent,
+    AsyncPipe
   ],
   templateUrl: './prior-knowledge-list.component.html',
   styleUrl: './prior-knowledge-list.component.scss'

src/app/timeslots/components/time-slot-list/time-slot-list.component.html

@@ -18,11 +18,13 @@
         </button>
       }
 
-      <button app-delete-button
-              caption="Clear all time slots"
-              confirmationMessage="Are you sure you want to clear all time slots?"
-              (deleteConfirmed)="onDeleteAll()">
-      </button>
+      @if ((timeSlotCount$ | async)! > 0) {
+        <button app-delete-button
+                caption="Clear all time slots"
+                confirmationMessage="Are you sure you want to clear all time slots?"
+                (deleteConfirmed)="onDeleteAll()">
+        </button>
+      }
     </div>
   </div>
 </div>