From 422d85f59fb7c2bd2eb85cb17f1620a1766d71e1 Mon Sep 17 00:00:00 2001 From: Josep Piguillem Date: Mon, 27 Jul 2026 23:52:08 +0200 Subject: [PATCH] fix: actualiza chart.js/ngx-translate a sus APIs actuales y separa export type en el barrel --- libs/ui/src/index.ts | 3 +- libs/ui/src/lib/ui/chart/chart.configs.ts | 20 +++---- .../ui/src/lib/util/translate/i18n.service.ts | 2 +- .../loaders/translate-browser.loader.ts | 60 ++++++++----------- .../lib/util/translate/translate.module.ts | 22 ++----- libs/ui/tsconfig.lib.json | 4 +- 6 files changed, 47 insertions(+), 64 deletions(-) diff --git a/libs/ui/src/index.ts b/libs/ui/src/index.ts index 30b07db..e4e9035 100644 --- a/libs/ui/src/index.ts +++ b/libs/ui/src/index.ts @@ -13,7 +13,8 @@ export * from './lib/util/form-control'; export * from './lib/util/icon-registry'; export * from './lib/util/infinite-scroll'; // ./lib/util/list-configs: omitido(s) por colisión con otro módulo -> featureKey, getFeatureState, initialState -export { ListConfigsFacade, ListConfigsState, ListMode, ListModeActionsType, getListMode, listConfigsReducer, resetListMode, setListMode } from './lib/util/list-configs'; +export { getListMode, ListConfigsFacade, listConfigsReducer, ListModeActionsType, resetListMode, setListMode } from './lib/util/list-configs'; +export type { ListConfigsState, ListMode } from './lib/util/list-configs'; export * from './lib/util/loaders'; export * from './lib/util/local-storage'; export * from './lib/util/menu'; diff --git a/libs/ui/src/lib/ui/chart/chart.configs.ts b/libs/ui/src/lib/ui/chart/chart.configs.ts index 2da693c..ed0660a 100644 --- a/libs/ui/src/lib/ui/chart/chart.configs.ts +++ b/libs/ui/src/lib/ui/chart/chart.configs.ts @@ -1,13 +1,15 @@ import { DatasetColor } from '../../util/models'; -import { - ChartTypeRegistry, - ScaleOptionsByType, - TooltipOptions -} from 'chart.js'; +import { ChartOptions } from 'chart.js'; -type DeepPartial = T extends object ? { [P in keyof T]?: DeepPartial } : T; +/** + * chart.js 4 ya no expone `_DeepPartialObject` en un subpath importable + * (`chart.js/dist/types/utils` no está en su mapa de `exports`), así que + * derivamos los tipos de las propias opciones del gráfico. + */ +type TooltipConfig = NonNullable['plugins']>['tooltip']>; +type ScalesConfig = NonNullable['scales']>; -export const tooltipConfig: DeepPartial> = { +export const tooltipConfig: TooltipConfig = { backgroundColor: DatasetColor.white, bodyFont: { family: 'Soehne', @@ -34,9 +36,7 @@ export const tooltipConfig: DeepPartial> = { titleMarginBottom: 0, }; -export const scalesConfig: DeepPartial<{ - [key: string]: ScaleOptionsByType; -}> = { +export const scalesConfig: ScalesConfig = { x: { display: true, grid: { diff --git a/libs/ui/src/lib/util/translate/i18n.service.ts b/libs/ui/src/lib/util/translate/i18n.service.ts index b3e1254..5220688 100644 --- a/libs/ui/src/lib/util/translate/i18n.service.ts +++ b/libs/ui/src/lib/util/translate/i18n.service.ts @@ -12,7 +12,7 @@ export class I18nService { return new Observable((observer) => { this.translateService.use(lang).subscribe({ next: () => { - observer.next(); + observer.next(undefined); observer.complete(); }, diff --git a/libs/ui/src/lib/util/translate/loaders/translate-browser.loader.ts b/libs/ui/src/lib/util/translate/loaders/translate-browser.loader.ts index 236f764..1ee9055 100644 --- a/libs/ui/src/lib/util/translate/loaders/translate-browser.loader.ts +++ b/libs/ui/src/lib/util/translate/loaders/translate-browser.loader.ts @@ -1,35 +1,25 @@ -import { Observable } from 'rxjs'; -import { TranslateLoader } from '@ngx-translate/core'; - -import { makeStateKey, StateKey, TransferState } from '@angular/core'; -import { TranslateHttpLoader } from '@ngx-translate/http-loader'; -import { HttpClient } from '@angular/common/http'; - -export class TranslateBrowserLoader implements TranslateLoader { - constructor(private http: HttpClient, private transferState: TransferState) {} - - public getTranslation(lang: string): Observable { - const key: StateKey = makeStateKey( - 'transfer-translate-' + lang - ); - const data = this.transferState.get(key, null); - - // First we are looking for the translations in transfer-state, - // if none found, http load as fallback - if (data) { - return new Observable((observer) => { - observer.next(data); - observer.complete(); - }); - } else { - return new TranslateHttpLoader(this.http).getTranslation(lang); - } - } -} - -export function translateBrowserLoaderFactory( - httpClient: HttpClient, - transferState: TransferState -) { - return new TranslateBrowserLoader(httpClient, transferState); -} +import { Observable, of } from 'rxjs'; +import { TranslateLoader } from '@ngx-translate/core'; + +import { Injectable, makeStateKey, StateKey, TransferState, inject } from '@angular/core'; +import { TranslateHttpLoader } from '@ngx-translate/http-loader'; + +/** + * En ngx-translate 18 `TranslateHttpLoader` tiene constructor sin argumentos y + * se resuelve por inyección (antes recibía el HttpClient), así que este loader + * pasa a ser inyectable en vez de construirse a mano con una factoría. + */ +@Injectable() +export class TranslateBrowserLoader implements TranslateLoader { + private readonly transferState = inject(TransferState); + private readonly httpLoader = inject(TranslateHttpLoader); + + public getTranslation(lang: string): Observable { + const key: StateKey = makeStateKey('transfer-translate-' + lang); + const data = this.transferState.get(key, null); + + // First we are looking for the translations in transfer-state, + // if none found, http load as fallback + return data ? of(data) : this.httpLoader.getTranslation(lang); + } +} diff --git a/libs/ui/src/lib/util/translate/translate.module.ts b/libs/ui/src/lib/util/translate/translate.module.ts index f7373c7..1f51195 100644 --- a/libs/ui/src/lib/util/translate/translate.module.ts +++ b/libs/ui/src/lib/util/translate/translate.module.ts @@ -1,28 +1,18 @@ -import { HttpClient } from '@angular/common/http'; import { EnvironmentProviders, makeEnvironmentProviders, provideAppInitializer, inject } from '@angular/core'; -import { TranslateLoader, TranslateService, provideTranslateService } from '@ngx-translate/core'; -import { TranslateHttpLoader } from '@ngx-translate/http-loader'; +import { TranslateService, provideTranslateService } from '@ngx-translate/core'; +import { provideTranslateHttpLoader } from '@ngx-translate/http-loader'; import { appInitializerFactory } from './custom-initializer'; -export function createTranslateLoader(http: HttpClient): TranslateHttpLoader { - return new TranslateHttpLoader(http, './assets/i18n/', '.json'); -} - /** * Sustituye a `PiSharedUtilTranslateModule`: ngx-translate 18 ya no expone - * `TranslateModule.forRoot()`, la configuración se hace con providers. + * `TranslateModule.forRoot()` y `TranslateHttpLoader` se configura con + * `provideTranslateHttpLoader` en vez de por constructor. */ export function providePiTranslate(): EnvironmentProviders { return makeEnvironmentProviders([ - provideTranslateService({ - fallbackLang: 'es', - loader: { - provide: TranslateLoader, - useFactory: createTranslateLoader, - deps: [HttpClient], - }, - }), + provideTranslateService({ fallbackLang: 'es' }), + provideTranslateHttpLoader({ prefix: './assets/i18n/', suffix: '.json' }), provideAppInitializer(() => appInitializerFactory(inject(TranslateService))()), ]); } diff --git a/libs/ui/tsconfig.lib.json b/libs/ui/tsconfig.lib.json index 5bfe57f..3171703 100644 --- a/libs/ui/tsconfig.lib.json +++ b/libs/ui/tsconfig.lib.json @@ -5,7 +5,9 @@ "declaration": true, "declarationMap": true, "inlineSources": true, - "types": [] + "types": [ + "node" + ] }, "include": [ "src/**/*.ts"