feat: support for custom row height in table widget (hypertrace#1310)

Author: arjunlalb

projects/components/src/table/table.component.ts

@@ -153,7 +153,7 @@ import { TableColumnConfigExtended, TableService } from './table.service';
             selectable: this.supportsRowSelection()
           }"
           class="data-row"
-          [style.height]="this.rowHeight"
+          [style.minHeight]="this.rowHeight"
         ></cdk-row>
 
         <!-- Expandable Detail Rows -->

projects/observability/src/shared/dashboard/widgets/table/table-widget-base.model.ts

@@ -126,6 +126,13 @@ export abstract class TableWidgetBaseModel extends BaseModel {
   })
   public resizable: boolean = true;
 
+  @ModelProperty({
+    key: 'row-height',
+    displayName: 'Row Height',
+    type: STRING_PROPERTY.type
+  })
+  public rowHeight: string = '44px';
+
   @ModelProperty({
     key: 'loadingConfig',
     required: false,
@@ -196,6 +203,10 @@ export abstract class TableWidgetBaseModel extends BaseModel {
     return this.resizable;
   }
 
+  public getRowHeight(): string {
+    return this.rowHeight;
+  }
+
   public getLoadingConfig(): LoadAsyncConfig | undefined {
     return this.loadingConfig;
   }

projects/observability/src/shared/dashboard/widgets/table/table-widget-renderer.component.ts

@@ -105,6 +105,7 @@ import { TableWidgetModel } from './table-widget.model';
           [resizable]="this.api.model.isResizable()"
           [detailContent]="childDetail"
           [syncWithUrl]="this.syncWithUrl"
+          [rowHeight]="this.api.model.getRowHeight()"
           (rowClicked)="this.onRowClicked($event)"
           (selectionsChange)="this.onRowSelection($event)"
           (columnConfigsChange)="this.onColumnsChange($event)"