fix: aaron provided workaround

Author: jake-bassett

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

@@ -146,33 +146,25 @@ export class TableWidgetRendererComponent
       label: capitalize(viewOption),
       value: viewOption
     }));
-
-    this.populateStaticControls();
-  }
-
-  private populateStaticControls(): void {
-    /*
-     * CAUTION: If TableWidgetViewToggleModel is used, this.model is not hydrated until after setView() is called,
-     *  which is triggered by onViewChange().
-     */
-    this.filterItems = this.model.getFilterOptions().map(filterOption => ({
-      label: capitalize(filterOption.label),
-      value: filterOption
-    }));
-
-    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.fetchAndPopulateDynamicControls())
+      tap(() => this.fetchAndPopulateControlFilters())
     );
   }
 
-  protected fetchAndPopulateDynamicControls(): 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
@@ -334,7 +326,6 @@ export class TableWidgetRendererComponent
 
   public onViewChange(view: string): void {
     this.model.setView(view);
-    this.populateStaticControls();
     this.columnConfigs$ = this.getColumnConfigs();
   }
 

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);
     }