Skip to content

Commit 2040f9e

Browse files
authored
Merge pull request ceph#57715 from rhcs-dashboard/add-rgw-multisite-wizard
mgr/dashboard: add a wizard to setup rgw multisite replication Reviewed-by: Nizamudeen A <[email protected]>
2 parents f890abb + cf58d7e commit 2040f9e

File tree

13 files changed

+774
-172
lines changed

13 files changed

+774
-172
lines changed

src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-multisite-details/rgw-multisite-details.component.html

Lines changed: 101 additions & 113 deletions
Original file line numberDiff line numberDiff line change
@@ -8,136 +8,123 @@
88
i18n>Configuration</a>
99
<ng-template ngbNavContent>
1010
<div>
11-
<cd-alert-panel
12-
*ngIf="!rgwModuleStatus"
13-
type="info"
14-
spacingClass="mb-3"
15-
class="d-flex align-items-center"
16-
i18n
17-
>In order to access the import/export feature, the rgw module must be enabled
18-
11+
<cd-alert-panel *ngIf="!rgwModuleStatus"
12+
type="info"
13+
spacingClass="mb-3"
14+
class="d-flex align-items-center"
15+
i18n>In order to access the import/export feature, the rgw module must be enabled
1916
<button class="btn btn-light mx-2"
2017
type="button"
21-
(click)="enableRgwModule()">
22-
Enable
23-
</button>
18+
(click)="enableRgwModule()">Enable</button>
2419
</cd-alert-panel>
25-
<cd-alert-panel
26-
*ngIf="restartGatewayMessage"
27-
type="warning"
28-
spacingClass="mb-3"
29-
i18n>Please restart all Ceph Object Gateway instances in all zones to ensure consistent
30-
multisite configuration updates.
20+
<cd-alert-panel *ngIf="restartGatewayMessage"
21+
type="warning"
22+
spacingClass="mb-3"
23+
i18n>Please restart all Ceph Object Gateway instances in all zones to ensure consistent multisite configuration updates.
3124
<a class="text-decoration-underline"
32-
routerLink="/services"> Cluster->Services</a>
25+
routerLink="/services">
26+
Cluster->Services</a>
3327
</cd-alert-panel>
34-
<cd-table-actions
35-
class="btn-group mb-4 me-2"
36-
[permission]="permission"
37-
[selection]="selection"
38-
[tableActions]="createTableActions"
39-
>
40-
</cd-table-actions>
41-
<span *ngIf="showMigrateAction">
42-
<cd-table-actions
43-
class="btn-group mb-4 me-2 secondary"
44-
[permission]="permission"
45-
[btnColor]="'light'"
46-
[selection]="selection"
47-
[tableActions]="migrateTableAction"
48-
>
28+
<span *ngIf="!showMigrateAndReplicationActions; else migrateAndReplicationActionTpl">
29+
<cd-table-actions class="btn-group mb-4 me-2"
30+
[permission]="permission"
31+
[selection]="selection"
32+
[tableActions]="createTableActions">
4933
</cd-table-actions>
5034
</span>
51-
<cd-table-actions
52-
class="btn-group mb-4 me-2"
53-
[permission]="permission"
54-
[btnColor]="'light'"
55-
[selection]="selection"
56-
[tableActions]="importAction"
57-
>
35+
<ng-template #migrateAndReplicationActionTpl>
36+
<cd-table-actions class="btn-group mb-4 me-2"
37+
[permission]="permission"
38+
[selection]="selection"
39+
[tableActions]="multisiteReplicationActions">
40+
</cd-table-actions>
41+
<cd-table-actions class="btn-group mb-4 me-2 secondary"
42+
[permission]="permission"
43+
[btnColor]="'light'"
44+
[selection]="selection"
45+
[tableActions]="migrateTableAction">
46+
</cd-table-actions>
47+
</ng-template>
48+
<cd-table-actions class="btn-group mb-4 me-2"
49+
[permission]="permission"
50+
[btnColor]="'light'"
51+
[selection]="selection"
52+
[tableActions]="importAction">
5853
</cd-table-actions>
59-
<cd-table-actions
60-
class="btn-group mb-4 me-2"
61-
[permission]="permission"
62-
[btnColor]="'light'"
63-
[selection]="selection"
64-
[tableActions]="exportAction">
54+
<cd-table-actions class="btn-group mb-4 me-2"
55+
[permission]="permission"
56+
[btnColor]="'light'"
57+
[selection]="selection"
58+
[tableActions]="exportAction">
6559
</cd-table-actions>
6660
</div>
6761
<div class="card">
6862
<div class="card-header"
69-
i18n>Topology Viewer</div>
70-
<div class="card-body">
71-
<div class="row">
72-
<div class="col-sm-6 col-lg-6 tree-container">
73-
<i *ngIf="loadingIndicator"
74-
[ngClass]="[icons.large, icons.spinner, icons.spin]"></i>
75-
<tree-root
76-
#tree
77-
[nodes]="nodes"
78-
[options]="treeOptions"
79-
(updateData)="onUpdateData()">
80-
<ng-template
81-
#treeNodeTemplate
82-
let-node>
83-
<span *ngIf="node.data.name"
84-
class="me-3">
85-
<span *ngIf="node.data.show_warning">
86-
<i
87-
class="text-danger"
63+
i18n>Topology Viewer
64+
</div>
65+
<div class="row">
66+
<div class="col-sm-6 col-lg-6 tree-container">
67+
<i *ngIf="loadingIndicator"
68+
[ngClass]="[icons.large, icons.spinner, icons.spin]"></i>
69+
<tree-root #tree
70+
[nodes]="nodes"
71+
[options]="treeOptions"
72+
(updateData)="onUpdateData()">
73+
<ng-template #treeNodeTemplate
74+
let-node>
75+
<span *ngIf="node.data.name"
76+
class="me-3">
77+
<span *ngIf="(node.data.show_warning)">
78+
<i class="text-danger"
8879
i18n-title
8980
[title]="node.data.warning_message"
90-
[ngClass]="icons.danger"
91-
></i>
92-
</span>
93-
<i [ngClass]="node.data.icon"></i>
94-
{{ node.data.name }}
81+
[ngClass]="icons.danger"></i>
9582
</span>
96-
<span class="badge badge-success me-2"
97-
*ngIf="node.data.is_default">
83+
<i [ngClass]="node.data.icon"></i>
84+
{{ node.data.name }}
85+
</span>
86+
<span class="badge badge-success me-2"
87+
*ngIf="node.data.is_default">
9888
default
99-
</span>
100-
<span class="badge badge-warning me-2"
101-
*ngIf="node.data.is_master"> master </span>
102-
<span class="badge badge-warning me-2"
103-
*ngIf="node.data.secondary_zone">
104-
secondary-zone
105-
</span>
106-
<div class="btn-group align-inline-btns"
107-
*ngIf="node.isFocused"
108-
role="group">
109-
<div [title]="editTitle"
110-
i18n-title>
111-
<button
112-
type="button"
113-
class="btn btn-light dropdown-toggle-split ms-1"
114-
(click)="openModal(node, true)"
115-
[disabled]="getDisable() || node.data.secondary_zone">
116-
<i [ngClass]="[icons.edit]"></i>
117-
</button>
118-
</div>
119-
<div [title]="deleteTitle"
120-
i18n-title>
121-
<button
122-
type="button"
123-
class="btn btn-light ms-1"
124-
[disabled]="isDeleteDisabled(node) || node.data.secondary_zone"
125-
(click)="delete(node)">
126-
<i [ngClass]="[icons.destroy]"></i>
127-
</button>
128-
</div>
89+
</span>
90+
<span class="badge badge-warning me-2"
91+
*ngIf="node.data.is_master"> master </span>
92+
<span class="badge badge-warning me-2"
93+
*ngIf="node.data.secondary_zone">
94+
secondary-zone
95+
</span>
96+
<div class="btn-group align-inline-btns"
97+
*ngIf="node.isFocused"
98+
role="group">
99+
<div [title]="editTitle"
100+
i18n-title>
101+
<button type="button"
102+
class="btn btn-light dropdown-toggle-split ms-1"
103+
(click)="openModal(node, true)"
104+
[disabled]="getDisable() || node.data.secondary_zone">
105+
<i [ngClass]="[icons.edit]"></i>
106+
</button>
129107
</div>
130-
</ng-template>
131-
</tree-root>
132-
</div>
133-
<div class="col-sm-6 col-lg-6 metadata"
134-
*ngIf="metadata">
135-
<legend>{{ metadataTitle }}</legend>
136-
<div>
137-
<cd-table-key-value
138-
cdTableDetail
139-
[data]="metadata"></cd-table-key-value>
140-
</div>
108+
<div [title]="deleteTitle"
109+
i18n-title>
110+
<button type="button"
111+
class="btn btn-light ms-1"
112+
[disabled]="isDeleteDisabled(node) || node.data.secondary_zone"
113+
(click)="delete(node)">
114+
<i [ngClass]="[icons.destroy]"></i>
115+
</button>
116+
</div>
117+
</div>
118+
</ng-template>
119+
</tree-root>
120+
</div>
121+
<div class="col-sm-6 col-lg-6 metadata"
122+
*ngIf="metadata">
123+
<legend>{{ metadataTitle }}</legend>
124+
<div>
125+
<cd-table-key-value cdTableDetail
126+
[data]="metadata">
127+
</cd-table-key-value>
141128
</div>
142129
</div>
143130
</div>
@@ -154,3 +141,4 @@
154141
</nav>
155142

156143
<div [ngbNavOutlet]="nav"></div>
144+
<router-outlet name="modal"></router-outlet>

src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-multisite-details/rgw-multisite-details.component.spec.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { SharedModule } from '~/app/shared/shared.module';
88
import { RgwMultisiteDetailsComponent } from './rgw-multisite-details.component';
99
import { RouterTestingModule } from '@angular/router/testing';
1010
import { configureTestBed } from '~/testing/unit-test-helper';
11-
import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
11+
import { NgbNavModule, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
1212

1313
describe('RgwMultisiteDetailsComponent', () => {
1414
let component: RgwMultisiteDetailsComponent;
@@ -24,7 +24,8 @@ describe('RgwMultisiteDetailsComponent', () => {
2424
ToastrModule.forRoot(),
2525
RouterTestingModule,
2626
NgbNavModule
27-
]
27+
],
28+
providers: [NgbActiveModal]
2829
});
2930

3031
beforeEach(() => {
@@ -40,6 +41,6 @@ describe('RgwMultisiteDetailsComponent', () => {
4041

4142
it('should display right title', () => {
4243
const span = debugElement.nativeElement.querySelector('.card-header');
43-
expect(span.textContent).toBe('Topology Viewer');
44+
expect(span.textContent.trim()).toBe('Topology Viewer');
4445
});
4546
});

0 commit comments

Comments
 (0)