Merge branch 'main' into global-filtering

Author: aaron-steinfeld

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

@@ -142,29 +142,29 @@ export class TableWidgetRendererComponent
       ])
     );
 
-    this.filterItems = this.model.getFilterOptions().map(filterOption => ({
-      label: capitalize(filterOption.label),
-      value: filterOption
-    }));
-
     this.viewItems = this.model.getViewOptions().map(viewOption => ({
       label: capitalize(viewOption),
       value: viewOption
     }));
-
-    this.maybeEmitInitialCheckboxFilterChange();
   }
 
   public getChildModel = (row: TableRow): object | undefined => this.model.getChildModel(row);
 
   protected fetchData(): Observable<TableDataSource<TableRow> | undefined> {
     return this.model.getData().pipe(
       startWith(undefined),
-      tap(() => this.fetchFilterValues())
+      tap(() => this.fetchAndPopulateControlFilters())
     );
   }
 
-  protected fetchFilterValues(): void {
+  protected fetchAndPopulateControlFilters(): void {
+    this.maybeEmitInitialCheckboxFilterChange();
+
+    this.filterItems = this.model.getFilterOptions().map(filterOption => ({
+      label: capitalize(filterOption.label),
+      value: filterOption
+    }));
+
     this.selectFilterItems$ = forkJoinSafeEmpty(
       this.model.getSelectFilterOptions().map(selectFilterModel =>
         // Fetch the values for the selectFilter dropdown

projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-view-toggle.model.ts

@@ -1,6 +1,6 @@
 import { TableDataSource, TableRow } from '@hypertrace/components';
 import { ArrayPropertyTypeInstance } from '@hypertrace/dashboards';
-import { ARRAY_PROPERTY, Model, ModelApi, ModelProperty, ModelPropertyType } from '@hypertrace/hyperdash';
+import { ARRAY_PROPERTY, Model, ModelApi, ModelOnInit, ModelProperty, ModelPropertyType } from '@hypertrace/hyperdash';
 import { ModelInject, MODEL_API } from '@hypertrace/hyperdash-angular';
 import { NEVER, Observable } from 'rxjs';
 import { TableWidgetRowSelectionModel } from './selections/table-widget-row-selection.model';
@@ -14,7 +14,7 @@ import { TableWidgetModel } from './table-widget.model';
 @Model({
   type: 'table-widget-view-toggle'
 })
-export class TableWidgetViewToggleModel extends TableWidgetBaseModel {
+export class TableWidgetViewToggleModel extends TableWidgetBaseModel implements ModelOnInit {
   @ModelProperty({
     key: 'views',
     // tslint:disable-next-line: no-object-literal-type-assertion
@@ -32,8 +32,20 @@ export class TableWidgetViewToggleModel extends TableWidgetBaseModel {
   protected readonly api!: ModelApi;
 
   private delegateModel?: TableWidgetModel;
+  private currentView?: string;
+
+  public modelOnInit(): void {
+    if (this.views.length > 0) {
+      this.setView(this.views[0].label);
+    }
+  }
 
   public setView(view: string): void {
+    if (this.currentView === view) {
+      return;
+    }
+    this.currentView = view;
+
     if (this.delegateModel) {
       this.api.destroyChild(this.delegateModel);
     }