From 27143346575888ca684ae0537f11dfd84d76b43b Mon Sep 17 00:00:00 2001 From: Patricio Albizu Date: Thu, 3 Mar 2022 16:51:32 -0300 Subject: [PATCH 1/8] feat: adding template tooltip --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index dc1d1799c..8c691738a 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -6,6 +6,7 @@ import { Input, OnChanges, QueryList, + TemplateRef, ViewChild, ViewChildren } from '@angular/core'; @@ -48,9 +49,10 @@ import { [ngClass]="{ 'hide-last-divider': this.nearMaxValue }" [style.background]="segment.color" [style.width.%]="segment.percentage" - htTooltip="{{ segment.label }} : {{ segment.value | htDisplayNumber }}" + [htTooltip]="this.segmentsTooltip ? this.segmentsTooltip : plainTooltip" >
+ {{ segment.label }} : {{ segment.value | htDisplayNumber }} @@ -89,6 +91,9 @@ export class BarGaugeComponent implements OnChanges, AfterViewInit { @Input() public segments?: Segment[] = []; + @Input() + public segmentsTooltip?: TemplateRef; + @Input() public isOverMaxBorderActive: boolean = true; From 353572e9b860db3fe41dec0eb76f7bddc7049453 Mon Sep 17 00:00:00 2001 From: Patricio Albizu Date: Fri, 4 Mar 2022 15:52:49 -0300 Subject: [PATCH 2/8] feat: fix comments --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index 8c691738a..516519c05 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -49,7 +49,7 @@ import { [ngClass]="{ 'hide-last-divider': this.nearMaxValue }" [style.background]="segment.color" [style.width.%]="segment.percentage" - [htTooltip]="this.segmentsTooltip ? this.segmentsTooltip : plainTooltip" + [htTooltip]="segment.tooltip ?? plainTooltip" >
{{ segment.label }} : {{ segment.value | htDisplayNumber }} @@ -91,9 +91,6 @@ export class BarGaugeComponent implements OnChanges, AfterViewInit { @Input() public segments?: Segment[] = []; - @Input() - public segmentsTooltip?: TemplateRef; - @Input() public isOverMaxBorderActive: boolean = true; @@ -167,6 +164,7 @@ export interface Segment { label: string; value: number; color?: string; + tooltip?: TemplateRef; } interface BarSegment extends Segment { From 4c316e3c6cffb5f86c8419cc4a4c443359d6530a Mon Sep 17 00:00:00 2001 From: Patricio Albizu Date: Mon, 7 Mar 2022 15:02:51 -0300 Subject: [PATCH 3/8] feat: add htTooltipContext --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index 516519c05..b580d1256 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -50,6 +50,7 @@ import { [style.background]="segment.color" [style.width.%]="segment.percentage" [htTooltip]="segment.tooltip ?? plainTooltip" + [htTooltipContext]="{$implicit: segment}" >
{{ segment.label }} : {{ segment.value | htDisplayNumber }} From 02ffb770df28a0b20d49e35a78f90df280ae9a14 Mon Sep 17 00:00:00 2001 From: Patricio Albizu Date: Mon, 7 Mar 2022 15:14:15 -0300 Subject: [PATCH 4/8] feat: fix lint --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index b580d1256..58a5801a8 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -50,7 +50,7 @@ import { [style.background]="segment.color" [style.width.%]="segment.percentage" [htTooltip]="segment.tooltip ?? plainTooltip" - [htTooltipContext]="{$implicit: segment}" + [htTooltipContext]="{ $implicit: segment }" >
{{ segment.label }} : {{ segment.value | htDisplayNumber }} From 72ed3478dbd0236bf567af5ba74ffbf5e1131414 Mon Sep 17 00:00:00 2001 From: Patricio Albizu Date: Mon, 7 Mar 2022 16:03:00 -0300 Subject: [PATCH 5/8] feat: fix comments --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index 58a5801a8..b809e9eb9 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -165,7 +165,7 @@ export interface Segment { label: string; value: number; color?: string; - tooltip?: TemplateRef; + tooltip?: string | TemplateRef | TemplateRef<{ $implicit: Segment }>; } interface BarSegment extends Segment { From a0c451cad9ebeeac5a4c1b1636c753bfc8676732 Mon Sep 17 00:00:00 2001 From: palbizu <79482271+palbizu@users.noreply.github.com> Date: Tue, 8 Mar 2022 12:21:07 -0300 Subject: [PATCH 6/8] Update projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index b809e9eb9..845024623 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -165,7 +165,7 @@ export interface Segment { label: string; value: number; color?: string; - tooltip?: string | TemplateRef | TemplateRef<{ $implicit: Segment }>; + tooltip?: string | TemplateRef<{ $implicit: BarSegment }>; } interface BarSegment extends Segment { From 236126c082b24b2d2924425f8425a5cb1e6be779 Mon Sep 17 00:00:00 2001 From: Patricio Albizu Date: Tue, 8 Mar 2022 12:52:13 -0300 Subject: [PATCH 7/8] feat: adding segmentContext interface --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index b809e9eb9..bd0878ec3 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -165,13 +165,17 @@ export interface Segment { label: string; value: number; color?: string; - tooltip?: string | TemplateRef | TemplateRef<{ $implicit: Segment }>; + tooltip?: string | TemplateRef; } interface BarSegment extends Segment { percentage: number; } +export interface SegmentContext { + $implicit: BarSegment +} + export const enum BarGaugeStyle { Regular = 'regular', Compact = 'compact', From 41e7b8c7184a20db8efe29c3f2e6cd45926f8ff3 Mon Sep 17 00:00:00 2001 From: Patricio Albizu Date: Tue, 8 Mar 2022 12:54:14 -0300 Subject: [PATCH 8/8] feat: fix lintern --- .../src/shared/components/bar-gauge/bar-gauge.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts index bd0878ec3..c68866332 100644 --- a/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts +++ b/projects/observability/src/shared/components/bar-gauge/bar-gauge.component.ts @@ -173,7 +173,7 @@ interface BarSegment extends Segment { } export interface SegmentContext { - $implicit: BarSegment + $implicit: BarSegment; } export const enum BarGaugeStyle {