From c794465d5357f0ed41708bbaebb06206ef63ef06 Mon Sep 17 00:00:00 2001 From: KenTandrian Date: Sun, 27 Sep 2026 01:38:25 +0700 Subject: [PATCH 1/4] fix(ui): widen input types in portfolio proportion chart component --- .../portfolio-proportion-chart.component.ts | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts index 9a215ee5b3..df5e3019a2 100644 --- a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts +++ b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts @@ -1,5 +1,5 @@ import { getTooltipOptions } from '@ghostfolio/common/chart-helper'; -import { UNKNOWN_KEY } from '@ghostfolio/common/config'; +import { DEFAULT_COLOR_SCHEME, UNKNOWN_KEY } from '@ghostfolio/common/config'; import { getLocale, getSum, getTextColor } from '@ghostfolio/common/helper'; import { PortfolioPosition } from '@ghostfolio/common/interfaces'; import { ColorScheme } from '@ghostfolio/common/types'; @@ -60,8 +60,8 @@ const { export class GfPortfolioProportionChartComponent implements AfterViewInit, OnChanges, OnDestroy { - @Input() baseCurrency: string; - @Input() colorScheme: ColorScheme; + @Input() baseCurrency?: string = ''; + @Input() colorScheme?: ColorScheme = DEFAULT_COLOR_SCHEME; @Input() cursor: string; @Input() data: { [symbol: string]: Pick & { @@ -71,9 +71,9 @@ export class GfPortfolioProportionChartComponent value: number; }; } = {}; - @Input() isInPercentage = false; + @Input() isInPercentage?: boolean = false; @Input() keys: string[] = []; - @Input() locale = getLocale(); + @Input() locale?: string = getLocale(); @Input() maxItems?: number; @Input() showLabels = false; @@ -123,8 +123,8 @@ export class GfPortfolioProportionChartComponent }; } = {}; this.colorMap = { - [this.OTHER_KEY]: `rgba(${getTextColor(this.colorScheme)}, 0.24)`, - [UNKNOWN_KEY]: `rgba(${getTextColor(this.colorScheme)}, 0.12)` + [this.OTHER_KEY]: `rgba(${getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME)}, 0.24)`, + [UNKNOWN_KEY]: `rgba(${getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME)}, 0.12)` }; if (this.keys.length > 0) { @@ -444,7 +444,7 @@ export class GfPortfolioProportionChartComponent ): Partial> { return { ...getTooltipOptions({ - colorScheme: this.colorScheme, + colorScheme: this.colorScheme ?? DEFAULT_COLOR_SCHEME, currency: this.baseCurrency, locale: this.locale }), From 455efc2035d22e1c93723e5c36dc34f649d26f95 Mon Sep 17 00:00:00 2001 From: KenTandrian Date: Sun, 27 Sep 2026 01:44:33 +0700 Subject: [PATCH 2/4] fix(ui): reformat file --- .../portfolio-proportion-chart.component.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts index df5e3019a2..36759772be 100644 --- a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts +++ b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts @@ -123,7 +123,8 @@ export class GfPortfolioProportionChartComponent }; } = {}; this.colorMap = { - [this.OTHER_KEY]: `rgba(${getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME)}, 0.24)`, + [this.OTHER_KEY]: + `rgba(${getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME)}, 0.24)`, [UNKNOWN_KEY]: `rgba(${getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME)}, 0.12)` }; From f25de494a6388ab8f0621300bea437089cd3f88e Mon Sep 17 00:00:00 2001 From: KenTandrian Date: Sun, 27 Sep 2026 23:20:10 +0700 Subject: [PATCH 3/4] resolve comments --- .../portfolio-proportion-chart.component.ts | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts index 36759772be..a1e2b5e76a 100644 --- a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts +++ b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts @@ -60,14 +60,14 @@ const { export class GfPortfolioProportionChartComponent implements AfterViewInit, OnChanges, OnDestroy { - @Input() baseCurrency?: string = ''; - @Input() colorScheme?: ColorScheme = DEFAULT_COLOR_SCHEME; + @Input() baseCurrency?: string; + @Input() colorScheme?: ColorScheme; @Input() cursor: string; @Input() data: { [symbol: string]: Pick & { dataSource?: DataSource; isClickable?: boolean; - name: string; + name?: string | null; value: number; }; } = {}; @@ -122,10 +122,11 @@ export class GfPortfolioProportionChartComponent value: Big; }; } = {}; + const textColor = getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME); + this.colorMap = { - [this.OTHER_KEY]: - `rgba(${getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME)}, 0.24)`, - [UNKNOWN_KEY]: `rgba(${getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME)}, 0.12)` + [this.OTHER_KEY]: `rgba(${textColor}, 0.24)`, + [UNKNOWN_KEY]: `rgba(${textColor}, 0.12)` }; if (this.keys.length > 0) { @@ -179,7 +180,7 @@ export class GfPortfolioProportionChartComponent ); } else { chartData[UNKNOWN_KEY] = { - name: this.data[symbol].name, + name: this.data[symbol].name ?? '', subCategory: secondaryKey ? { [secondaryKey]: { value: new Big(0) } } : undefined, @@ -191,7 +192,7 @@ export class GfPortfolioProportionChartComponent } else { Object.keys(this.data).forEach((symbol) => { chartData[symbol] = { - name: this.data[symbol].name, + name: this.data[symbol].name ?? '', value: new Big(this.data[symbol].value || 0) }; }); @@ -487,7 +488,7 @@ export class GfPortfolioProportionChartComponent `${value.toLocaleString(this.locale, { maximumFractionDigits: 2, minimumFractionDigits: 2 - })} ${this.baseCurrency} (${percentage.toFixed(2)}%)` + })} ${this.baseCurrency ?? ''} (${percentage.toFixed(2)}%)` ]; } }, From e98e3d7ff9312daa1e76e2d0b215cd7e46b86ec2 Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Mon, 28 Sep 2026 14:43:28 +0200 Subject: [PATCH 4/4] Clean up --- .../portfolio-proportion-chart.component.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts index a1e2b5e76a..bf2f595c26 100644 --- a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts +++ b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts @@ -114,6 +114,7 @@ export class GfPortfolioProportionChartComponent private initialize() { this.isLoading = true; + const chartData: { [symbol: string]: { color?: string; @@ -122,6 +123,7 @@ export class GfPortfolioProportionChartComponent value: Big; }; } = {}; + const textColor = getTextColor(this.colorScheme ?? DEFAULT_COLOR_SCHEME); this.colorMap = {