From 557824f5f1672625c0e43d6dc1e1a95439bd2c56 Mon Sep 17 00:00:00 2001
From: Sean <sean.f.t.engelhardt@gmail.com>
Date: Tue, 24 Mar 2020 15:53:26 +0100
Subject: [PATCH] Manual change detection for config list

Adds manual change detection to the config page.
Behaves better regarding "changed after checked" errors
---
 .../components/config-field/config-field.component.ts |  8 --------
 .../components/config-list/config-list.component.ts   | 11 +++++++++--
 2 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/client/src/app/site/config/components/config-field/config-field.component.ts b/client/src/app/site/config/components/config-field/config-field.component.ts
index d6df54966..239aa9874 100644
--- a/client/src/app/site/config/components/config-field/config-field.component.ts
+++ b/client/src/app/site/config/components/config-field/config-field.component.ts
@@ -325,14 +325,6 @@ export class ConfigFieldComponent extends BaseComponent implements OnInit, OnDes
                         this.sendUpdate(ev.target.getContent());
                     }
                 });
-                editor.on('Remove', ev => {
-                    // Do not save empty values on remove. This prevents losing the value on e.g.
-                    // fast navigation, when the editor is not fully loaded. Then the content is empty
-                    // and would trigger an update with empty data.
-                    if (ev.target.getContent() && ev.target.getContent() !== this.translatedValue) {
-                        this.sendUpdate(ev.target.getContent());
-                    }
-                });
             }
         };
     }
diff --git a/client/src/app/site/config/components/config-list/config-list.component.ts b/client/src/app/site/config/components/config-list/config-list.component.ts
index 309161323..c6b62bf57 100644
--- a/client/src/app/site/config/components/config-list/config-list.component.ts
+++ b/client/src/app/site/config/components/config-list/config-list.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnDestroy, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { Title } from '@angular/platform-browser';
 import { ActivatedRoute } from '@angular/router';
 
@@ -31,7 +31,8 @@ export interface ConfigItem {
 @Component({
     selector: 'os-config-list',
     templateUrl: './config-list.component.html',
-    styleUrls: ['./config-list.component.scss']
+    styleUrls: ['./config-list.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class ConfigListComponent extends BaseComponent implements CanComponentDeactivate, OnInit, OnDestroy {
     public configGroup: ConfigGroup;
@@ -51,6 +52,7 @@ export class ConfigListComponent extends BaseComponent implements CanComponentDe
     public constructor(
         protected titleService: Title,
         protected translate: TranslateService,
+        private cd: ChangeDetectorRef,
         private repo: ConfigRepositoryService,
         private route: ActivatedRoute,
         private promptDialog: PromptService
@@ -70,6 +72,7 @@ export class ConfigListComponent extends BaseComponent implements CanComponentDe
                     const groupName = this.translate.instant(configGroup.name);
                     super.setTitle(`${settings} - ${groupName}`);
                     this.configGroup = configGroup;
+                    this.cd.markForCheck();
                 }
             });
         });
@@ -89,16 +92,20 @@ export class ConfigListComponent extends BaseComponent implements CanComponentDe
         } else {
             this.configItems[index] = { key, value };
         }
+        this.cd.markForCheck();
     }
 
     /**
      * Saves every field in this config-group.
      */
     public saveAll(): void {
+        this.cd.detach();
         this.repo.bulkUpdate(this.configItems).then(result => {
             this.errors = result.errors;
             if (Object.keys(result.errors).length === 0) {
                 this.configItems = [];
+                this.cd.reattach();
+                this.cd.markForCheck();
             }
         });
     }