Merge pull request ceph#53991 from rhcs-dashboard/fix-cephfs-edit-form-placement

mgr/dashboard: disable hosts field while editing the filesystem 

Reviewed-by: Avan Thakkar <[email protected]>
Reviewed-by: Ankush Behl <[email protected]>

Author: nizamial09

src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.html

@@ -59,7 +59,7 @@
           </div>
 
           <!-- Label -->
-          <div *ngIf="form.controls.placement.value === 'label'"
+          <div *ngIf="form.controls.placement.value === 'label' && !editing"
                class="form-group row">
             <label i18n
                    class="cd-col-form-label"
@@ -79,7 +79,7 @@
           </div>
 
           <!-- Hosts -->
-          <div *ngIf="form.controls.placement.value === 'hosts'"
+          <div *ngIf="form.controls.placement.value === 'hosts' && !editing"
                class="form-group row">
             <label class="cd-col-form-label"
                    for="hosts"

src/pybind/mgr/dashboard/frontend/src/app/ceph/cephfs/cephfs-form/cephfs-form.component.spec.ts

@@ -7,10 +7,15 @@ import { FormHelper, configureTestBed } from '~/testing/unit-test-helper';
 import { SharedModule } from '~/app/shared/shared.module';
 import { ToastrModule } from 'ngx-toastr';
 import { ReactiveFormsModule } from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { OrchestratorService } from '~/app/shared/api/orchestrator.service';
+import { of } from 'rxjs';
+
 describe('CephfsVolumeFormComponent', () => {
   let component: CephfsVolumeFormComponent;
   let fixture: ComponentFixture<CephfsVolumeFormComponent>;
   let formHelper: FormHelper;
+  let orchService: OrchestratorService;
 
   configureTestBed({
     imports: [
@@ -27,6 +32,8 @@ describe('CephfsVolumeFormComponent', () => {
     fixture = TestBed.createComponent(CephfsVolumeFormComponent);
     component = fixture.componentInstance;
     formHelper = new FormHelper(component.form);
+    orchService = TestBed.inject(OrchestratorService);
+    spyOn(orchService, 'status').and.returnValue(of({ available: true }));
     fixture.detectChanges();
   });
 
@@ -50,4 +57,26 @@ describe('CephfsVolumeFormComponent', () => {
       formHelper.expectError('name', 'pattern');
     }
   }));
+
+  it('should show placement when orchestrator is available', () => {
+    const placement = fixture.debugElement.query(By.css('#placement'));
+    expect(placement).not.toBeNull();
+  });
+
+  describe('when editing', () => {
+    beforeEach(() => {
+      component.editing = true;
+      component.ngOnInit();
+      fixture.detectChanges();
+    });
+
+    it('should not show placement while editing even if orch is available', () => {
+      const placement = fixture.debugElement.query(By.css('#placement'));
+      const label = fixture.debugElement.query(By.css('#label'));
+      const hosts = fixture.debugElement.query(By.css('#hosts'));
+      expect(placement).toBeNull();
+      expect(label).toBeNull();
+      expect(hosts).toBeNull();
+    });
+  });
 });