add custom file parser

Author: larscom

README.md

@@ -107,6 +107,27 @@ export interface IModuleTranslationOptions {
    * The translation module configurations
    */
   modules: IModuleTranslation[]
+  /**
+   * Custom parser after retrieving a response from the server in 'text' format.
+   * By using this property you can parse raw text into the required TranslationObject.
+   *
+   * This parser will be used for every 'module' unless you specificy a fileParser at 'module' level.
+   */
+  fileParser?: {
+    /**
+     * This property will append the file extension to the url when fetching from the server.
+     * For example: ./assets/i18n/feature1/en.json5 when you set it as json5
+     */
+    fileExtension: 'json5' | 'xml' | string
+    /**
+     * The parser function that can parse a string to a TranslationObject
+     *
+     * For example: for a json file you would typically use: JSON.parse()
+     *
+     * @param translation the raw translation file as text
+     */
+    parseFn: (translation: string) => TranslationObject
+  }
   /**
    * By default, each module gets its own namespace so it doesn't conflict with other modules
    */
@@ -175,6 +196,25 @@ export interface IModuleTranslation {
    * @param translation the resolved translation file
    */
   translateMap?: (translation: TranslationObject) => TranslationObject
+  /**
+   * Custom parser after retrieving a response from the server in 'text' format.
+   * By using this property you can parse raw text into the required TranslationObject.
+   */
+  fileParser?: {
+    /**
+     * This property will append the file extension to the url when fetching from the server.
+     * For example: ./assets/i18n/feature1/en.json5 when you set it as json5
+     */
+    fileExtension: 'json5' | 'xml' | string
+    /**
+     * The parser function that can parse a string to a TranslationObject
+     *
+     * For example: for a json file you would typically use: JSON.parse()
+     *
+     * @param translation the raw translation file as text
+     */
+    parseFn: (translation: string) => TranslationObject
+  }
   /**
    * Custom path template for fetching translations
    * @example
@@ -229,3 +269,30 @@ const options: IModuleTranslationOptions = {
   ]
 };
 ```
+
+## Custom file parser
+
+You can provide a custom file parser, this parser kicks in after retrieving the file from the server in text format. This allows you to use JSON5 or XML instead of the default JSON format.
+
+```ts
+const options: IModuleTranslationOptions = {
+  // global fileParser, applied to every module, unless you specify fileParser at 'module' level
+  fileParser: {
+    fileExtension: 'json5',
+    parseFn: (text) => JSON5.parse(text)
+  },
+  modules: [
+    { baseTranslateUrl },
+    // fileParser only applied to this module
+    {
+      baseTranslateUrl,
+      moduleName: 'feature1',
+      fileParser: {
+        fileExtension: 'xml',
+        parseFn: (text) => XML.parse(text)
+      }
+    },
+    { baseTranslateUrl, moduleName: 'feature2' }
+  ]
+}
+```

package-lock.json

@@ -18,6 +18,7 @@
     "@angular/platform-browser-dynamic": "20.3.1",
     "@angular/router": "20.3.1",
     "@ngx-translate/core": "17.0.0",
+    "json5": "2.2.3",
     "rxjs": "7.8.2",
     "tslib": "2.8.1",
     "zone.js": "0.15.1"

package.json

@@ -230,26 +230,24 @@ describe('ModuleTranslateLoader', () => {
           moduleName: undefined,
           baseTranslateUrl: './assets/i18n',
           translateMap: (translation: TranslationObject) => {
-            return Object.keys(translation)
-              .reduce((acc, curr) => {
-                return {
-                  ...acc,
-                  [curr.toUpperCase()]: translation[curr]
-                }
-              }, Object())
+            return Object.keys(translation).reduce((acc, curr) => {
+              return {
+                ...acc,
+                [curr.toUpperCase()]: translation[curr]
+              }
+            }, Object())
           }
         },
         {
           moduleName: 'feature1',
           baseTranslateUrl: './assets/i18n',
           translateMap: (translation: TranslationObject) => {
-            return Object.keys(translation)
-              .reduce((acc, curr) => {
-                return {
-                  ...acc,
-                  [curr.toUpperCase()]: translation[curr]
-                }
-              }, {})
+            return Object.keys(translation).reduce((acc, curr) => {
+              return {
+                ...acc,
+                [curr.toUpperCase()]: translation[curr]
+              }
+            }, {})
           }
         }
       ]
@@ -603,8 +601,57 @@ describe('ModuleTranslateLoader', () => {
     mock.flush(translation)
   })
 
-  function createTestRequest(path: string): TestRequest {
-    return httpMock.expectOne(path.concat('.json'))
+  it('should use global fileParser when fileParser at module level is not defined', (done) => {
+    const globalParseFn = jest.fn()
+    const moduleParseFn = jest.fn()
+
+    const options: IModuleTranslationOptions = {
+      fileParser: {
+        fileExtension: 'json5',
+        parseFn: globalParseFn
+      },
+      modules: [
+        {
+          moduleName: 'feature1',
+          baseTranslateUrl: './assets/i18n',
+          fileParser: {
+            fileExtension: 'xml',
+            parseFn: moduleParseFn
+          }
+        },
+        {
+          moduleName: 'feature2',
+          baseTranslateUrl: './assets/i18n'
+        }
+      ]
+    }
+
+    const language = 'en'
+    const loader = new ModuleTranslateLoader(httpClient, options)
+
+    loader.getTranslation(language).subscribe(() => done())
+
+    let mock = createTestRequest(
+      getTranslatePath(options.modules[0].baseTranslateUrl, options.modules[0].moduleName!, language),
+      'xml'
+    )
+    expect(mock.request.method).toEqual('GET')
+    mock.flush(translation)
+
+    expect(moduleParseFn).toHaveBeenCalledTimes(1)
+
+    mock = createTestRequest(
+      getTranslatePath(options.modules[1].baseTranslateUrl, options.modules[1].moduleName!, language),
+      'json5'
+    )
+    expect(mock.request.method).toEqual('GET')
+    mock.flush(translation)
+    
+    expect(globalParseFn).toHaveBeenCalledTimes(1)
+  })
+
+  function createTestRequest(path: string, extension = 'json'): TestRequest {
+    return httpMock.expectOne(path.concat(`.${extension}`))
   }
 
   function getTranslatePath(baseTranslateUrl: string, moduleName: string, language: string): string {