From b3328014e937f3e9c63446e28fab9a0f9bda3fc5 Mon Sep 17 00:00:00 2001
From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com>
Date: Tue, 25 Jul 2023 16:31:28 +0200
Subject: [PATCH] support listening on changed translations with localizeMany

---
 .../localization-api/localization.context.ts    | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/libs/localization-api/localization.context.ts b/src/Umbraco.Web.UI.Client/src/libs/localization-api/localization.context.ts
index 166ee1830b..241c4f4c69 100644
--- a/src/Umbraco.Web.UI.Client/src/libs/localization-api/localization.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/libs/localization-api/localization.context.ts
@@ -3,7 +3,7 @@ import { UMB_AUTH } from '@umbraco-cms/backoffice/auth';
 import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
 import { UmbElement } from '@umbraco-cms/backoffice/element-api';
 import { UmbBackofficeExtensionRegistry } from '@umbraco-cms/backoffice/extension-registry';
-import { of, switchMap, type Observable, map } from '@umbraco-cms/backoffice/external/rxjs';
+import { combineLatest, distinctUntilChanged, type Observable, map } from '@umbraco-cms/backoffice/external/rxjs';
 
 export class UmbLocalizationContext {
 	#translationRegistry;
@@ -29,8 +29,12 @@ export class UmbLocalizationContext {
 	 * Localize a key.
 	 * If the key is not found, the fallback is returned.
 	 * If the fallback is not provided, the key is returned.
+	 *
 	 * @param key The key to localize. The key is case sensitive.
 	 * @param fallback The fallback text to use if the key is not found (default: undefined).
+	 * @example localize('general_close').subscribe((value) => {
+	 * 	console.log(value); // 'Close'
+	 * });
 	 */
 	localize(key: string, fallback?: string): Observable<string> {
 		return this.translations.pipe(
@@ -43,12 +47,17 @@ export class UmbLocalizationContext {
 	/**
 	 * Localize many keys at once.
 	 * If a key is not found, the key is returned.
+	 *
 	 * @description This method combines the results of multiple calls to localize.
-	 * @param keys
+	 * @param keys The keys to localize. The keys are case sensitive.
+	 * @example localizeMany(['general_close', 'general_logout']).subscribe((values) => {
+	 * 	console.log(values[0]); // 'Close'
+	 * 	console.log(values[1]); // 'Log out'
+	 * });
 	 * @see localize
 	 */
-	localizeMany(keys: string[]): Observable<Record<string, string>> {
-		return of(...keys).pipe(switchMap((key) => this.localize(key).pipe(map((value) => ({ [key]: value })))));
+	localizeMany(keys: string[]) {
+		return combineLatest(keys.map((key) => this.localize(key).pipe(distinctUntilChanged())));
 	}
 }