From 0695b082ef8e79b185240b54c7e075fba228953b Mon Sep 17 00:00:00 2001
From: Sebastian Stehle <sebastian@squidex.io>
Date: Fri, 28 Jun 2019 18:00:06 +0200
Subject: [PATCH] Improved modal view.

---
 .../workflows/workflows-page.component.ts      |  2 +-
 .../angular/forms/dropdown.component.ts        |  3 +++
 .../angular/modals/modal-view.directive.ts     | 18 +++++++++++++-----
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts
index 672d01ff8..a458bee00 100644
--- a/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts
+++ b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts
@@ -57,7 +57,7 @@ export class WorkflowsPageComponent implements OnInit {
     public addStep() {
         let index = this.workflow.steps.length;
 
-        for (let i = index; ;i++) {
+        for (let i = index; i < index + 100; i++) {
             const name = `Step${i}`;
 
             if (!this.workflow.getStep(name)) {
diff --git a/src/Squidex/app/framework/angular/forms/dropdown.component.ts b/src/Squidex/app/framework/angular/forms/dropdown.component.ts
index ea366b827..3e4451566 100644
--- a/src/Squidex/app/framework/angular/forms/dropdown.component.ts
+++ b/src/Squidex/app/framework/angular/forms/dropdown.component.ts
@@ -118,6 +118,9 @@ export class DropdownComponent extends StatefulControlComponent<State, any[]> im
         if (value !== this.snapshot.selectedItem) {
             selectedIndex = selectedIndex;
 
+            this.callChange(value);
+            this.callTouched();
+
             this.next(s => ({ ...s, selectedIndex, selectedItem: value }));
         }
 
diff --git a/src/Squidex/app/framework/angular/modals/modal-view.directive.ts b/src/Squidex/app/framework/angular/modals/modal-view.directive.ts
index 8a1cb1a28..f65d9ce71 100644
--- a/src/Squidex/app/framework/angular/modals/modal-view.directive.ts
+++ b/src/Squidex/app/framework/angular/modals/modal-view.directive.ts
@@ -6,7 +6,7 @@
  */
 
 import { ChangeDetectorRef, Directive, EmbeddedViewRef, Input, OnChanges, OnDestroy, Renderer2, SimpleChanges, TemplateRef, ViewContainerRef } from '@angular/core';
-import { Subscription } from 'rxjs';
+import { Subscription, timer } from 'rxjs';
 
 import {
     DialogModel,
@@ -22,6 +22,7 @@ import { RootViewComponent } from './root-view.component';
 export class ModalViewDirective implements OnChanges, OnDestroy {
     private subscription: Subscription | null = null;
     private documentClickListener: Function | null = null;
+    private documentClickTimer: Subscription | null = null;
     private renderedView: EmbeddedViewRef<any> | null = null;
 
     @Input('sqxModalView')
@@ -76,6 +77,8 @@ export class ModalViewDirective implements OnChanges, OnDestroy {
             return;
         }
 
+        this.unsubscribeToClick();
+
         if (isOpen && !this.renderedView) {
             const container = this.getContainer();
 
@@ -85,9 +88,9 @@ export class ModalViewDirective implements OnChanges, OnDestroy {
                 this.renderer.setStyle(this.renderedView.rootNodes[0], 'display', 'block');
             }
 
-            setTimeout(() => {
+            this.documentClickTimer = timer(1000, 0).subscribe(() => {
                 this.startListening();
-            }, 1000);
+            });
 
             this.changeDetector.detectChanges();
         } else if (!isOpen && this.renderedView) {
@@ -98,8 +101,6 @@ export class ModalViewDirective implements OnChanges, OnDestroy {
 
             this.renderedView = null;
 
-            this.unsubscribeToClick();
-
             this.changeDetector.detectChanges();
         }
     }
@@ -113,6 +114,8 @@ export class ModalViewDirective implements OnChanges, OnDestroy {
             return;
         }
 
+        this.unsubscribeToClick();
+
         this.documentClickListener =
             this.renderer.listen('document', 'click', (event: MouseEvent) => {
                 if (!event.target || this.renderedView === null) {
@@ -156,5 +159,10 @@ export class ModalViewDirective implements OnChanges, OnDestroy {
             this.documentClickListener();
             this.documentClickListener = null;
         }
+
+        if (this.documentClickTimer) {
+            this.documentClickTimer.unsubscribe();
+            this.documentClickTimer = null;
+        }
     }
 }
\ No newline at end of file