Bugfix for change detection and schema fields.

src/Squidex/app/features/content/shared/assets-editor.component.ts

@@ -65,24 +65,24 @@ export class AssetsEditorComponent implements ControlValueAccessor {
                             this.updateValue();
                         }
 
-                        this.changeDetector.detectChanges();
+                        this.changeDetector.markForCheck();
                     }, () => {
                         this.oldAssets = ImmutableArray.empty();
 
-                        this.changeDetector.detectChanges();
+                        this.changeDetector.markForCheck();
                     });
             }
         } else {
             this.oldAssets = ImmutableArray.empty();
 
-            this.changeDetector.detectChanges();
+            this.changeDetector.markForCheck();
         }
     }
 
     public setDisabledState(isDisabled: boolean): void {
         this.isDisabled = isDisabled;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public registerOnChange(fn: any) {
@@ -140,7 +140,7 @@ export class AssetsEditorComponent implements ControlValueAccessor {
         this.callTouched();
         this.callChange(ids);
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public sort(assets: AssetDto[]) {

src/Squidex/app/features/content/shared/references-editor.component.ts

@@ -74,11 +74,11 @@ export class ReferencesEditorComponent implements ControlValueAccessor, OnInit {
             .subscribe(dto => {
                 this.schema = dto;
 
-                this.changeDetector.detectChanges();
+                this.changeDetector.markForCheck();
             }, () => {
                 this.isInvalidSchema = true;
 
-                this.changeDetector.detectChanges();
+                this.changeDetector.markForCheck();
             });
     }
 
@@ -95,24 +95,24 @@ export class ReferencesEditorComponent implements ControlValueAccessor, OnInit {
                             this.updateValue();
                         }
 
-                        this.changeDetector.detectChanges();
+                        this.changeDetector.markForCheck();
                     }, () => {
                         this.contentItems = ImmutableArray.empty();
 
-                        this.changeDetector.detectChanges();
+                        this.changeDetector.markForCheck();
                     });
             }
         } else {
             this.contentItems = ImmutableArray.empty();
 
-            this.changeDetector.detectChanges();
+            this.changeDetector.markForCheck();
         }
     }
 
     public setDisabledState(isDisabled: boolean): void {
         this.isDisabled = isDisabled;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public registerOnChange(fn: any) {
@@ -161,6 +161,6 @@ export class ReferencesEditorComponent implements ControlValueAccessor, OnInit {
         this.callTouched();
         this.callChange(ids);
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 }

src/Squidex/app/features/schemas/pages/schema/field.component.ts

@@ -5,7 +5,7 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
 import { FormBuilder } from '@angular/forms';
 import { onErrorResumeNext } from 'rxjs/operators';
 
@@ -32,7 +32,7 @@ import {
         fadeAnimation
     ]
 })
-export class FieldComponent implements OnInit {
+export class FieldComponent implements OnChanges {
     @Input()
     public field: NestedFieldDto | RootFieldDto;
 
@@ -50,7 +50,7 @@ export class FieldComponent implements OnInit {
     public isEditing = false;
     public selectedTab = 0;
 
-    public editForm: EditFieldForm;
+    public editForm = new EditFieldForm(this.formBuilder);
 
     public addFieldDialog = new DialogModel();
 
@@ -60,8 +60,8 @@ export class FieldComponent implements OnInit {
     ) {
     }
 
-    public ngOnInit() {
+    public ngOnChanges(changes: SimpleChanges) {
-        this.editForm = new EditFieldForm(this.formBuilder);
+        if (changes['field']) {
             this.editForm.load(this.field.properties);
 
             if (this.field.isLocked) {
@@ -69,16 +69,24 @@ export class FieldComponent implements OnInit {
             }
         }
 
-    public toggleEditing() {
+        if (changes['schema']) {
-        this.isEditing = !this.isEditing;
+            this.isEditing = false;
+
+            this.selectedTab = 0;
+        }
     }
 
     public selectTab(tab: number) {
         this.selectedTab = tab;
     }
 
+    public toggleEditing() {
+        this.isEditing = !this.isEditing;
+    }
+
     public cancel() {
         this.isEditing = false;
+
         this.editForm.load(this.field);
     }
 

src/Squidex/app/framework/angular/forms/control-errors.component.ts

@@ -152,6 +152,6 @@ export class ControlErrorsComponent implements OnChanges, OnDestroy {
 
         this.errorMessages = errors;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 }

src/Squidex/app/framework/angular/forms/date-time-editor.component.ts

@@ -122,7 +122,7 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy,
             this.timeControl.enable({ emitEvent: false });
         }
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public registerOnChange(fn: any) {
@@ -144,7 +144,7 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy,
                 this.updateValue();
                 this.touched();
 
-                this.changeDetector.detectChanges();
+                this.changeDetector.markForCheck();
             }
         });
 

src/Squidex/app/framework/angular/forms/dropdown.component.ts

@@ -68,13 +68,13 @@ export class DropdownComponent implements AfterContentInit, ControlValueAccessor
     public writeValue(obj: any) {
         this.selectIndex(this.items && obj ? this.items.indexOf(obj) : 0);
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public setDisabledState(isDisabled: boolean): void {
         this.isDisabled = isDisabled;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public registerOnChange(fn: any) {

src/Squidex/app/framework/angular/forms/slider.component.ts

@@ -59,13 +59,13 @@ export class SliderComponent implements ControlValueAccessor {
 
         this.updateThumbPosition();
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public setDisabledState(isDisabled: boolean): void {
         this.isDisabled = isDisabled;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public registerOnChange(fn: any) {

src/Squidex/app/framework/angular/forms/tag-editor.component.ts

@@ -185,7 +185,7 @@ export class TagEditorComponent implements AfterViewInit, ControlValueAccessor,
             this.items = [];
         }
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public setDisabledState(isDisabled: boolean): void {

src/Squidex/app/framework/angular/forms/toggle.component.ts

@@ -36,13 +36,13 @@ export class ToggleComponent implements ControlValueAccessor {
     public writeValue(obj: any) {
         this.isChecked = Types.isBoolean(obj) ? obj : null;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public setDisabledState(isDisabled: boolean): void {
         this.isDisabled = isDisabled;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     public registerOnChange(fn: any) {

src/Squidex/app/framework/angular/modals/dialog-renderer.component.ts

@@ -56,7 +56,7 @@ export class DialogRendererComponent implements OnDestroy, OnInit {
                 if (!isOpen) {
                     this.cancel();
 
-                    this.changeDetector.detectChanges();
+                    this.changeDetector.markForCheck();
                 }
             });
 
@@ -70,7 +70,7 @@ export class DialogRendererComponent implements OnDestroy, OnInit {
                     }, notification.displayTime);
                 }
 
-                this.changeDetector.detectChanges();
+                this.changeDetector.markForCheck();
             });
 
         this.dialogsSubscription =
@@ -81,7 +81,7 @@ export class DialogRendererComponent implements OnDestroy, OnInit {
                     this.dialogRequest = request;
                     this.dialogView.show();
 
-                    this.changeDetector.detectChanges();
+                    this.changeDetector.markForCheck();
                 });
     }
 
@@ -107,7 +107,7 @@ export class DialogRendererComponent implements OnDestroy, OnInit {
         if (index >= 0) {
             this.notifications.splice(index, 1);
 
-            this.changeDetector.detectChanges();
+            this.changeDetector.markForCheck();
         }
     }
 }

src/Squidex/app/framework/angular/modals/modal-dialog.component.ts

@@ -64,6 +64,6 @@ export class ModalDialogComponent implements AfterViewInit {
         this.hasTabs = this.tabsElement.nativeElement.children.length > 0;
         this.hasFooter = this.footerElement.nativeElement.children.length > 0;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 }

src/Squidex/app/framework/angular/modals/onboarding-tooltip.component.ts

@@ -75,7 +75,7 @@ export class OnboardingTooltipComponent implements OnDestroy, OnInit {
                     if (this.isSameOrParent(fromPoint)) {
                         this.tooltipModal.show();
 
-                        this.changeDetector.detectChanges();
+                        this.changeDetector.markForCheck();
 
                         this.closeTimer = setTimeout(() => {
                             this.hideThis();

src/Squidex/app/framework/angular/modals/tooltip.component.ts

@@ -54,7 +54,7 @@ export class TooltipComponent implements OnDestroy, OnInit {
                 this.renderer.listen(this.target, 'mouseenter', () => {
                     this.modal.show();
 
-                    this.changeDetector.detectChanges();
+                    this.changeDetector.markForCheck();
                 });
 
             this.targetMouseLeaveListener =

src/Squidex/app/shared/components/asset.component.ts

@@ -213,7 +213,7 @@ export class AssetComponent implements OnDestroy, OnInit {
     private setProgress(progress: number) {
         this.progress = progress;
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     private updateAsset(asset: AssetDto, emitEvent: boolean) {
@@ -228,6 +228,6 @@ export class AssetComponent implements OnDestroy, OnInit {
 
         this.renameCancel();
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 }

src/Squidex/app/shared/components/geolocation-editor.component.ts

@@ -105,7 +105,7 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi
             this.geolocationForm.enable();
         }
 
-        this.changeDetector.detectChanges();
+        this.changeDetector.markForCheck();
     }
 
     private setDisabledStateOSM(isDisabled: boolean): void {

src/Squidex/app/shell/pages/internal/profile-menu.component.ts

@@ -57,7 +57,7 @@ export class ProfileMenuComponent implements OnDestroy, OnInit {
 
                     this.isAdmin = user!.isAdmin;
 
-                    this.changeDetector.detectChanges();
+                    this.changeDetector.markForCheck();
                 });
     }