Merge pull request #370 from shamoon/fix/issue-350

Prevent close button in modal dialogs 'stealing' focus

src-ui/src/app/components/document-list/save-view-config-dialog/save-view-config-dialog.component.html

@@ -1,7 +1,7 @@
 <form [formGroup]="saveViewConfigForm" (ngSubmit)="save()">
   <div class="modal-header">
     <h4 class="modal-title" id="modal-basic-title" i18n>Save current view</h4>
-    <button type="button" class="close" aria-label="Close" (click)="cancel()">
+    <button type="button" [disabled]="!closeEnabled" class="close" aria-label="Close" (click)="cancel()">
       <span aria-hidden="true">&times;</span>
     </button>
   </div>

src-ui/src/app/components/document-list/save-view-config-dialog/save-view-config-dialog.component.ts

@@ -20,6 +20,8 @@ export class SaveViewConfigDialogComponent implements OnInit {
   @Input()
   buttonsEnabled = true
 
+  closeEnabled = false
+
   _defaultName = ""
 
   get defaultName() {
@@ -31,7 +33,7 @@ export class SaveViewConfigDialogComponent implements OnInit {
     this._defaultName = value
     this.saveViewConfigForm.patchValue({name: value})
   }
-  
+
   saveViewConfigForm = new FormGroup({
     name: new FormControl(''),
     showInSideBar: new FormControl(false),
@@ -39,6 +41,10 @@ export class SaveViewConfigDialogComponent implements OnInit {
   })
 
   ngOnInit(): void {
+    // wait to enable close button so it doesnt steal focus from input since its the first clickable element in the DOM
+    setTimeout(() => {
+      this.closeEnabled = true
+    });
   }
 
   save() {