mgr/dashboard: Fix NFS Edit page loading problem

We were trying to access a component that is only created
after the form loading is finished, before it was finished.

Fixes: https://tracker.ceph.com/issues/46276
Signed-off-by: Tiago Melo <tmelo@suse.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form-client/nfs-form-client.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form-client/nfs-form-client.component.ts
index 0c9bc088dc50cbd9dffaaddd6155f01609bb21f9..6415b1f80d9775bc8b5b859f3dff7b53d87c5a7b 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form-client/nfs-form-client.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form-client/nfs-form-client.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { FormArray, FormControl, NgForm, Validators } from '@angular/forms';
 
 import { I18n } from '@ngx-translate/i18n-polyfill';
@@ -13,16 +13,26 @@ import { CdFormGroup } from '../../../shared/forms/cd-form-group';
   templateUrl: './nfs-form-client.component.html',
   styleUrls: ['./nfs-form-client.component.scss']
 })
-export class NfsFormClientComponent {
+export class NfsFormClientComponent implements OnInit {
   @Input()
   form: CdFormGroup;
 
+  @Input()
+  clients: any[];
+
   nfsSquash: any[] = this.nfsService.nfsSquash;
   nfsAccessType: any[] = this.nfsService.nfsAccessType;
   icons = Icons;
 
   constructor(private nfsService: NfsService, private i18n: I18n) {}
 
+  ngOnInit() {
+    _.forEach(this.clients, (client) => {
+      const fg = this.addClient();
+      fg.patchValue(client);
+    });
+  }
+
   getNoAccessTypeDescr() {
     if (this.form.getValue('access_type')) {
       return `${this.form.getValue('access_type')} ${this.i18n('(inherited from global config)')}`;
@@ -77,13 +87,6 @@ export class NfsFormClientComponent {
     return client.getValue(control);
   }
 
-  resolveModel(clients: any[]) {
-    _.forEach(clients, (client) => {
-      const fg = this.addClient();
-      fg.patchValue(client);
-    });
-  }
-
   trackByFn(index: number) {
     return index;
   }

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.html
index df48700c607acac942cd5a596898f2e53140c8d0..8e37782cbc6cb03605c2d0cc5b4bbe03263cbe31 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.html
@@ -479,6 +479,7 @@
 
         <!-- Clients -->
         <cd-nfs-form-client [form]="nfsForm"
+                            [clients]="clients"
                             #nfsClients>
         </cd-nfs-form-client>
 

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.ts
index eb075741e7c625d2d6da8c3c138c8c295d6db1c7..8744ff51cdf7b277b34c27f992958ce4fa0db3f5 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/nfs/nfs-form/nfs-form.component.ts
@@ -34,6 +34,8 @@ export class NfsFormComponent extends CdForm implements OnInit {
   @ViewChild('nfsClients', { static: true })
   nfsClients: NfsFormClientComponent;
 
+  clients: any[] = [];
+
   permission: Permission;
   nfsForm: CdFormGroup;
   isEdit = false;
@@ -266,7 +268,7 @@ export class NfsFormComponent extends CdForm implements OnInit {
 
     this.nfsForm.patchValue(res);
     this.setPathValidation();
-    this.nfsClients.resolveModel(res.clients);
+    this.clients = res.clients;
   }
 
   resolveDaemons(daemons: Record<string, any>) {