From a337c76c09643adeaa95713fa5e56aaf38ef529f Mon Sep 17 00:00:00 2001 From: Ben Meyrick Date: Thu, 30 Jan 2025 15:55:47 +0000 Subject: [PATCH] Add ability to dynamically add translation asset paths --- packages/ng-lazy-translate/README.md | 43 ++++++++++++++++++- .../models/translate-module-config.model.ts | 2 +- .../src/lib/translate.service.ts | 19 +++++++- 3 files changed, 60 insertions(+), 4 deletions(-) diff --git a/packages/ng-lazy-translate/README.md b/packages/ng-lazy-translate/README.md index 347ffa2..d0ba492 100644 --- a/packages/ng-lazy-translate/README.md +++ b/packages/ng-lazy-translate/README.md @@ -12,6 +12,22 @@ Lazy loaded translation module for Angular using [messageformat](https://message [![Security Rating](https://sonarcloud.io/api/project_badges/measure?project=bameyrick_ng-lazy-translate&metric=security_rating)](https://sonarcloud.io/summary/new_code?id=bameyrick_ng-lazy-translate) [![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=bameyrick_ng-lazy-translate&metric=sqale_rating)](https://sonarcloud.io/summary/new_code?id=bameyrick_ng-lazy-translate) +- [@qntm-code/ng-lazy-translate](#qntm-codeng-lazy-translate) + - [Installation](#installation) + - [Usage - Standalone Components](#usage---standalone-components) + - [1. Create providers](#1-create-providers) + - [Usage - Within a Module](#usage---within-a-module) + - [1. Import Module](#1-import-module) + - [2. Import module in component](#2-import-module-in-component) + - [Using pipe in a template](#using-pipe-in-a-template) + - [Using the service in a component/service](#using-the-service-in-a-componentservice) + - [Dynamically adding translation asset paths](#dynamically-adding-translation-asset-paths) + - [LazyTranslateModuleConfig](#lazytranslatemoduleconfig) + - [Language](#language) + - [TranslationAssetPaths](#translationassetpaths) + - [Translation files](#translation-files) + - [Default value](#default-value) + ## Installation ```bash @@ -134,6 +150,31 @@ export class MyService { } ``` +## Dynamically adding translation asset paths + +You can dynamically add translation asset paths by calling the `addTranslationAssetPaths` method on the `LazyTranslateService`: + +```typescript +import { LazyTranslateService } from '@qntm-code/ng-lazy-translate'; + +export const appRoutes: Route[] = [ + { + path: '', + loadChildren: () => + import('./home/home.module').then(({ HomeModule }) => { + const translateService = inject(LazyTranslateService); + + translateService.addTranslationAssetPaths({ + 'en.home': 'assets/i18n/en/home.json', + 'fr.home': 'assets/i18n/fr/home.json', + }); + + return HomeModule; + }), + }, +]; +``` + ## LazyTranslateModuleConfig Whether you use the standalone components or the module, the LazyTranslateModuleConfig options are the same. @@ -142,7 +183,7 @@ Whether you use the standalone components or the module, the LazyTranslateModule | ------------------------- | ----------------------------------------------- | ----------------------------------------------------------------------------------------------------------------- | --------- | ---------------------------- | | defaultLanguage | string | The default language to use if no language is specified | Yes | N/A | | languages | [Language[]](#language) | The list of languages to support | Yes | N/A | -| translationAssetPaths | [TranslationAssetPaths](#translationassetpaths) | The list of translation assets to load. The key is the language and the translation file name. | Yes | N/A | +| translationAssetPaths | [TranslationAssetPaths](#translationassetpaths) | The list of translation assets to load. The key is the language and the translation file name. | No | N/A | | useDefaultLanguage | boolean | Whether to use the default language if the specified language is not found | No | `true` | | enableLogging | boolean | Whether to enable logging of missing translations | No | `true` | | missingTranslationHandler | (language: string, key: string) => void | A custom handler to use when a translation is not found. If not specified, the default handler will be used. | No | Will console.error a message | diff --git a/packages/ng-lazy-translate/src/lib/models/translate-module-config.model.ts b/packages/ng-lazy-translate/src/lib/models/translate-module-config.model.ts index 7e52070..f793a29 100644 --- a/packages/ng-lazy-translate/src/lib/models/translate-module-config.model.ts +++ b/packages/ng-lazy-translate/src/lib/models/translate-module-config.model.ts @@ -6,7 +6,7 @@ import { TranslationAssetPaths } from './translation-asset-paths.model'; export interface LazyTranslateModuleConfig { languages: Language[]; defaultLanguage: string; - translationAssetPaths: TranslationAssetPaths; + translationAssetPaths?: TranslationAssetPaths; useDefaultLanguage?: boolean; enableLogging?: boolean; missingTranslationHandler?: MissingTranslationHandlerFn; diff --git a/packages/ng-lazy-translate/src/lib/translate.service.ts b/packages/ng-lazy-translate/src/lib/translate.service.ts index 1a3ec7b..f6193c5 100644 --- a/packages/ng-lazy-translate/src/lib/translate.service.ts +++ b/packages/ng-lazy-translate/src/lib/translate.service.ts @@ -21,7 +21,7 @@ import { shareReplay, withLatestFrom, } from 'rxjs'; -import { LazyTranslateModuleConfig } from './models'; +import { LazyTranslateModuleConfig, TranslationAssetPaths } from './models'; import { NG_LAZY_TRANSLATE_CONFIG } from './tokens'; @Injectable() @@ -51,9 +51,15 @@ export class LazyTranslateService { */ private readonly config: LazyTranslateModuleConfig; + private readonly translationAssetPaths = new Map(); + constructor(@Inject(NG_LAZY_TRANSLATE_CONFIG) config: LazyTranslateModuleConfig, private readonly http: HttpClient) { this.config = { useDefaultLanguage: true, enableLogging: true, ...config }; + if (this.config.translationAssetPaths) { + this.addTranslationPaths(this.config.translationAssetPaths); + } + this.defaultLanguage$ = new BehaviorSubject(this.config.defaultLanguage); this.language$ = new BehaviorSubject( @@ -73,6 +79,13 @@ export class LazyTranslateService { } } + /** + * Adds translation asset paths + */ + public addTranslationPaths(paths: TranslationAssetPaths): void { + Object.entries(paths).forEach(([key, value]) => this.translationAssetPaths.set(key, value)); + } + public setLanguage(language: string): void { this.language$.next(this.getValidLanguageCode(language)); } @@ -167,7 +180,7 @@ export class LazyTranslateService { * Downloads a language file for a given namespace */ private downloadFile(language: string, namespace: string): Observable | undefined> { - const path = this.config.translationAssetPaths[`${language}.${namespace}`]; + const path = this.translationAssetPaths.get(`${language}.${namespace}`); if (!path) { if (this.config.missingFileHandler) { @@ -175,6 +188,8 @@ export class LazyTranslateService { } else if (this.config.enableLogging) { console.error(`File with namespace ${namespace} not found for language ${language}`); } + + return of(undefined); } let observable = this.downloadedRequests[path];