Merge pull request #22060 from ricardoasmarques/wip-perf-counter-breadcrumb

Add performance counters breadcrumb

Reviewed-by: Tiago Melo <tmelo@suse.com>

src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.ts

@@ -50,11 +50,13 @@ export class MonitorComponent {
       data.in_quorum.map((row) => {
         row.cdOpenSessions = row.stats.num_sessions.map(i => i[1]);
         row.cdLink = '/perf_counters/mon/' + row.name;
+        row.cdParams = {fromLink: '/monitor'};
         return row;
       });
 
       data.out_quorum.map((row) => {
         row.cdLink = '/perf_counters/mon/' + row.name;
+        row.cdParams = {fromLink: '/monitor'};
         return row;
       });
 

src/pybind/mgr/dashboard/frontend/src/app/ceph/performance-counter/performance-counter/performance-counter.component.html

@@ -1,6 +1,19 @@
+<nav aria-label="breadcrumb">
+  <ol class="breadcrumb">
+    <li class="breadcrumb-item">Cluster</li>
+    <li class="breadcrumb-item">
+      <a [routerLink]="fromLink">
+        <span *ngIf="fromLink === '/monitor'">Monitors</span>
+        <span *ngIf="fromLink === '/hosts'">Hosts</span>
+      </a>
+    </li>
+    <li class="breadcrumb-item active"
+        i18n>Performance Counters</li>
+  </ol>
+</nav>
+
 <fieldset>
-  <legend i18n>Performance Counters</legend>
-  <h3>{{ serviceType }}.{{ serviceId }}</h3>
+  <legend>{{ serviceType }}.{{ serviceId }}</legend>
   <cd-table-performance-counter [serviceType]="serviceType"
                                 [serviceId]="serviceId">
   </cd-table-performance-counter>

src/pybind/mgr/dashboard/frontend/src/app/ceph/performance-counter/performance-counter/performance-counter.component.ts

@@ -7,10 +7,19 @@ import { ActivatedRoute } from '@angular/router';
   styleUrls: ['./performance-counter.component.scss']
 })
 export class PerformanceCounterComponent {
+
+  static defaultFromLink = '/hosts';
+
   serviceId: string;
   serviceType: string;
+  fromLink: string;
 
   constructor(private route: ActivatedRoute) {
+    this.route.queryParams.subscribe(
+      (params: { fromLink: string }) => {
+        this.fromLink = params.fromLink || PerformanceCounterComponent.defaultFromLink;
+      }
+    );
     this.route.params.subscribe(
       (params: { type: string; id: string }) => {
         this.serviceId = params.id;

src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html

@@ -111,7 +111,8 @@
 <ng-template #routerLinkTpl
              let-row="row"
              let-value="value">
-  <a [routerLink]="[row.cdLink]">{{ value }}</a>
+  <a [routerLink]="[row.cdLink]"
+     [queryParams]="row.cdParams">{{ value }}</a>
 </ng-template>
 
 <ng-template #checkIconTpl