feat(localize): allow custom locale when loading namespaces

Author: LarsDenBakker

packages/localize/src/LocalizeManager.js

@@ -59,25 +59,25 @@ export class LocalizeManager extends LionSingleton {
     this.__namespacePatternsMap.set(pattern, loader);
   }
 
-  loadNamespaces(namespaces) {
-    return Promise.all(namespaces.map(namespace => this.loadNamespace(namespace)));
+  loadNamespaces(namespaces, { locale } = {}) {
+    return Promise.all(namespaces.map(namespace => this.loadNamespace(namespace, { locale })));
   }
 
-  loadNamespace(namespaceObj) {
+  loadNamespace(namespaceObj, { locale = this.locale } = { locale: this.locale }) {
     const isDynamicImport = typeof namespaceObj === 'object';
 
     const namespace = isDynamicImport ? Object.keys(namespaceObj)[0] : namespaceObj;
 
-    if (this._isNamespaceInCache(this.locale, namespace)) {
+    if (this._isNamespaceInCache(locale, namespace)) {
       return Promise.resolve();
     }
 
-    const existingLoaderPromise = this._getCachedNamespaceLoaderPromise(this.locale, namespace);
+    const existingLoaderPromise = this._getCachedNamespaceLoaderPromise(locale, namespace);
     if (existingLoaderPromise) {
       return existingLoaderPromise;
     }
 
-    return this._loadNamespaceData(this.locale, namespaceObj, isDynamicImport, namespace);
+    return this._loadNamespaceData(locale, namespaceObj, isDynamicImport, namespace);
   }
 
   msg(keys, vars, opts = {}) {

packages/localize/test/LocalizeManager.test.js

@@ -116,6 +116,26 @@ describe('LocalizeManager', () => {
       });
     });
 
+    it('can load a namespace for a different locale', async () => {
+      setupFakeImport('./my-component/nl-NL.js', { default: { greeting: 'Hello!' } });
+
+      const manager = new LocalizeManager();
+      manager.locale = 'en-US';
+
+      await manager.loadNamespace(
+        {
+          'my-component': locale => fakeImport(`./my-component/${locale}.js`),
+        },
+        { locale: 'nl-NL' },
+      );
+
+      expect(manager.__storage).to.deep.equal({
+        'nl-NL': {
+          'my-component': { greeting: 'Hello!' },
+        },
+      });
+    });
+
     it('loads multiple namespaces via loadNamespaces()', async () => {
       setupFakeImport('./my-defaults/en-GB.js', { default: { submit: 'Submit' } });
       setupFakeImport('./my-send-button/en-GB.js', { default: { submit: 'Send' } });
@@ -135,6 +155,29 @@ describe('LocalizeManager', () => {
       });
     });
 
+    it('can load multiple namespaces for a different locale', async () => {
+      setupFakeImport('./my-defaults/nl-NL.js', { default: { submit: 'Submit' } });
+      setupFakeImport('./my-send-button/nl-NL.js', { default: { submit: 'Send' } });
+
+      const manager = new LocalizeManager();
+      manager.locale = 'en-US';
+
+      await manager.loadNamespaces(
+        [
+          { 'my-defaults': locale => fakeImport(`./my-defaults/${locale}.js`) },
+          { 'my-send-button': locale => fakeImport(`./my-send-button/${locale}.js`) },
+        ],
+        { locale: 'nl-NL' },
+      );
+
+      expect(manager.__storage).to.deep.equal({
+        'nl-NL': {
+          'my-defaults': { submit: 'Submit' },
+          'my-send-button': { submit: 'Send' },
+        },
+      });
+    });
+
     it('fallbacks to language file if locale file is not found', async () => {
       setupFakeImport('./my-component/en.js', { default: { greeting: 'Hello!' } });