Task/improve storybook setup (#7691)

* Load @angular/localize centrally

* Disable telemetry

* Update changelog

CHANGELOG.md

@@ -9,8 +9,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 
+- Disabled the telemetry in the _Storybook_ setup
 - Upgraded the `Node.js` engine from version `>=22.18.0` to `>=22.22.3` (`package.json`)
 
+### Fixed
+
+- Fixed the _Storybook_ setup by loading the `@angular/localize` polyfill centrally
+
 ## 3.57.0 - 2026-08-21
 
 ### Added

libs/ui/.storybook/main.mjs

@@ -9,6 +9,9 @@ const config = {
     getAbsolutePath('@storybook/addon-docs'),
     getAbsolutePath('@storybook/addon-themes')
   ],
+  core: {
+    disableTelemetry: true
+  },
   framework: {
     name: getAbsolutePath('@storybook/angular'),
     options: {}

libs/ui/.storybook/preview.js

@@ -1,3 +1,4 @@
+import '@angular/localize/init';
 import { withThemeByClassName } from '@storybook/addon-themes';
 
 const preview = {

libs/ui/src/lib/account-selector/account-selector.component.stories.ts

@@ -3,7 +3,6 @@ import { AccountWithPlatform } from '@ghostfolio/common/types';
 import { CommonModule } from '@angular/common';
 import { ANIMATION_MODULE_TYPE, importProvidersFrom } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
-import '@angular/localize/init';
 import {
   applicationConfig,
   Meta,

libs/ui/src/lib/currency-selector/currency-selector.component.stories.ts

@@ -1,6 +1,5 @@
 import { ANIMATION_MODULE_TYPE } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
-import '@angular/localize/init';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { Meta, moduleMetadata, StoryObj } from '@storybook/angular';
 

libs/ui/src/lib/fear-and-greed-index/fear-and-greed-index.component.stories.ts

@@ -1,4 +1,3 @@
-import '@angular/localize/init';
 import { moduleMetadata } from '@storybook/angular';
 import type { Meta, StoryObj } from '@storybook/angular';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';

libs/ui/src/lib/fire-calculator/fire-calculator.component.stories.ts

@@ -3,7 +3,6 @@ import { DEFAULT_LOCALE } from '@ghostfolio/common/config';
 import { CommonModule } from '@angular/common';
 import { ANIMATION_MODULE_TYPE } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import '@angular/localize/init';
 import { MatButtonModule } from '@angular/material/button';
 import { provideNativeDateAdapter } from '@angular/material/core';
 import { MatDatepickerModule } from '@angular/material/datepicker';

libs/ui/src/lib/membership-card/membership-card.component.stories.ts

@@ -1,5 +1,4 @@
 import { CommonModule } from '@angular/common';
-import '@angular/localize/init';
 import { MatButtonModule } from '@angular/material/button';
 import { ActivatedRoute, RouterModule } from '@angular/router';
 import { IonIcon } from '@ionic/angular/standalone';

libs/ui/src/lib/portfolio-filter-form/portfolio-filter-form.component.stories.ts

@@ -1,6 +1,5 @@
 import { AccountWithPlatform } from '@ghostfolio/common/types';
 
-import '@angular/localize/init';
 import { Meta, moduleMetadata, StoryObj } from '@storybook/angular';
 
 import { holdings } from '../mocks/holdings';

libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.stories.ts

@@ -1,5 +1,4 @@
 import { CommonModule } from '@angular/common';
-import '@angular/localize/init';
 import { moduleMetadata } from '@storybook/angular';
 import type { Meta, StoryObj } from '@storybook/angular';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';

libs/ui/src/lib/tags-selector/tags-selector.component.stories.ts

@@ -1,6 +1,5 @@
 import { CommonModule } from '@angular/common';
 import { ANIMATION_MODULE_TYPE } from '@angular/core';
-import '@angular/localize/init';
 import { Meta, moduleMetadata, StoryObj } from '@storybook/angular';
 
 import { GfTagsSelectorComponent } from './tags-selector.component';

libs/ui/src/lib/treemap-chart/treemap-chart.component.stories.ts

@@ -1,7 +1,6 @@
 import { DEFAULT_COLOR_SCHEME } from '@ghostfolio/common/config';
 
 import { CommonModule } from '@angular/common';
-import '@angular/localize/init';
 import { moduleMetadata } from '@storybook/angular';
 import type { Meta, StoryObj } from '@storybook/angular';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';

libs/ui/src/lib/value/value.component.stories.ts

@@ -1,5 +1,4 @@
 import { ANIMATION_MODULE_TYPE } from '@angular/core';
-import '@angular/localize/init';
 import { applicationConfig, moduleMetadata } from '@storybook/angular';
 import type { Meta, StoryObj } from '@storybook/angular';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';