mgr/dashboard: Automatically refresh the crush map metadata table

If we make any change to the osd crush map like do an osd crush reweight from cli, for that change to be reflected on metadata table we need to reload the entire page. Instead this PR takes care of auto refreshing the tree view.

Fixes: https://tracker.ceph.com/issues/48922
Signed-off-by: Nizamudeen A <nia@redhat.com>
Signed-off-by: Avan Thakkar <athakkar@redhat.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.ts
index 58b78f2014980d74b6f61e12400f53e81dc9022d..55db0b6e8abb98ede408440fc638520c52d3756d 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/crushmap/crushmap.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core';
 
 import {
   ITreeOptions,
@@ -7,16 +7,20 @@ import {
   TreeNode,
   TREE_ACTIONS
 } from '@circlon/angular-tree-component';
+import { Subscription } from 'rxjs';
 
 import { HealthService } from '~/app/shared/api/health.service';
 import { Icons } from '~/app/shared/enum/icons.enum';
+import { TimerService } from '~/app/shared/services/timer.service';
 
 @Component({
   selector: 'cd-crushmap',
   templateUrl: './crushmap.component.html',
   styleUrls: ['./crushmap.component.scss']
 })
-export class CrushmapComponent implements OnInit {
+export class CrushmapComponent implements OnInit, OnDestroy {
+  private sub = new Subscription();
+
   @ViewChild('tree') tree: TreeComponent;
 
   icons = Icons;
@@ -36,13 +40,22 @@ export class CrushmapComponent implements OnInit {
   metadataTitle: string;
   metadataKeyMap: { [key: number]: any } = {};
 
-  constructor(private healthService: HealthService) {}
+  constructor(private healthService: HealthService, private timerService: TimerService) {}
 
   ngOnInit() {
     this.healthService.getFullHealth().subscribe((data: any) => {
       this.loadingIndicator = false;
       this.nodes = this.abstractTreeData(data);
     });
+    this.sub = this.timerService
+      .get(() => this.healthService.getFullHealth(), 5000)
+      .subscribe((data: any) => {
+        this.nodes = this.abstractTreeData(data);
+      });
+  }
+
+  ngOnDestroy() {
+    this.sub.unsubscribe();
   }
 
   private abstractTreeData(data: any): any[] {