Merge branch 'main' into pr/6988

CHANGELOG.md

@@ -10,6 +10,13 @@ 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`)
+
+### Fixed
+
+- Fixed a chart error on interaction by registering the annotation plugin early
 
 ### Fixed
 

apps/client/src/app/components/admin-users/admin-users.html

@@ -16,7 +16,7 @@
               class="mat-mdc-cell px-1 py-2"
               mat-cell
             >
-              <div class="d-flex align-items-center">
+              <div class="align-items-center d-flex text-nowrap">
                 <span
                   class="d-none d-sm-inline-block text-monospace"
                   [class.text-line-through]="element.role === 'INACTIVE'"

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,

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, {
+import { type AnnotationOptions } from 'chartjs-plugin-annotation';
-  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,

apps/client/src/app/pages/about/overview/about-overview-page.html

@@ -94,7 +94,7 @@
           <ng-container i18n>or start a discussion at</ng-container>
           <ng-container>&nbsp;</ng-container>
           <a
-            href="https://github.com/ghostfolio/ghostfolio"
+            href="https://github.com/ghostfolio/ghostfolio/discussions"
             i18n-title
             title="Find Ghostfolio on GitHub"
             >GitHub</a

apps/client/src/app/pages/faq/overview/faq-overview-page.html

@@ -193,7 +193,7 @@
           }
           or start a discussion at
           <a
-            href="https://github.com/ghostfolio/ghostfolio"
+            href="https://github.com/ghostfolio/ghostfolio/discussions"
             title="Find Ghostfolio on GitHub"
             >GitHub</a
           >.</mat-card-content

apps/client/src/app/pages/faq/saas/saas-page.html

@@ -186,7 +186,7 @@
           }
           or start a discussion at
           <a
-            href="https://github.com/ghostfolio/ghostfolio"
+            href="https://github.com/ghostfolio/ghostfolio/discussions"
             title="Find Ghostfolio on GitHub"
             >GitHub</a
           >.</mat-card-content

apps/client/src/app/pages/faq/self-hosting/self-hosting-page.html

@@ -294,7 +294,7 @@
           >
           or start a discussion at
           <a
-            href="https://github.com/ghostfolio/ghostfolio"
+            href="https://github.com/ghostfolio/ghostfolio/discussions"
             title="Find Ghostfolio on GitHub"
             >GitHub</a
           >.</mat-card-content

apps/client/src/locales/messages.de.xlf

@@ -2143,7 +2143,7 @@
       </trans-unit>
       <trans-unit id="7500665368930738879" datatype="html">
         <source>or start a discussion at</source>
-        <target state="translated">oder beginne eine Diskussion unter</target>
+        <target state="translated">oder beginne eine Diskussion bei</target>
         <context-group purpose="location">
           <context context-type="sourcefile">apps/client/src/app/pages/about/overview/about-overview-page.html</context>
           <context context-type="linenumber">94</context>

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,

libs/ui/src/lib/activities-table/activities-table.component.html

@@ -161,13 +161,11 @@
         <ng-container i18n>Name</ng-container>
       </th>
       <td *matCellDef="let element" class="px-1" mat-cell>
-        <div class="align-items-center d-flex line-height-1">
+        <div class="align-items-center d-flex line-height-1 text-nowrap">
-          <div>
+          <span class="text-truncate">{{ element.SymbolProfile?.name }}</span>
-            <span class="text-truncate">{{ element.SymbolProfile?.name }}</span>
+          @if (element.isDraft) {
-            @if (element.isDraft) {
+            <span class="badge badge-secondary ml-1" i18n>Draft</span>
-              <span class="badge badge-secondary ml-1" i18n>Draft</span>
+          }
-            }
-          </div>
         </div>
         @if (
           element.SymbolProfile?.dataSource !== 'MANUAL' &&

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);
   };