feat: prefetch dynamic content

AmadeusITGroup · Oct 16, 2023 · cdfd021 · cdfd021
1 parent df8bade
commit cdfd021
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 7 deletions.
diff --git a/examples/my-ngsw-app/package-lock.json b/examples/my-ngsw-app/package-lock.json
diff --git a/src/index.ts b/src/index.ts
@@ -97,7 +97,8 @@ export default createBuilder<PrefetchBuilderSchema>(async (options, context): Pr
   const variables = {
     resourceArray: JSON.stringify(resourceArray),
     prefetchConfig: JSON.stringify(filterOptions(options, configOptions)),
-    staticsFullPath: options.staticsFullPath
+    staticsFullPath: options.staticsFullPath,
+    localizationPattern: options.localizationPattern
   };
   const prefetchJs = Mustache.render(prefetchTemplate, variables);
 

diff --git a/src/schema.json b/src/schema.json
@@ -32,8 +32,13 @@
       },
       "staticsFullPath": {
         "type": "string",
-        "description": "By default the prefetched resources are hosted next to the `ngxPrefetch.js` file, on the same server. If it is not the case, you can configure the full path of the resources that will be prefetched. It is also possible to set this value by runtime. Instead of setting it in the Builder's options, you can search and replace for `{STATICS_FULL_PATH}` on the server side in order to inject a path.",
+        "description": "By default the prefetched static resources are hosted next to the `ngxPrefetch.js` file, on the same server. If it is not the case, you can configure the full path of the static resources that will be prefetched. It is also possible to set this value at runtime. Instead of setting it in the Builder's options, you can search for `{STATICS_FULL_PATH}` and replace it on the server side in order to inject a path.",
         "default": "{STATICS_FULL_PATH}"
+      },
+      "localizationPattern": {
+        "type": "string",
+        "description": "Pattern for the path of the localization file. By default, the pattern corresponds to the JSON file in a folder called localizations.",
+        "default": "/localizations/${language}.json"
       }
     },
     "additionalProperties": false,

diff --git a/src/schema.ts b/src/schema.ts
@@ -14,6 +14,9 @@ export interface PrefetchBuilderSchema extends JsonObject {
   /** Flag for creating a production (minified) version of the js file or a development one. */
   production: boolean;
 
-  /** By default the prefetched resources are hosted next to the `ngxPrefetch.js` file, on the same server. If it is not the case, you can configure the full path of the resources that will be prefetched. It is also possible to set this value by runtime. Instead of setting it in the Builder's options, you can search and replace for `{STATICS_FULL_PATH}` on the server side in order to inject a path. */
+  /** By default the prefetched static resources are hosted next to the `ngxPrefetch.js` file, on the same server. If it is not the case, you can configure the full path of the static resources that will be prefetched. It is also possible to set this value at runtime. Instead of setting it in the Builder's options, you can search for `{STATICS_FULL_PATH}` and replace it on the server side in order to inject a path. */
   staticsFullPath: string;
+
+  /** Pattern for the path of the localization file. By default, the pattern corresponds to the JSON file in a folder called localizations. */
+  localizationPattern: string;
 }
diff --git a/src/templates/prefetch.mustache b/src/templates/prefetch.mustache
@@ -23,19 +23,39 @@
   }
 
   var resList = {{{resourceArray}}};
-  var fullPath = '{{{staticsFullPath}}}';
+  var staticsFullPath = '{{{staticsFullPath}}}';
   var staticsFullPathKey = 'STATICS_FULL_PATH';
   // for testing
-  if (fullPath === `{${staticsFullPathKey}}`) { fullPath = '.'; }
+  if (staticsFullPath === `{${staticsFullPathKey}}`) { staticsFullPath = '.'; }
 
   var language = '{LANG}';
   var languageKey = 'LANG';
   if (language !== `{${languageKey}}`) {
-    resList.push(`/localizations/${language}.json`);
+    resList.push('{{{localizationPattern}}}');
+  }
+
+  var dynamicContentPath = '{DYNAMIC_CONTENT_PATH}';
+  var dynamicContentPathKey = 'DYNAMIC_CONTENT_PATH';
+
+  var dynamicContentFiles = '{DYNAMIC_CONTENT_FILES}';
+  var dynamicContentFilesKey = 'DYNAMIC_CONTENT_FILES';
+
+  var hasDynamicContent = (dynamicContentPath !== `{${dynamicContentPathKey}}`) && (dynamicContentFiles !== `{${dynamicContentFilesKey}}`);
+
+  if (hasDynamicContent) {
+    try {
+      dynamicContentFiles = JSON.parse(dynamicContentFiles);
+    } catch (e) {
+      console.error(`Could not parse dynamic content files: '${dynamicContentFiles}'`);
+    }
   }
 
   resList.forEach(function(resource) {
     if (typeof resource === 'string') {
+      var fullPath = staticsFullPath;
+      if (hasDynamicContent && dynamicContentFiles.includes(resource)) {
+        fullPath = dynamicContentPath;
+      }
       var splitRes = resource.split('.');
       var extension = splitRes[splitRes.length - 1];
       appendLink(fullPath + resource, getResType(extension));