From 9bc969b34c989f1539d4b793c19711782fc4f828 Mon Sep 17 00:00:00 2001 From: Nizamudeen A Date: Fri, 22 Nov 2024 18:24:42 +0530 Subject: [PATCH] mgr/dashboard: fix host form issues Addressing the review comments in https://github.com/ceph/ceph/pull/60355#pullrequestreview-2391335490 Issues fixing - cluster expansion host form not closing form when submitting it - cluster expansion host form changing the location when closing it - put the helper text inside helper component since its longer - maintenance field should be hidden in cluster expansion form since its not a valid option while expanding a cluster. We already add host in _no_schedule Fixes: https://tracker.ceph.com/issues/69020 Signed-off-by: Nizamudeen A --- .../src/app/ceph/cluster/cluster.module.ts | 6 +++-- .../hosts/host-form/host-form.component.html | 23 ++++++++++--------- .../hosts/host-form/host-form.component.ts | 21 +++++++++-------- 3 files changed, 28 insertions(+), 22 deletions(-) diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts index 14e10239c347..d8afc4bcf647 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts @@ -12,7 +12,8 @@ import { ProgressIndicatorModule, InputModule, ModalModule, - TreeviewModule + TreeviewModule, + ListModule } from 'carbon-components-angular'; import { @@ -106,7 +107,8 @@ import { MultiClusterDetailsComponent } from './multi-cluster/multi-cluster-deta ProgressIndicatorModule, ButtonModule, InputModule, - ModalModule + ModalModule, + ListModule ], declarations: [ HostsComponent, diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.html index 9b751d69c5a0..778853b0b2b3 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.html +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.html @@ -1,7 +1,6 @@ + [hasScrollingContent]="true">

{{ action | titlecase }} {{ resource | upperFirst }}

@@ -14,12 +13,10 @@
- Hostname + [invalidText]="hostnameError"> + Hostname (required) @@ -41,10 +39,13 @@ To add multiple hosts at once, you can enter: -
    -
  • a comma-separated list of hostnames (e.g.: example-01,example-02,example-03),
    • -
  • a range expression (e.g.: example-[01-03].ceph),
    • -
  • a comma separated range expression (e.g.: example-[01-05].lab.com,example2-[1-4].lab.com,example3-[001-006].lab.com)
    • +
      +
    • a comma-separated list of hostnames (e.g.: example-01,example-02,example-03),
      • +
    • a range expression (e.g.: example-[01-03].ceph),
      • +
    • a comma separated range expression (e.g.: example-[01-05].lab.com,example2-[1-4].lab.com,example3-[001-006].lab.com)
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.ts index 166ab013e73f..4bc10c7dab98 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-form/host-form.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, Inject, OnInit, Optional } from '@angular/core'; import { UntypedFormControl, Validators } from '@angular/forms'; import { ActivatedRoute, Router } from '@angular/router'; import expand from 'brace-expansion'; @@ -13,8 +13,8 @@ import { CdValidators } from '~/app/shared/forms/cd-validators'; import { CdTableFetchDataContext } from '~/app/shared/models/cd-table-fetch-data-context'; import { FinishedTask } from '~/app/shared/models/finished-task'; import { TaskWrapperService } from '~/app/shared/services/task-wrapper.service'; -import { Location } from '@angular/common'; +const HOSTS = 'hosts'; @Component({ selector: 'cd-host-form', templateUrl: './host-form.component.html', @@ -33,7 +33,6 @@ export class HostFormComponent extends CdForm implements OnInit { pageURL: string; hostPattern = false; labelsOption: Array = []; - hideMaintenance: boolean; messages = new SelectMessages({ empty: $localize`There are no labels.`, @@ -47,7 +46,8 @@ export class HostFormComponent extends CdForm implements OnInit { private hostService: HostService, private taskWrapper: TaskWrapperService, private route: ActivatedRoute, - private location: Location + + @Inject('hideMaintenance') @Optional() public hideMaintenance?: boolean ) { super(); this.resource = $localize`host`; @@ -55,6 +55,9 @@ export class HostFormComponent extends CdForm implements OnInit { } ngOnInit() { + if (this.router.url.includes(HOSTS)) { + this.pageURL = HOSTS; + } this.open = this.route.outlet === 'modal'; this.createForm(); const hostContext = new CdTableFetchDataContext(() => undefined); @@ -147,7 +150,7 @@ export class HostFormComponent extends CdForm implements OnInit { this.addr = this.hostForm.get('addr').value; this.status = this.hostForm.get('maintenance').value ? 'maintenance' : ''; this.allLabels = this.hostForm.get('labels').value; - if (this.pageURL !== 'hosts' && !this.allLabels.includes('_no_schedule')) { + if (this.pageURL !== HOSTS && !this.allLabels.includes('_no_schedule')) { this.allLabels.push('_no_schedule'); } this.hostnameArray.forEach((hostName: string) => { @@ -163,15 +166,15 @@ export class HostFormComponent extends CdForm implements OnInit { this.hostForm.setErrors({ cdSubmitButton: true }); }, complete: () => { - this.pageURL === 'hosts' - ? this.router.navigate([this.pageURL, { outlets: { modal: null } }]) - : this.location.back(); + this.closeModal(); } }); }); } closeModal(): void { - this.location.back(); + this.pageURL === HOSTS + ? this.router.navigate([this.pageURL, { outlets: { modal: null } }]) + : (this.open = false); } } -- 2.47.3