feat(gettext): allow to add translations to the wrapper

This allows us to only register what is needed.
Normally you would register everything at once,
but for performance reasons the `nextcloud-vue`
library only registers the translations of components
that are really used.

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>

Author: susnux

lib/gettext.ts

@@ -18,7 +18,7 @@ const gt = getGettextBuilder()
 gt.gettext('some string to translate')
 ```
  */
-import type { AppTranslations } from './registry.ts'
+import type { AppTranslations, PluralFunction } from './registry.ts'
 import { getLanguage, getPlural, translate, translatePlural } from './index.ts'
 
 export interface GettextTranslation {
@@ -69,6 +69,13 @@ class GettextBuilder {
 		return this.setLanguage(getLanguage().replace('-', '_'))
 	}
 
+	/**
+	 * Register a new translation bundle for a specified language.
+	 *
+	 * Please note that existing translations for that language will be overwritten.
+	 * @param language - Language this is the translation for
+	 * @param data - The translation bundle
+	 */
 	addTranslation(language: string, data: GettextTranslationBundle): this {
 		this.translations[language] = data
 		return this
@@ -84,29 +91,49 @@ class GettextBuilder {
 			console.debug(`Creating gettext instance for language ${this.language}`)
 		}
 
-		const translations = Object.values(this.translations[this.language]?.translations[''] ?? {})
-			.map(({ msgid, msgid_plural: msgidPlural, msgstr }) => {
-				if (msgidPlural !== undefined) {
-					return [`_${msgid}_::_${msgidPlural}_`, msgstr]
-				}
-				return [msgid, msgstr[0]]
-			})
-
-		const bundle: AppTranslations = {
-			pluralFunction: (n: number) => getPlural(n, this.language),
-			translations: Object.fromEntries(translations),
+		const wrapper = new GettextWrapper((n: number) => getPlural(n, this.language))
+		if (this.language in this.translations) {
+			wrapper.addTranslations(this.translations[this.language])
 		}
-
-		return new GettextWrapper(bundle)
+		return wrapper
 	}
 
 }
 
 class GettextWrapper {
 
+	private bundle: AppTranslations
+
 	constructor(
-		private bundle: AppTranslations,
+		pluralFunction: PluralFunction,
 	) {
+		this.bundle = {
+			pluralFunction,
+			translations: {},
+		}
+	}
+
+	/**
+	 * Append new translations to the wrapper.
+	 *
+	 * This is useful if translations should be added on demand,
+	 * e.g. depending on component usage.
+	 *
+	 * @param bundle - The new translation bundle to append
+	 */
+	addTranslations(bundle: GettextTranslationBundle): void {
+		const dict = Object.values(bundle.translations[''] ?? {})
+			.map(({ msgid, msgid_plural: msgidPlural, msgstr }) => {
+				if (msgidPlural !== undefined) {
+					return [`_${msgid}_::_${msgidPlural}_`, msgstr]
+				}
+				return [msgid, msgstr[0]]
+			})
+
+		this.bundle.translations = {
+			...this.bundle.translations,
+			...Object.fromEntries(dict),
+		}
 	}
 
 	/**

tests/gettext.test.ts

@@ -214,4 +214,26 @@ msgstr "incorrect"
 		expect(translation).toEqual('correct')
 	})
 
+	it('can add translations afterwards', () => {
+		const pot = `msgid ""
+msgstr ""
+"Last-Translator: Translator, 2020\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Language: sv\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
+
+msgid "abc"
+msgstr "def"
+`
+		const gt = getGettextBuilder()
+			.setLanguage('sv')
+			.build()
+
+		expect(gt.gettext('abc')).toBe('abc')
+
+		gt.addTranslations(po.parse(pot))
+
+		expect(gt.gettext('abc')).toBe('def')
+	})
+
 })