From e82d25ac4c5cf7e7aecddec083693fe67c5526f1 Mon Sep 17 00:00:00 2001
From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com>
Date: Tue, 1 Aug 2023 10:21:25 +0200
Subject: [PATCH] do not reset subscription every time a new language is loaded

use combineLatest to get latest of both culture and extensions so that whenever something changes we update the translations
---
 .../registry/translation.registry.ts          | 83 +++++++++----------
 1 file changed, 39 insertions(+), 44 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/libs/localization-api/registry/translation.registry.ts b/src/Umbraco.Web.UI.Client/src/libs/localization-api/registry/translation.registry.ts
index b9425b1d26..bc68b200c6 100644
--- a/src/Umbraco.Web.UI.Client/src/libs/localization-api/registry/translation.registry.ts
+++ b/src/Umbraco.Web.UI.Client/src/libs/localization-api/registry/translation.registry.ts
@@ -1,61 +1,56 @@
 import { Translation, registerTranslation } from '../manager.js';
 import { hasDefaultExport, loadExtension } from '@umbraco-cms/backoffice/extension-api';
 import { UmbBackofficeExtensionRegistry } from '@umbraco-cms/backoffice/extension-registry';
-import { Subscription } from '@umbraco-cms/backoffice/external/rxjs';
+import { Subject, combineLatest } from '@umbraco-cms/backoffice/external/rxjs';
 
 export type UmbTranslationDictionary = Record<string, string>;
 
 export class UmbTranslationRegistry {
 	#registry;
-	#subscription?: Subscription;
+	#currentLanguage = new Subject<string>();
 
 	constructor(extensionRegistry: UmbBackofficeExtensionRegistry) {
 		this.#registry = extensionRegistry;
+
+		combineLatest([this.#currentLanguage, this.#registry.extensionsOfType('translations')]).subscribe(
+			async ([userCulture, extensions]) => {
+				await Promise.all(
+					extensions
+						.filter((x) => x.meta.culture.toLowerCase() === userCulture)
+						.map(async (extension) => {
+							const innerDictionary: UmbTranslationDictionary = {};
+
+							// If extension contains a dictionary, add it to the inner dictionary.
+							if (extension.meta.translations) {
+								for (const [dictionaryName, dictionary] of Object.entries(extension.meta.translations)) {
+									this.#addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary);
+								}
+							}
+
+							// If extension contains a js file, load it and add the default dictionary to the inner dictionary.
+							const loadedExtension = await loadExtension(extension);
+
+							if (loadedExtension && hasDefaultExport(loadedExtension)) {
+								for (const [dictionaryName, dictionary] of Object.entries(loadedExtension.default)) {
+									this.#addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary);
+								}
+							}
+
+							// Notify subscribers that the inner dictionary has changed.
+							const translation: Translation = {
+								$code: userCulture,
+								$dir: 'ltr',
+								...innerDictionary,
+							};
+							registerTranslation(translation);
+						})
+				);
+			}
+		);
 	}
 
 	loadLanguage(userCulture: string) {
-		// Normalize the culture
-		userCulture = userCulture.toLowerCase();
-
-		// Cancel any previous subscription.
-		if (this.#subscription) {
-			this.#subscription.unsubscribe();
-		}
-
-		// Load new translations
-		this.#subscription = this.#registry.extensionsOfType('translations').subscribe(async (extensions) => {
-			await Promise.all(
-				extensions
-					.filter((x) => x.meta.culture.toLowerCase() === userCulture)
-					.map(async (extension) => {
-						const innerDictionary: UmbTranslationDictionary = {};
-
-						// If extension contains a dictionary, add it to the inner dictionary.
-						if (extension.meta.translations) {
-							for (const [dictionaryName, dictionary] of Object.entries(extension.meta.translations)) {
-								this.#addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary);
-							}
-						}
-
-						// If extension contains a js file, load it and add the default dictionary to the inner dictionary.
-						const loadedExtension = await loadExtension(extension);
-
-						if (loadedExtension && hasDefaultExport(loadedExtension)) {
-							for (const [dictionaryName, dictionary] of Object.entries(loadedExtension.default)) {
-								this.#addOrUpdateDictionary(innerDictionary, dictionaryName, dictionary);
-							}
-						}
-
-						// Notify subscribers that the inner dictionary has changed.
-						const translation: Translation = {
-							$code: userCulture,
-							$dir: 'ltr',
-							...innerDictionary,
-						};
-						registerTranslation(translation);
-					})
-			);
-		});
+		this.#currentLanguage.next(userCulture.toLowerCase());
 	}
 
 	#addOrUpdateDictionary(