From 5637b1ee1a57b225f1597b393741da8e60324efd Mon Sep 17 00:00:00 2001
From: Simon <simon@aam-digital.com>
Date: Tue, 2 Aug 2022 12:27:32 +0200
Subject: [PATCH 1/4] fix: permissions are correctly applied in popup form

---
 .../row-details/row-details.component.html             |  5 +----
 .../row-details/row-details.component.spec.ts          |  6 ++++++
 .../row-details/row-details.component.ts               | 10 +++++++++-
 3 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html
index 3b069f67c8..80289c4541 100644
--- a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html
+++ b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html
@@ -60,16 +60,13 @@
   <button
     mat-raised-button
     (click)="save()"
-    *appDisabledEntityOperation="{
-      operation: 'update',
-      entity: data.entity
-    }"
     i18n="Save button for forms"
   >
     Save
   </button>
 
   <button
+    *ngIf="editMode === 'update'"
     mat-icon-button
     [matMenuTriggerFor]="additional"
   >
diff --git a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.spec.ts b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.spec.ts
index 1eb9409826..353d74dee4 100644
--- a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.spec.ts
+++ b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.spec.ts
@@ -16,6 +16,7 @@ import { EntitySubrecordModule } from "../entity-subrecord.module";
 import { FontAwesomeTestingModule } from "@fortawesome/angular-fontawesome/testing";
 import { EntityFormService } from "../../entity-form/entity-form.service";
 import { AlertService } from "../../../alerts/alert.service";
+import { EntityAbility } from "../../../permissions/ability/entity-ability";
 
 describe("RowDetailsComponent", () => {
   let component: RowDetailsComponent<any>;
@@ -37,6 +38,7 @@ describe("RowDetailsComponent", () => {
         { provide: MatDialogRef, useValue: {} },
       ],
     }).compileComponents();
+    spyOn(TestBed.inject(EntityAbility), "cannot").and.returnValue(true);
   });
 
   beforeEach(() => {
@@ -77,4 +79,8 @@ describe("RowDetailsComponent", () => {
     expect(alertSpy).toHaveBeenCalledWith(message);
     expect(closeSpy).not.toHaveBeenCalled();
   }));
+
+  it("should not disable the form when creating a new entity", () => {
+    expect(component.form.disabled).toBeFalsy();
+  });
 });
diff --git a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.ts b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.ts
index d1e64bbd39..88420a1c97 100644
--- a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.ts
+++ b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.ts
@@ -12,6 +12,7 @@ import {
   RemoveResult,
 } from "../../../entity/entity-remove.service";
 import { AlertService } from "../../../alerts/alert.service";
+import { EntityAction } from "../../../permissions/permission-types";
 
 /**
  * Data interface that must be given when opening the dialog
@@ -38,6 +39,7 @@ export class RowDetailsComponent<E extends Entity> {
 
   viewOnlyColumns: FormFieldConfig[];
   tempEntity: Entity;
+  editMode: EntityAction = "update";
 
   constructor(
     @Inject(MAT_DIALOG_DATA) public data: DetailsComponentData<E>,
@@ -48,7 +50,13 @@ export class RowDetailsComponent<E extends Entity> {
     private alertService: AlertService
   ) {
     this.form = this.formService.createFormGroup(data.columns, data.entity);
-    if (this.ability.cannot("update", data.entity)) {
+    if (!this.data.entity._rev) {
+      this.editMode = "create";
+    }
+    if (
+      this.editMode === "update" &&
+      this.ability.cannot("update", data.entity)
+    ) {
       this.form.disable();
     }
     this.tempEntity = this.data.entity;

From 984063aba681a6d43aa6e01fa0a3b32b69788f4e Mon Sep 17 00:00:00 2001
From: Simon <simon@aam-digital.com>
Date: Tue, 2 Aug 2022 12:37:09 +0200
Subject: [PATCH 2/4] correctly disabling save button

---
 .../entity-subrecord/row-details/row-details.component.html      | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html
index 80289c4541..c31553ff53 100644
--- a/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html
+++ b/src/app/core/entity-components/entity-subrecord/row-details/row-details.component.html
@@ -60,6 +60,7 @@
   <button
     mat-raised-button
     (click)="save()"
+    [disabled]="form.disabled"
     i18n="Save button for forms"
   >
     Save

From c8c9e2b2b5bcca7d61fd2305ece55dffceea1586 Mon Sep 17 00:00:00 2001
From: Simon <simon@aam-digital.com>
Date: Tue, 2 Aug 2022 12:45:33 +0200
Subject: [PATCH 3/4] fixed bug where editing newly created activities removes
 them from the table

---
 .../activities-overview.component.ts            | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts
index 5f11e79e02..f1b365e981 100644
--- a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts
+++ b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts
@@ -24,30 +24,31 @@ export class ActivitiesOverviewComponent implements OnInitDynamicComponent {
   entity: Entity;
   records: RecurringActivity[] = [];
   listConfig: EntityListConfig;
-  activityConstructor = RecurringActivity;
 
   constructor(private entityMapper: EntityMapperService) {}
 
-  async onInitFromDynamicConfig(config: any) {
+  onInitFromDynamicConfig(config: any) {
     if (config?.config?.columns) {
       this.columns = config.config.columns;
     }
 
     this.entity = config.entity;
-    this.records = (
-      await this.entityMapper.loadType<RecurringActivity>(RecurringActivity)
-    ).filter((activity) => activity.linkedGroups.includes(this.entity.getId()));
+    this.initializeRelatedActivities();
     this.entityMapper
       .receiveUpdates(RecurringActivity)
       .subscribe((updateEntity) => {
         if (updateEntity.type === "update") {
-          this.records = this.records.filter((activity) =>
-            activity.linkedGroups.includes(this.entity.getId())
-          );
+          this.initializeRelatedActivities();
         }
       });
   }
 
+  private async initializeRelatedActivities() {
+    this.records = (
+      await this.entityMapper.loadType<RecurringActivity>(RecurringActivity)
+    ).filter((activity) => activity.linkedGroups.includes(this.entity.getId()));
+  }
+
   generateNewRecordFactory(): () => RecurringActivity {
     return () => {
       const newRecurringActivity = new RecurringActivity();

From 967d3ee572a538cf5ee31af67b39edafc4078757 Mon Sep 17 00:00:00 2001
From: Simon <simon@aam-digital.com>
Date: Thu, 4 Aug 2022 20:25:36 +0200
Subject: [PATCH 4/4] using more performant update logic

---
 .../activities-overview.component.html        |  2 +-
 .../activities-overview.component.spec.ts     | 24 ++++++++++++++-----
 .../activities-overview.component.ts          | 20 +++++++++-------
 .../entity-subrecord.component.ts             | 12 +++++++---
 4 files changed, 39 insertions(+), 19 deletions(-)

diff --git a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.html b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.html
index 6d80f2895a..4e38fbac19 100644
--- a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.html
+++ b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.html
@@ -1,5 +1,5 @@
 <app-entity-subrecord
-  [records]="records"
+  [(records)]="records"
   [columns]="columns"
   [getBackgroundColor]="null"
   [newRecordFactory]="generateNewRecordFactory()"
diff --git a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.spec.ts b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.spec.ts
index 252b79e2f3..e8a61c364a 100644
--- a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.spec.ts
+++ b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.spec.ts
@@ -1,4 +1,9 @@
-import { ComponentFixture, TestBed } from "@angular/core/testing";
+import {
+  ComponentFixture,
+  fakeAsync,
+  TestBed,
+  tick,
+} from "@angular/core/testing";
 import { RecurringActivity } from "app/child-dev-project/attendance/model/recurring-activity";
 import { EntityMapperService } from "app/core/entity/entity-mapper.service";
 import {
@@ -10,6 +15,8 @@ import { Subject } from "rxjs";
 import { School } from "../model/school";
 
 import { ActivitiesOverviewComponent } from "./activities-overview.component";
+import { SchoolsModule } from "../schools.module";
+import { MockedTestingModule } from "../../../utils/mocked-testing.module";
 
 describe("ActivitiesOverviewComponent", () => {
   let component: ActivitiesOverviewComponent;
@@ -20,7 +27,7 @@ describe("ActivitiesOverviewComponent", () => {
   beforeEach(async () => {
     entityMapper = mockEntityMapper();
     await TestBed.configureTestingModule({
-      declarations: [ActivitiesOverviewComponent],
+      imports: [SchoolsModule, MockedTestingModule.withState()],
       providers: [{ provide: EntityMapperService, useValue: entityMapper }],
     }).compileComponents();
   });
@@ -28,6 +35,7 @@ describe("ActivitiesOverviewComponent", () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(ActivitiesOverviewComponent);
     component = fixture.componentInstance;
+    component.entity = new School();
     fixture.detectChanges();
   });
 
@@ -55,20 +63,24 @@ describe("ActivitiesOverviewComponent", () => {
     expect(newRecurringActivity().linkedGroups).toEqual(["school1"]);
   });
 
-  it("should remove the recurring activity from the table view if the current school is removed as a group of this recurring activity", async () => {
+  it("should remove the recurring activity from the table view if the current school is removed as a group of this recurring activity", fakeAsync(() => {
     const school1 = new School("school1");
     const activity1 = new RecurringActivity();
     activity1.linkedGroups = ["school1"];
     const activity2 = new RecurringActivity();
-    activity1.linkedGroups = ["school1", "school2", "school3"];
+    activity2.linkedGroups = ["school1", "school2", "school3"];
     entityMapper.addAll([activity1, activity2]);
     const subject = new Subject<UpdatedEntity<RecurringActivity>>();
     spyOn(entityMapper, "receiveUpdates").and.returnValue(subject);
-    await component.onInitFromDynamicConfig({ entity: school1 });
+    component.onInitFromDynamicConfig({ entity: school1 });
+    tick();
+
+    expect(component.records).toEqual([activity1, activity2]);
 
     activity2.linkedGroups = ["school2", "school3"];
     subject.next({ entity: activity2, type: "update" });
+    tick();
 
     expect(component.records).toEqual([activity1]);
-  });
+  }));
 });
diff --git a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts
index f1b365e981..9d6f091cf7 100644
--- a/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts
+++ b/src/app/child-dev-project/schools/activities-overview/activities-overview.component.ts
@@ -6,6 +6,7 @@ import { EntityMapperService } from "app/core/entity/entity-mapper.service";
 import { Entity } from "app/core/entity/model/entity";
 import { DynamicComponent } from "app/core/view/dynamic-components/dynamic-component.decorator";
 import { OnInitDynamicComponent } from "app/core/view/dynamic-components/on-init-dynamic-component.interface";
+import { delay } from "rxjs";
 
 @DynamicComponent("ActivitiesOverview")
 @Component({
@@ -27,28 +28,29 @@ export class ActivitiesOverviewComponent implements OnInitDynamicComponent {
 
   constructor(private entityMapper: EntityMapperService) {}
 
-  onInitFromDynamicConfig(config: any) {
+  async onInitFromDynamicConfig(config: any) {
     if (config?.config?.columns) {
       this.columns = config.config.columns;
     }
 
     this.entity = config.entity;
-    this.initializeRelatedActivities();
+    this.records = (
+      await this.entityMapper.loadType<RecurringActivity>(RecurringActivity)
+    ).filter((activity) => activity.linkedGroups.includes(this.entity.getId()));
+
     this.entityMapper
       .receiveUpdates(RecurringActivity)
+      // using short delay to make sure the EntitySubrecord's `receiveUpdates` code is executed before this
+      .pipe(delay(0))
       .subscribe((updateEntity) => {
         if (updateEntity.type === "update") {
-          this.initializeRelatedActivities();
+          this.records = this.records.filter((activity) =>
+            activity.linkedGroups.includes(this.entity.getId())
+          );
         }
       });
   }
 
-  private async initializeRelatedActivities() {
-    this.records = (
-      await this.entityMapper.loadType<RecurringActivity>(RecurringActivity)
-    ).filter((activity) => activity.linkedGroups.includes(this.entity.getId()));
-  }
-
   generateNewRecordFactory(): () => RecurringActivity {
     return () => {
       const newRecurringActivity = new RecurringActivity();
diff --git a/src/app/core/entity-components/entity-subrecord/entity-subrecord/entity-subrecord.component.ts b/src/app/core/entity-components/entity-subrecord/entity-subrecord/entity-subrecord.component.ts
index 890f03800e..c7562bb660 100644
--- a/src/app/core/entity-components/entity-subrecord/entity-subrecord/entity-subrecord.component.ts
+++ b/src/app/core/entity-components/entity-subrecord/entity-subrecord/entity-subrecord.component.ts
@@ -1,8 +1,10 @@
 import {
   Component,
+  EventEmitter,
   Input,
   OnChanges,
   OnInit,
+  Output,
   SimpleChanges,
   ViewChild,
 } from "@angular/core";
@@ -72,9 +74,9 @@ export class EntitySubrecordComponent<T extends Entity>
   _columns: FormFieldConfig[] = [];
   filteredColumns: FormFieldConfig[] = [];
 
-  /** data to be displayed */
+  /** data to be displayed, can also be used as two-way-binding */
   @Input()
-  set records(value: Array<T>) {
+  set records(value: T[]) {
     this._records = value;
     this.recordsDataSource.data = this._records.map((rec) => {
       return {
@@ -86,7 +88,9 @@ export class EntitySubrecordComponent<T extends Entity>
         new (this._records[0].getConstructor() as EntityConstructor<T>)();
     }
   }
-  private _records: Array<T> = [];
+  private _records: T[] = [];
+
+  @Output() recordsChange = new EventEmitter<T[]>();
 
   /**
    * factory method to create a new instance of the displayed Entity type
@@ -318,11 +322,13 @@ export class EntitySubrecordComponent<T extends Entity>
     this.records = this._records.filter(
       (rec) => rec.getId() !== deleted.getId()
     );
+    this.recordsChange.emit(this._records);
   }
 
   private addToTable(record: T) {
     // use setter so datasource is also updated
     this.records = [record].concat(this._records);
+    this.recordsChange.emit(this._records);
   }
 
   /**