From 2d87f7f1f92ba0d86798caf66822556c84ce6ac3 Mon Sep 17 00:00:00 2001 From: Jake Bassett Date: Wed, 24 Feb 2021 12:54:15 -0800 Subject: [PATCH] feat: add visible option to table controls --- .../table/table-widget-control.model.ts | 8 +++ .../table/table-widget-renderer.component.ts | 56 ++++++++++--------- ...ies-attribute-options-data-source.model.ts | 26 +++------ 3 files changed, 47 insertions(+), 43 deletions(-) diff --git a/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-control.model.ts b/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-control.model.ts index 270da52cc..0931a4437 100644 --- a/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-control.model.ts +++ b/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-control.model.ts @@ -18,6 +18,14 @@ export abstract class TableWidgetControlModel { }) public uniqueValues: boolean = false; + @ModelProperty({ + key: 'visible', + displayName: 'Visible', + type: BOOLEAN_PROPERTY.type, + required: false + }) + public visible: boolean = true; + @ModelInject(MODEL_API) protected readonly api!: ModelApi; diff --git a/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-renderer.component.ts b/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-renderer.component.ts index 8fb0bab0d..0274dd9df 100644 --- a/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-renderer.component.ts +++ b/projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-renderer.component.ts @@ -161,38 +161,44 @@ export class TableWidgetRendererComponent protected fetchAndPopulateSelectControls(): void { this.selectControls$ = forkJoinSafeEmpty( - this.model.getSelectControlOptions().map(selectControlModel => - // Fetch the values for the selectFilter dropdown - selectControlModel.getOptions().pipe( - first(), - map(options => { - const selectOptions = options.map(option => ({ - label: option.label, - value: option - })); - - return { - placeholder: selectControlModel.placeholder, - options: selectOptions - }; - }) + this.model + .getSelectControlOptions() + .filter(checkboxControlModel => checkboxControlModel.visible) + .map(selectControlModel => + // Fetch the values for the selectFilter dropdown + selectControlModel.getOptions().pipe( + first(), + map(options => { + const selectOptions = options.map(option => ({ + label: option.label, + value: option + })); + + return { + placeholder: selectControlModel.placeholder, + options: selectOptions + }; + }) + ) ) - ) ); } protected fetchAndPopulateCheckboxControls(): void { this.checkboxControls$ = forkJoinSafeEmpty( - this.model.getCheckboxControlOptions().map(checkboxControlModel => - checkboxControlModel.getOptions().pipe( - first(), - map(options => ({ - label: checkboxControlModel.checked ? options[0].label : options[1].label, - value: checkboxControlModel.checked, - options: options - })) + this.model + .getCheckboxControlOptions() + .filter(checkboxControlModel => checkboxControlModel.visible) + .map(checkboxControlModel => + checkboxControlModel.getOptions().pipe( + first(), + map(options => ({ + label: checkboxControlModel.checked ? options[0].label : options[1].label, + value: checkboxControlModel.checked, + options: options + })) + ) ) - ) ).pipe( tap((checkboxControls: CheckboxControl[]) => { // Apply initial values for checkboxes diff --git a/projects/observability/src/shared/dashboard/data/graphql/entity/attribute/entities-attribute-options-data-source.model.ts b/projects/observability/src/shared/dashboard/data/graphql/entity/attribute/entities-attribute-options-data-source.model.ts index 2c0920163..086dc9232 100644 --- a/projects/observability/src/shared/dashboard/data/graphql/entity/attribute/entities-attribute-options-data-source.model.ts +++ b/projects/observability/src/shared/dashboard/data/graphql/entity/attribute/entities-attribute-options-data-source.model.ts @@ -1,9 +1,5 @@ -import { - FilterOperator, - TableControlOptionType, - TableFilterControlOption, - TableUnsetFilterControlOption -} from '@hypertrace/components'; +import { FilterOperator, TableControlOptionType } from '@hypertrace/components'; +import { LabeledTableControlOption } from '@hypertrace/distributed-tracing'; import { Model, ModelProperty, STRING_PROPERTY } from '@hypertrace/hyperdash'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; @@ -20,18 +16,14 @@ export class EntitiesAttributeOptionsDataSourceModel extends EntitiesAttributeDa }) public unsetLabel: string = 'All'; - private buildUnsetOption(attribute: string): Labeled { - return { - type: TableControlOptionType.UnsetFilter, - label: this.unsetLabel, - metaValue: attribute - }; - } - - public getData(): Observable<(Labeled | Labeled)[]> { + public getData(): Observable { return super.getData().pipe( map((values: unknown[]) => [ - this.buildUnsetOption(this.specification.name), + { + type: TableControlOptionType.UnsetFilter, + label: this.unsetLabel, + metaValue: this.specification.name + }, ...values.map(value => ({ type: TableControlOptionType.Filter as const, label: String(value), @@ -46,5 +38,3 @@ export class EntitiesAttributeOptionsDataSourceModel extends EntitiesAttributeDa ); } } - -type Labeled = T & { label: string };