table widget browser storage (#1206)

* feat: clean up table widget preferences storage

* feat: add view toggle preference

* feat: add checkbox preferences

* feat: add persistance for select filters

* feat: fix publishSelectValues call

* style: prettier

* style: linting

Author: jake-bassett

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

@@ -11,6 +11,7 @@ import {
 } from '@angular/core';
 import { IconType } from '@hypertrace/assets-library';
 import { TypedSimpleChanges } from '@hypertrace/common';
+import { isEqual } from 'lodash-es';
 import { IconSize } from '../../icon/icon-size';
 import { MultiSelectJustify } from '../../multi-select/multi-select-justify';
 import { MultiSelectSearchMode, TriggerLabelDisplayMode } from '../../multi-select/multi-select.component';
@@ -101,6 +102,8 @@ import {
 })
 export class TableControlsComponent implements OnChanges {
   public readonly DEFAULT_SEARCH_PLACEHOLDER: string = 'Search...';
+  @Input()
+  public persistenceId?: string;
 
   @Input()
   public searchEnabled?: boolean;
@@ -207,7 +210,7 @@ export class TableControlsComponent implements OnChanges {
 
   private setActiveViewItem(): void {
     if (this.viewItems !== undefined) {
-      this.activeViewItem = this.viewItems.find(item => item === this.activeViewItem) ?? this.viewItems[0];
+      this.activeViewItem = this.findViewItem(this.activeViewItem);
     }
   }
 
@@ -259,4 +262,8 @@ export class TableControlsComponent implements OnChanges {
   public onViewChange(item: ToggleItem<string>): void {
     this.viewChange.emit(item.value);
   }
+
+  private findViewItem(viewItem?: ToggleItem): ToggleItem | undefined {
+    return this.viewItems?.find(item => isEqual(item, viewItem)) ?? this.viewItems![0];
+  }
 }

projects/dashboards/src/widgets/base.model.ts

@@ -15,4 +15,8 @@ export abstract class BaseModel {
     type: STRING_PROPERTY.type
   })
   public id?: string;
+
+  public getId(): string | undefined {
+    return this.id;
+  }
 }

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

@@ -23,6 +23,13 @@ import { TableWidgetControlCheckboxOptionModel } from './table-widget-control-ch
 import { TableWidgetControlSelectOptionModel } from './table-widget-control-select-option.model';
 
 export abstract class TableWidgetBaseModel extends BaseModel {
+  @ModelProperty({
+    key: 'viewId',
+    displayName: 'Model View ID',
+    type: STRING_PROPERTY.type
+  })
+  public viewId?: string;
+
   @ModelProperty({
     // tslint:disable-next-line: no-object-literal-type-assertion
     type: {
@@ -126,6 +133,11 @@ export abstract class TableWidgetBaseModel extends BaseModel {
     return [];
   }
 
+  public getViewId(): string | undefined {
+    // No-op here, but can be overridden
+    return this.viewId;
+  }
+
   public setView(_view: string): void {
     // No-op here, but can be overridden
     return;