feat(store): clean implementation

Author: CodeAndWeb

projects/ngx-translate/src/lib/translate.service.ts

@@ -185,8 +185,6 @@ export class TranslateService implements ITranslateService, OnDestroy {
     private missingTranslationHandler = inject(MissingTranslationHandler);
     private store: TranslateStore = inject(TranslateStore);
 
-    private _loaderIndex!: number;
-
     private readonly extend: boolean = false;
 
     /**
@@ -227,8 +225,6 @@ export class TranslateService implements ITranslateService, OnDestroy {
     }
 
     constructor() {
-        this._loaderIndex = this.store.addLoader(inject(TranslateLoader));
-
         const config: TranslateServiceConfig = {
             extend: false,
             fallbackLang: null,
@@ -249,10 +245,12 @@ export class TranslateService implements ITranslateService, OnDestroy {
         if (config.extend) {
             this.extend = true;
         }
+
+        this.store.addLoader(this.currentLoader);
     }
 
-    ngOnDestroy() {
-        this.store.removeLoader(this._loaderIndex);
+    ngOnDestroy(): void {
+        this.store.removeLoader(this.currentLoader);
     }
 
     /**
@@ -350,28 +348,24 @@ export class TranslateService implements ITranslateService, OnDestroy {
         this.pending = true;
 
         const loaders = this.store.getLoaders();
-        if (loaders.size === 0) return of({} as InterpolatableTranslationObject);
-
-        const requests: Observable<TranslationObject>[] = [];
-        loaders.forEach((loader) => {
-            requests.push(loader.getTranslation(lang).pipe(take(1)));
-        });
+        let loadAndMerge: Observable<TranslationObject>;
+
+        if (loaders.length === 0) {
+            return of({} as InterpolatableTranslationObject);
+        } else if (loaders.length === 1) {
+            loadAndMerge = loaders[0].getTranslation(lang);
+        } else {
+            const requests: Observable<TranslationObject>[] = loaders.map((loader) =>
+                loader.getTranslation(lang).pipe(take(1)),
+            );
+            loadAndMerge = forkJoin(requests).pipe(
+                map((results: TranslationObject[]) =>
+                    results.reduce((acc, curr) => mergeDeep(acc, curr), {} as TranslationObject),
+                ),
+            );
+        }
 
-        // Merge all translation objects
-        const loadingTranslations = (
-            requests.length > 1
-                ? forkJoin(requests).pipe(
-                      map((results: TranslationObject[]) =>
-                          results.reduce(
-                              (acc, curr) => mergeDeep(acc, curr),
-                              {} as TranslationObject,
-                          ),
-                      ),
-                  )
-                : requests[0]
-        ).pipe(shareReplay(1), take(1));
-
-        this.loadingTranslations = loadingTranslations.pipe(
+        this.loadingTranslations = loadAndMerge.pipe(shareReplay(1), take(1)).pipe(
             map((res: TranslationObject) => this.compiler.compileTranslations(res, lang)),
             shareReplay(1),
             take(1),
@@ -388,7 +382,7 @@ export class TranslateService implements ITranslateService, OnDestroy {
             },
         });
 
-        return loadingTranslations;
+        return this.loadingTranslations;
     }
 
     /**

projects/ngx-translate/src/lib/translate.store.ts

@@ -1,6 +1,5 @@
 import { Injectable } from "@angular/core";
 import { Observable, Subject } from "rxjs";
-import { TranslateLoader } from "./translate.loader";
 import {
     FallbackLangChangeEvent,
     InterpolatableTranslation,
@@ -10,11 +9,17 @@ import {
     TranslationChangeEvent,
 } from "./translate.service";
 import { getValue, mergeDeep } from "./util";
+import { TranslateLoader } from "./translate.loader";
 
 export type DeepReadonly<T> = {
     readonly [K in keyof T]: T[K] extends object ? DeepReadonly<T[K]> : T[K];
 };
 
+interface LoaderReference {
+    loader: TranslateLoader;
+    count: number;
+}
+
 @Injectable()
 export class TranslateStore {
     private _onTranslationChange: Subject<TranslationChangeEvent> =
@@ -29,27 +34,33 @@ export class TranslateStore {
     private translations: Record<Language, InterpolatableTranslationObject> = {};
     private languages: Language[] = [];
 
-    private loaders = new Map<number, TranslateLoader>();
+    private loaders: LoaderReference[] = [];
 
-    /**
-     * Adds a new loader to the store
-     * @returns the index of the newly added loader
-     */
-    addLoader(loader: TranslateLoader) {
-        let loaderIndex = 0;
-        while (this.loaders.has(loaderIndex)) {
-            loaderIndex++;
+    public addLoader(loader: TranslateLoader): void {
+        const existingLoader = this.getLoaderRef(loader);
+        if (existingLoader) {
+            existingLoader.count++;
+        } else {
+            this.loaders.push({ loader, count: 1 });
         }
-        this.loaders.set(loaderIndex, loader);
-        return loaderIndex;
     }
 
-    removeLoader(loaderIndex: number) {
-        if (this.loaders.has(loaderIndex)) this.loaders.delete(loaderIndex);
+    public removeLoader(loader: TranslateLoader): void {
+        const existingLoader = this.getLoaderRef(loader);
+        if (existingLoader) {
+            existingLoader.count--;
+            if (existingLoader.count === 0) {
+                this.loaders = this.loaders.filter((ref) => ref.loader !== loader);
+            }
+        }
     }
 
-    getLoaders() {
-        return this.loaders;
+    private getLoaderRef(loader: TranslateLoader): LoaderReference | undefined {
+        return this.loaders.find((ref) => ref.loader === loader);
+    }
+
+    public getLoaders(): TranslateLoader[] {
+        return this.loaders.map((ref) => ref.loader);
     }
 
     public getTranslations(language: Language): DeepReadonly<InterpolatableTranslationObject> {
@@ -96,7 +107,6 @@ export class TranslateStore {
 
     public setCurrentLang(lang: string, emitChange = true): void {
         this.currentLang = lang;
-
         if (emitChange) {
             this._onLangChange.next({ lang: lang, translations: this.translations[lang] });
         }