mgr/dashboard: support templates in table component title

fixes: https://tracker.ceph.com/issues/73456

Signed-off-by: Naman Munet <naman.munet@ibm.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
index 849f02be658ce0db43edddab63300a95257832b2..ebc32bf79fbe78ec6915386e3de4f21fc45fbd71 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
@@ -4,7 +4,11 @@
   <cds-table-header *ngIf="headerTitle">
     <h4 cdsTableHeaderTitle
         i18n>
-      {{headerTitle}}
+      @if (isHeaderTitleString) {
+        {{ headerTitle }}
+    } @else {
+      <ng-container *ngTemplateOutlet="headerTitle"></ng-container>
+    }
     </h4>
     <p cdsTableHeaderDescription
        i18n

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts
index 081918b9235d2d6d4a87e7428efb1a802f6b0e30..f4a41e5d6f419148157aef7c84117c5d6024b3a7 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts
@@ -94,8 +94,15 @@ export class TableComponent implements AfterViewInit, OnInit, OnChanges, OnDestr
   @ContentChild(TableDetailDirective) rowDetail!: TableDetailDirective;
   @ContentChild(TableActionsComponent) tableActions!: TableActionsComponent;
 
+  private _headerTitle: string | TemplateRef<any>;
+  isHeaderTitleString = false;
+
   @Input()
-  headerTitle: string;
+  set headerTitle(value: string | TemplateRef<any>) {
+    this._headerTitle = value;
+    this.isHeaderTitleString = typeof value === 'string';
+  }
+
   @Input()
   headerDescription: string;
   // This is the array with the items to be shown.
@@ -293,6 +300,9 @@ export class TableComponent implements AfterViewInit, OnInit, OnChanges, OnDestr
     return this.selectionType === 'single';
   }
 
+  get headerTitle(): string | TemplateRef<any> {
+    return this._headerTitle;
+  }
   /**
    * Controls if all checkboxes are viewed as selected.
    */