<ng-template #inProgress>
<h5 i18n>
<i [ngClass]="[icons.spin, icons.spinner]"></i>
- Upgrade in progress {{executingTasks?.progress}}%
+ Upgrading {{executingTasks?.progress}}%
</h5>
</ng-template>
</ng-container>
beforeEach(() => {
fixture = TestBed.createComponent(UpgradeComponent);
component = fixture.componentInstance;
- upgradeInfoSpy = spyOn(TestBed.inject(UpgradeService), 'list').and.callFake(() => of(null));
+ upgradeInfoSpy = spyOn(TestBed.inject(UpgradeService), 'listCached').and.callFake(() =>
+ of(null)
+ );
getHealthSpy = spyOn(TestBed.inject(HealthService), 'getMinimalHealth');
upgradeStatusSpy = spyOn(TestBed.inject(UpgradeService), 'status');
getHealthSpy.and.returnValue(of(healthPayload));
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Observable, ReplaySubject, Subscription, of } from 'rxjs';
-import { catchError, publishReplay, refCount, shareReplay, switchMap, tap } from 'rxjs/operators';
+import { catchError, shareReplay, switchMap } from 'rxjs/operators';
import { DaemonService } from '~/app/shared/api/daemon.service';
import { HealthService } from '~/app/shared/api/health.service';
import { UpgradeService } from '~/app/shared/api/upgrade.service';
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
import { NotificationService } from '~/app/shared/services/notification.service';
import { SummaryService } from '~/app/shared/services/summary.service';
-import { ModalService } from '~/app/shared/services/modal.service';
-import { UpgradeStartModalComponent } from './upgrade-form/upgrade-start-modal.component';
import { ExecutingTask } from '~/app/shared/models/executing-task';
import { Router } from '@angular/router';
import { RefreshIntervalService } from '~/app/shared/services/refresh-interval.service';
upgradeStatus$: Observable<any>;
subject = new ReplaySubject<any>();
+ private subs = new Subscription();
constructor(
- private modalService: ModalService,
private summaryService: SummaryService,
private upgradeService: UpgradeService,
private healthService: HealthService,
}
];
- this.summaryService.subscribe((summary) => {
- const version = summary.version.replace('ceph version ', '').split('-');
- this.version = version[0];
- this.executingTasks = summary.executing_tasks.filter((tasks) =>
- tasks.name.includes('progress/Upgrade')
- )[0];
- });
+ this.subs.add(
+ this.summaryService.subscribe((summary) => {
+ const version = summary.version.replace('ceph version ', '').split('-');
+ this.version = version[0];
+ this.executingTasks = summary.executing_tasks.filter((tasks) =>
+ tasks.name.includes('progress/Upgrade')
+ )[0];
+ })
+ );
this.interval = this.refreshIntervalService.intervalData$.subscribe(() => {
this.fetchStatus();
});
- this.info$ = this.upgradeService.list().pipe(
- tap((upgradeInfo: UpgradeInfoInterface) => (this.upgradableVersions = upgradeInfo.versions)),
- publishReplay(1),
- refCount(),
+ this.info$ = this.upgradeService.listCached().pipe(
catchError((err) => {
err.preventDefault();
this.errorMessage = $localize`Not retrieving upgrades`;
}
startUpgradeModal() {
- this.modalRef = this.modalService.show(UpgradeStartModalComponent, {
- versions: this.upgradableVersions
- });
+ this.modalRef = this.upgradeService.startUpgradeModal();
}
fetchStatus() {
ngOnDestroy() {
this.interval?.unsubscribe();
+ this.subs?.unsubscribe();
}
}
<dt>Orchestrator</dt>
<dd i18n>{{ detailsCardData.orchestrator || 'Orchestrator is not available' }}</dd>
<dt>Ceph version</dt>
- <dd>{{ detailsCardData.cephVersion }}</dd>
+ <dd>
+ {{ detailsCardData.cephVersion }}
+ <cd-upgradable></cd-upgradable>
+ </dd>
<dt>Cluster API</dt>
<dd>
<a routerLink="/api-docs"
telemetryEnabled: boolean;
telemetryURL = 'https://telemetry-public.ceph.com/';
origin = window.location.origin;
+ private subs = new Subscription();
constructor(
private summaryService: SummaryService,
ngOnDestroy() {
this.interval.unsubscribe();
this.prometheusService.unsubscribe();
+ this.subs?.unsubscribe();
}
getHealth() {
this.orchestratorService.getName().subscribe((data: string) => {
this.detailsCardData.orchestrator = data;
});
- this.summaryService.subscribe((summary) => {
- const version = summary.version.replace('ceph version ', '').split(' ');
- this.detailsCardData.cephVersion =
- version[0] + ' ' + version.slice(2, version.length).join(' ');
- });
+ this.subs.add(
+ this.summaryService.subscribe((summary) => {
+ const version = summary.version.replace('ceph version ', '').split(' ');
+ this.detailsCardData.cephVersion =
+ version[0] + ' ' + version.slice(2, version.length).join(' ');
+ })
+ );
}
getCapacityCardData() {
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { ApiClient } from './api-client';
-import { map } from 'rxjs/operators';
+import { map, shareReplay, tap } from 'rxjs/operators';
import { SummaryService } from '../services/summary.service';
import { UpgradeInfoInterface, UpgradeStatusInterface } from '../models/upgrade.interface';
import { Observable } from 'rxjs';
+import { UpgradeStartModalComponent } from '~/app/ceph/cluster/upgrade/upgrade-form/upgrade-start-modal.component';
+import { ModalService } from '../services/modal.service';
+import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
+
+const CACHE_SIZE = 1;
@Injectable({
providedIn: 'root'
'nfs'
];
- constructor(private http: HttpClient, private summaryService: SummaryService) {
+ _listData$: Observable<UpgradeInfoInterface>;
+ _upgradableVersions: string[];
+
+ constructor(
+ private http: HttpClient,
+ private summaryService: SummaryService,
+ private modalService: ModalService
+ ) {
super();
}
status(): Observable<UpgradeStatusInterface> {
return this.http.get<UpgradeStatusInterface>(`${this.baseURL}/status`);
}
+
+ listCached(): Observable<UpgradeInfoInterface> {
+ if (!this._listData$) {
+ this._listData$ = this.list().pipe(
+ tap(
+ (upgradeInfo: UpgradeInfoInterface) => (this._upgradableVersions = upgradeInfo.versions)
+ ),
+ shareReplay(CACHE_SIZE)
+ );
+ }
+ return this._listData$;
+ }
+
+ startUpgradeModal(): NgbModalRef {
+ return this.modalService.show(UpgradeStartModalComponent, {
+ versions: this._upgradableVersions
+ });
+ }
}
import { VerticalNavigationComponent } from './vertical-navigation/vertical-navigation.component';
import { HelpTextComponent } from './help-text/help-text.component';
import { FormAdvancedFieldsetComponent } from './form-advanced-fieldset/form-advanced-fieldset.component';
+import { UpgradableComponent } from './upgradable/upgradable.component';
@NgModule({
imports: [
CodeBlockComponent,
VerticalNavigationComponent,
HelpTextComponent,
- FormAdvancedFieldsetComponent
+ FormAdvancedFieldsetComponent,
+ UpgradableComponent
],
providers: [],
exports: [
CodeBlockComponent,
VerticalNavigationComponent,
HelpTextComponent,
- FormAdvancedFieldsetComponent
+ FormAdvancedFieldsetComponent,
+ UpgradableComponent
]
})
export class ComponentsModule {}
--- /dev/null
+<div *ngIf="upgradeStatus$ | async as status; else isUpgradable">
+ <ng-container *ngIf="status.is_paused || status.in_progress; else isUpgradable">
+ <h5 *ngIf="status.is_paused; else inProgress"
+ i18n>
+ Upgrade is paused
+ </h5>
+ <ng-template #inProgress>
+ <a href="#/upgrade/progress"
+ i18n>
+ <i [ngClass]="[icons.spin, icons.spinner]"></i>
+ Upgrading {{executingTask?.progress}}%
+ </a>
+ </ng-template>
+ </ng-container>
+</div>
+
+<ng-template #isUpgradable>
+ <div *ngIf="upgradeInfo$ | async as info"
+ i18n>
+ <h5 *ngIf="info.versions.length > 0"
+ (click)="upgradeModal()">
+ <i [ngClass]="icons.up"></i>
+ Upgrade available
+ </h5>
+ </div>
+</ng-template>
--- /dev/null
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UpgradableComponent } from './upgradable.component';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+
+describe('UpgradableComponent', () => {
+ let component: UpgradableComponent;
+ let fixture: ComponentFixture<UpgradableComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [UpgradableComponent],
+ imports: [HttpClientTestingModule]
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(UpgradableComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
--- /dev/null
+import { Component } from '@angular/core';
+import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
+import { Observable, Subscription } from 'rxjs';
+import { UpgradeService } from '../../api/upgrade.service';
+import { UpgradeInfoInterface, UpgradeStatusInterface } from '../../models/upgrade.interface';
+import { OrchestratorService } from '../../api/orchestrator.service';
+import { Icons } from '~/app/shared/enum/icons.enum';
+import { SummaryService } from '../../services/summary.service';
+import { ExecutingTask } from '../../models/executing-task';
+
+@Component({
+ selector: 'cd-upgradable',
+ templateUrl: './upgradable.component.html',
+ styleUrls: ['./upgradable.component.scss']
+})
+export class UpgradableComponent {
+ orchAvailable: boolean = false;
+ upgradeInfo$: Observable<UpgradeInfoInterface>;
+ upgradeStatus$: Observable<UpgradeStatusInterface>;
+ upgradeModalRef: NgbModalRef;
+ executingTask: ExecutingTask;
+ private subs = new Subscription();
+
+ icons = Icons;
+
+ constructor(
+ private orchestratorService: OrchestratorService,
+ private summaryService: SummaryService,
+ private upgradeService: UpgradeService
+ ) {}
+
+ ngOnInit() {
+ this.orchestratorService.status().subscribe((status: any) => {
+ this.orchAvailable = status.available;
+ if (this.orchAvailable && status.upgrade_status?.available) {
+ this.upgradeInfo$ = this.upgradeService.listCached();
+ this.upgradeStatus$ = this.upgradeService.status();
+ }
+ });
+
+ this.subs.add(
+ this.summaryService.subscribe((summary) => {
+ this.executingTask = summary.executing_tasks.filter((tasks) =>
+ tasks.name.includes('progress/Upgrade')
+ )[0];
+ })
+ );
+ }
+
+ ngOnDestroy() {
+ this.subs?.unsubscribe();
+ }
+
+ upgradeModal() {
+ this.upgradeModalRef = this.upgradeService.startUpgradeModal();
+ }
+}
projects / ceph.git / commitdiff