From 588a6401fa4cf0352bac83890933c62331bb75d6 Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Mon, 15 Jun 2026 19:02:20 +0200 Subject: [PATCH 1/6] Task/improve styling of checkboxes (#7046) * Improve styling * Update changelog --- CHANGELOG.md | 6 ++++++ apps/client/src/styles/theme.scss | 5 ++++- 2 files changed, 10 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4f023da8f..d384cd430 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## Unreleased + +### Changed + +- Improved the styling of the checkboxes to consistently use the primary color in their states + ## 3.11.0 - 2026-06-14 ### Added diff --git a/apps/client/src/styles/theme.scss b/apps/client/src/styles/theme.scss index ef2fa397c..75ecc210d 100644 --- a/apps/client/src/styles/theme.scss +++ b/apps/client/src/styles/theme.scss @@ -312,7 +312,10 @@ $gf-typography: ( @include mat.checkbox-overrides( ( - selected-icon-color: var(--gf-theme-primary-500) + selected-focus-icon-color: var(--gf-theme-primary-500), + selected-hover-icon-color: var(--gf-theme-primary-500), + selected-icon-color: var(--gf-theme-primary-500), + selected-pressed-icon-color: var(--gf-theme-primary-500) ) ); From d4610df0fe2b9dcef28f689e2c5aa837088183b6 Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Mon, 15 Jun 2026 19:41:10 +0200 Subject: [PATCH 2/6] Task/improve user id display in admin users component (#7048) * Do not wrap user id * Update changelog --- CHANGELOG.md | 1 + apps/client/src/app/components/admin-users/admin-users.html | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d384cd430..57ebb1f04 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed - Improved the styling of the checkboxes to consistently use the primary color in their states +- Improved the user id display in the users table of the admin control panel ## 3.11.0 - 2026-06-14 diff --git a/apps/client/src/app/components/admin-users/admin-users.html b/apps/client/src/app/components/admin-users/admin-users.html index 87ab9defc..0899c57d1 100644 --- a/apps/client/src/app/components/admin-users/admin-users.html +++ b/apps/client/src/app/components/admin-users/admin-users.html @@ -16,7 +16,7 @@ class="mat-mdc-cell px-1 py-2" mat-cell > -
+
Date: Mon, 15 Jun 2026 19:53:53 +0200 Subject: [PATCH 3/6] Task/improve link to GitHub discussions (#7045) * Improve links * Update translation * Update changelog --- CHANGELOG.md | 1 + .../src/app/pages/about/overview/about-overview-page.html | 2 +- apps/client/src/app/pages/faq/overview/faq-overview-page.html | 2 +- apps/client/src/app/pages/faq/saas/saas-page.html | 2 +- .../src/app/pages/faq/self-hosting/self-hosting-page.html | 2 +- apps/client/src/locales/messages.de.xlf | 2 +- 6 files changed, 6 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 57ebb1f04..4a799aa55 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Improved the styling of the checkboxes to consistently use the primary color in their states - Improved the user id display in the users table of the admin control panel +- Improved the language localization for German (`de`) ## 3.11.0 - 2026-06-14 diff --git a/apps/client/src/app/pages/about/overview/about-overview-page.html b/apps/client/src/app/pages/about/overview/about-overview-page.html index c28a63be2..ede2be190 100644 --- a/apps/client/src/app/pages/about/overview/about-overview-page.html +++ b/apps/client/src/app/pages/about/overview/about-overview-page.html @@ -94,7 +94,7 @@ or start a discussion at   GitHubGitHub.GitHub. or start a discussion at GitHub. or start a discussion at - oder beginne eine Diskussion unter + oder beginne eine Diskussion bei apps/client/src/app/pages/about/overview/about-overview-page.html 94 From 10fffd68cb749ab52aed06beeb5567f3076978bd Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Mon, 15 Jun 2026 19:55:21 +0200 Subject: [PATCH 4/6] Task/improve name display in activities table (#7043) * Do not wrap name * Update changelog --- CHANGELOG.md | 1 + .../activities-table/activities-table.component.html | 12 +++++------- 2 files changed, 6 insertions(+), 7 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4a799aa55..c981ab664 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed - Improved the styling of the checkboxes to consistently use the primary color in their states +- Improved the name display in the activities table - Improved the user id display in the users table of the admin control panel - Improved the language localization for German (`de`) diff --git a/libs/ui/src/lib/activities-table/activities-table.component.html b/libs/ui/src/lib/activities-table/activities-table.component.html index 1e57e8c7e..0041f5a14 100644 --- a/libs/ui/src/lib/activities-table/activities-table.component.html +++ b/libs/ui/src/lib/activities-table/activities-table.component.html @@ -161,13 +161,11 @@ Name -
-
- {{ element.SymbolProfile?.name }} - @if (element.isDraft) { - Draft - } -
+
+ {{ element.SymbolProfile?.name }} + @if (element.isDraft) { + Draft + }
@if ( element.SymbolProfile?.dataSource !== 'MANUAL' && From 9d06b3befa3e8e915dcc458caee7379259d64f04 Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Mon, 15 Jun 2026 19:58:13 +0200 Subject: [PATCH 5/6] Bugfix/chart error on interaction by registering annotation plugin early (#7049) * Fix chart error on interaction * Update changelog --- CHANGELOG.md | 4 ++++ .../benchmark-comparator/benchmark-comparator.component.ts | 2 -- .../investment-chart/investment-chart.component.ts | 5 +---- apps/client/src/main.ts | 3 +++ libs/ui/src/lib/chart/chart.registry.ts | 7 ++++++- 5 files changed, 14 insertions(+), 7 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index c981ab664..1ea25489d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Improved the user id display in the users table of the admin control panel - Improved the language localization for German (`de`) +### Fixed + +- Fixed a chart error on interaction by registering the annotation plugin early + ## 3.11.0 - 2026-06-14 ### Added diff --git a/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts b/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts index 8d13fb91d..c474e29ab 100644 --- a/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts +++ b/apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts @@ -44,7 +44,6 @@ import { type TooltipOptions } from 'chart.js'; import 'chartjs-adapter-date-fns'; -import annotationPlugin from 'chartjs-plugin-annotation'; import { addIcons } from 'ionicons'; import { arrowForwardOutline } from 'ionicons/icons'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; @@ -86,7 +85,6 @@ export class GfBenchmarkComparatorComponent implements OnChanges, OnDestroy { public constructor() { Chart.register( - annotationPlugin, LinearScale, LineController, LineElement, diff --git a/apps/client/src/app/components/investment-chart/investment-chart.component.ts b/apps/client/src/app/components/investment-chart/investment-chart.component.ts index e55aebdda..dc3152f12 100644 --- a/apps/client/src/app/components/investment-chart/investment-chart.component.ts +++ b/apps/client/src/app/components/investment-chart/investment-chart.component.ts @@ -40,9 +40,7 @@ import { type TooltipOptions } from 'chart.js'; import 'chartjs-adapter-date-fns'; -import annotationPlugin, { - type AnnotationOptions -} from 'chartjs-plugin-annotation'; +import { type AnnotationOptions } from 'chartjs-plugin-annotation'; import { isAfter } from 'date-fns'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; @@ -74,7 +72,6 @@ export class GfInvestmentChartComponent implements OnChanges, OnDestroy { public constructor() { Chart.register( - annotationPlugin, BarController, BarElement, LinearScale, diff --git a/apps/client/src/main.ts b/apps/client/src/main.ts index f596de5f4..45901baec 100644 --- a/apps/client/src/main.ts +++ b/apps/client/src/main.ts @@ -1,5 +1,6 @@ import { InfoResponse } from '@ghostfolio/common/interfaces'; import { filterGlobalPermissions } from '@ghostfolio/common/permissions'; +import { registerChartConfiguration } from '@ghostfolio/ui/chart'; import { GF_ENVIRONMENT } from '@ghostfolio/ui/environment'; import { GfNotificationModule } from '@ghostfolio/ui/notifications'; @@ -58,6 +59,8 @@ import { environment } from './environments/environment'; enableProdMode(); } + registerChartConfiguration(); + await bootstrapApplication(GfAppComponent, { providers: [ authInterceptorProviders, diff --git a/libs/ui/src/lib/chart/chart.registry.ts b/libs/ui/src/lib/chart/chart.registry.ts index 465d6e716..a6a8b3e55 100644 --- a/libs/ui/src/lib/chart/chart.registry.ts +++ b/libs/ui/src/lib/chart/chart.registry.ts @@ -1,6 +1,7 @@ import { getTooltipPositionerMapTop } from '@ghostfolio/common/chart-helper'; -import { Tooltip, TooltipPositionerFunction, ChartType } from 'chart.js'; +import { Chart, Tooltip, TooltipPositionerFunction, ChartType } from 'chart.js'; +import annotationPlugin from 'chartjs-plugin-annotation'; interface VerticalHoverLinePluginOptions { color?: string; @@ -23,6 +24,10 @@ export function registerChartConfiguration() { return; } + // Register the annotation plugin early so that every chart is initialized + // with its state and does not crash on interaction + Chart.register(annotationPlugin); + Tooltip.positioners.top = function (_elements, eventPosition) { return getTooltipPositionerMapTop(this.chart, eventPosition); }; From f4d17c786ae94e36251049a3a537d9addd01b7ed Mon Sep 17 00:00:00 2001 From: Parman Mohammadalizadeh Date: Mon, 15 Jun 2026 21:44:29 +0330 Subject: [PATCH 6/6] Bugfix/open account details dialog on allocations page (#6988) * Fix open account details dialog * Update changelog --------- Co-authored-by: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> --- CHANGELOG.md | 1 + .../allocations/allocations-page.component.ts | 6 +++--- .../interfaces/interfaces.ts | 5 +++++ .../portfolio-proportion-chart.component.ts | 18 +++++++++--------- 4 files changed, 18 insertions(+), 12 deletions(-) create mode 100644 libs/ui/src/lib/portfolio-proportion-chart/interfaces/interfaces.ts diff --git a/CHANGELOG.md b/CHANGELOG.md index 1ea25489d..cbd9369b6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Fixed - Fixed a chart error on interaction by registering the annotation plugin early +- Fixed an issue on the allocations page where clicking an account in the _By Account_ chart did not open the detail dialog ## 3.11.0 - 2026-06-14 diff --git a/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts b/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts index d53977ae8..26601ad59 100644 --- a/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts +++ b/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts @@ -185,10 +185,10 @@ export class GfAllocationsPageComponent implements OnInit { this.initialize(); } - public onAccountChartClicked({ symbol }: AssetProfileIdentifier) { - if (symbol && symbol !== UNKNOWN_KEY) { + public onAccountChartClicked({ accountId }: { accountId: string }) { + if (accountId && accountId !== UNKNOWN_KEY) { this.router.navigate([], { - queryParams: { accountId: symbol, accountDetailDialog: true } + queryParams: { accountId, accountDetailDialog: true } }); } } diff --git a/libs/ui/src/lib/portfolio-proportion-chart/interfaces/interfaces.ts b/libs/ui/src/lib/portfolio-proportion-chart/interfaces/interfaces.ts new file mode 100644 index 000000000..25d12b049 --- /dev/null +++ b/libs/ui/src/lib/portfolio-proportion-chart/interfaces/interfaces.ts @@ -0,0 +1,5 @@ +import { AssetProfileIdentifier } from '@ghostfolio/common/interfaces'; + +export type PortfolioProportionChartClickEvent = + | AssetProfileIdentifier + | { accountId: string }; 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 e2c41e956..bf6fd193e 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,10 +1,7 @@ import { getTooltipOptions } from '@ghostfolio/common/chart-helper'; import { UNKNOWN_KEY } from '@ghostfolio/common/config'; import { getLocale, getSum, getTextColor } from '@ghostfolio/common/helper'; -import { - AssetProfileIdentifier, - PortfolioPosition -} from '@ghostfolio/common/interfaces'; +import { PortfolioPosition } from '@ghostfolio/common/interfaces'; import { ColorScheme } from '@ghostfolio/common/types'; import { @@ -36,6 +33,8 @@ import Color from 'color'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; import OpenColor from 'open-color'; +import { PortfolioProportionChartClickEvent } from './interfaces/interfaces'; + const { blue, cyan, @@ -80,7 +79,8 @@ export class GfPortfolioProportionChartComponent public chart: Chart<'doughnut'>; public isLoading = true; - protected readonly proportionChartClicked = output(); + protected readonly proportionChartClicked = + output(); private readonly OTHER_KEY = 'OTHER'; @@ -355,11 +355,11 @@ export class GfPortfolioProportionChartComponent const dataIndex = activeElements[0].index; const symbol = chart.data.labels?.[dataIndex] as string; - const dataSource = this.data[symbol].dataSource; + const dataSource = this.data[symbol]?.dataSource; - if (dataSource) { - this.proportionChartClicked.emit({ dataSource, symbol }); - } + this.proportionChartClicked.emit( + dataSource ? { dataSource, symbol } : { accountId: symbol } + ); } catch {} }, onHover: (event, chartElement) => {