fixes

mshima · Sep 12, 2023 · 7762815 · 7762815
1 parent 2b9672f
commit 7762815
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 35 deletions.
diff --git a/generators/angular/support/translate-angular.mjs b/generators/angular/support/translate-angular.mjs
@@ -19,7 +19,7 @@
 import { passthrough } from '@yeoman/transform';
 import { Minimatch } from 'minimatch';
 
-import { createJhiTranslateReplacer } from '../../languages/support/index.mjs';
+import { createJhiTransformTranslateReplacer, createJhiTransformTranslateStringifyReplacer } from '../../languages/support/index.mjs';
 
 const PLACEHOLDER_REGEX = /(?:placeholder|title)=['|"](\{\{\s?['|"]([a-zA-Z0-9.\-_]+)['|"]\s?\|\s?translate\s?\}\})['|"]/.source;
 
@@ -106,12 +106,14 @@ function replaceErrorMessage(getWebappTranslation, content) {
  */
 // eslint-disable-next-line import/prefer-default-export
 export const createTranslationReplacer = getWebappTranslation => {
-  const htmlJhiTranslateReplacer = createJhiTranslateReplacer(getWebappTranslation, { escapeHtml: true });
+  const htmlJhiTranslateReplacer = createJhiTransformTranslateReplacer(getWebappTranslation, { escapeHtml: true });
+  const htmlJhiTranslateStringifyReplacer = createJhiTransformTranslateStringifyReplacer(getWebappTranslation);
   return function replaceAngularTranslations(content, filePath) {
     if (/\.html$/.test(filePath)) {
       content = content.replace(new RegExp(TRANSLATE_REGEX, 'g'), '');
       content = replacePlaceholders(getWebappTranslation, content);
       content = htmlJhiTranslateReplacer(content);
+      content = htmlJhiTranslateStringifyReplacer(content);
     }
     if (/(:?route|module)\.ts$/.test(filePath)) {
       content = replacePageTitles(getWebappTranslation, content);

diff --git a/generators/angular/templates/src/main/webapp/app/admin/health/health.component.html.ejs b/generators/angular/templates/src/main/webapp/app/admin/health/health.component.html.ejs
@@ -49,7 +49,7 @@
               [ngClass]="getBadgeClass(componentHealth.value!.status)"
               <%= jhiPrefix %>Translate="{{ 'health.status.' + componentHealth.value!.status }}"
             >
-              {{ <%- JSON.stringify(getWebappTranslation('health.status')) %>[componentHealth.value!.status || 'UNKNOWN'] }}
+              {{ __jhiTransformTranslateStringify__('health.status')[componentHealth.value!.status || 'UNKNOWN'] }}
             </span>
           </td>
           <td class="text-center">

diff --git a/...ators/angular/templates/src/main/webapp/app/layouts/profiles/page-ribbon.component.ts.ejs b/...ators/angular/templates/src/main/webapp/app/layouts/profiles/page-ribbon.component.ts.ejs
@@ -28,7 +28,7 @@ import { ProfileService } from './profile.service';
   selector: '<%= jhiPrefixDashed %>-page-ribbon',
   template: `
     <div class="ribbon" *ngIf="ribbonEnv$ | async as ribbonEnv">
-      <a href=""<% if (enableTranslation) { %> <%= jhiPrefix %>Translate="global.ribbon.{{ ribbonEnv }}"<% } %>>{{ <%- JSON.stringify(getWebappTranslation('global.ribbon')) %>[ribbonEnv] || '' }}</a>
+      <a href=""<% if (enableTranslation) { %> <%= jhiPrefix %>Translate="global.ribbon.{{ ribbonEnv }}"<% } %>>{{ __jhiTransformTranslateStringify__('global.ribbon')[ribbonEnv] || '' }}</a>
     </div>
   `,
   styleUrls: ['./page-ribbon.component.scss'],

diff --git a/generators/languages/support/translate.mts b/generators/languages/support/translate.mts
@@ -17,7 +17,7 @@
  * limitations under the License.
  */
 
-const TRANSLATE_FUNCTION = /__jhiTransformTranslate__\(\s*'(?<key>[^']+)'(?:,\s*(?<interpolate>\{[^}]*\}))?\s*\)/g.source;
+const TRANSLATE_FUNCTION_ARGS = /\(\s*'(?<key>[^']+)'(?:,\s*(?<interpolate>\{[^}]*\}))?\s*\)/g.source;
 
 function getTranslationValue(getWebappTranslation, key, data) {
   return getWebappTranslation(key, data) || undefined;
@@ -28,13 +28,14 @@ export type TranslationReplaceOptions = {
   interpolatePattern?: string;
   wrapTranslation?: string | string[];
   escapeHtml?: boolean;
+  stringify?: boolean;
 };
 
 export const replaceTranslationKeysWithText = (
   getWebappTranslation,
   body: string,
   regexp: string,
-  { keyPattern, interpolatePattern, wrapTranslation, escapeHtml }: TranslationReplaceOptions = {},
+  { keyPattern, interpolatePattern, wrapTranslation, escapeHtml, stringify }: TranslationReplaceOptions = {},
 ) => {
   const matches = body.matchAll(new RegExp(regexp, 'g'));
   if (typeof wrapTranslation === 'string') {
@@ -93,11 +94,18 @@ export const replaceTranslationKeysWithText = (
     } else if (escapeHtml) {
       // Escape specific chars
       replacement = replacement.replace(/'/g, '&apos;').replace(/"/g, '&quot;');
+    } else if (stringify) {
+      replacement = JSON.stringify(replacement);
     }
     body = body.replace(target, replacement);
   }
   return body;
 };
 
-export const createJhiTranslateReplacer = (getWebappTranslation, translateOptions?: TranslationReplaceOptions) => (body: string) =>
-  replaceTranslationKeysWithText(getWebappTranslation, body, TRANSLATE_FUNCTION, translateOptions);
+export const createJhiTransformTranslateReplacer = (getWebappTranslation, translateOptions?: TranslationReplaceOptions) => (body: string) =>
+  replaceTranslationKeysWithText(getWebappTranslation, body, `__jhiTransformTranslate__${TRANSLATE_FUNCTION_ARGS}`, translateOptions);
+
+export const createJhiTransformTranslateStringifyReplacer = getWebappTranslation => (body: string) =>
+  replaceTranslationKeysWithText(getWebappTranslation, body, `__jhiTransformTranslateStringify__${TRANSLATE_FUNCTION_ARGS}`, {
+    stringify: true,
+  });
diff --git a/generators/languages/support/translate.spec.mjs b/generators/languages/support/translate.spec.mjs
@@ -18,7 +18,7 @@
  */
 import { expect, esmocha } from 'esmocha';
 
-import { createJhiTranslateReplacer } from './translate.mjs';
+import { createJhiTransformTranslateReplacer, createJhiTransformTranslateStringifyReplacer } from './translate.mjs';
 
 describe('generator - languages - translate', () => {
   let getWebappTranslation;
@@ -33,48 +33,44 @@ describe('generator - languages - translate', () => {
     });
   });
 
-  describe('replaceTranslations', () => {
-    let replaceTranslations;
+  describe('jhiTransformTranslate', () => {
+    let jhiTransformTranslate;
 
     beforeEach(() => {
-      replaceTranslations = createJhiTranslateReplacer(getWebappTranslation);
+      jhiTransformTranslate = createJhiTransformTranslateReplacer(getWebappTranslation);
     });
 
-    describe('with translation disabled', () => {
-      describe('.tsx files', () => {
-        it('should replace __jhiTransformTranslate__ function', () => {
-          const body = `
+    it('should replace __jhiTransformTranslate__ function', () => {
+      const body = `
 __jhiTransformTranslate__('global')
 `;
-          expect(replaceTranslations(body)).toMatchInlineSnapshot(`
+      expect(jhiTransformTranslate(body)).toMatchInlineSnapshot(`
 "
 global-translated-"-'-value-0
 "
 `);
-        });
+    });
 
-        it('should replace __jhiTransformTranslate__ function with interpolation', () => {
-          const body = `
+    it('should replace __jhiTransformTranslate__ function with interpolation', () => {
+      const body = `
 __jhiTransformTranslate__('global', { min:20, max: 50, pattern: '^[a-zA-Z0-9]*$',
-  anotherPattern: "^[a-zA-Z0-9]*$",
-  dynamic: exec(),
+anotherPattern: "^[a-zA-Z0-9]*$",
+dynamic: exec(),
 })
 `;
-          expect(replaceTranslations(body)).toMatchInlineSnapshot(`
+      expect(jhiTransformTranslate(body)).toMatchInlineSnapshot(`
 "
 global-{"min":20,"max":50,"pattern":"^[a-zA-Z0-9]*","anotherPattern":"^[a-zA-Z0-9]*","dynamic":"{exec()}"}-translated-"-'-value-0
 "
 `);
-        });
-      });
     });
   });
 
-  describe('replaceTranslations with escapeHtml', () => {
-    let replaceTranslations;
+  describe('jhiTransformTranslate with escapeHtml', () => {
+    let jhiTransformTranslate;
 
     beforeEach(() => {
-      replaceTranslations = createJhiTranslateReplacer(getWebappTranslation, { escapeHtml: true });
+      jhiTransformTranslate = createJhiTransformTranslateReplacer(getWebappTranslation, { escapeHtml: true });
     });
 
     describe('with translation disabled', () => {
@@ -83,7 +79,7 @@ global-{"min":20,"max":50,"pattern":"^[a-zA-Z0-9]*","anotherPattern":"^[a-zA-Z0-
           const body = `
 __jhiTransformTranslate__('global')
 `;
-          expect(replaceTranslations(body)).toMatchInlineSnapshot(`
+          expect(jhiTransformTranslate(body)).toMatchInlineSnapshot(`
 "
 global-translated-&quot;-&apos;-value-0
 "
@@ -97,7 +93,7 @@ __jhiTransformTranslate__('global', { min:20, max: 50, pattern: '^[a-zA-Z0-9]*$'
   dynamic: exec(),
 })
 `;
-          expect(replaceTranslations(body)).toMatchInlineSnapshot(`
+          expect(jhiTransformTranslate(body)).toMatchInlineSnapshot(`
 "
 global-{&quot;min&quot;:20,&quot;max&quot;:50,&quot;pattern&quot;:&quot;^[a-zA-Z0-9]*&quot;,&quot;anotherPattern&quot;:&quot;^[a-zA-Z0-9]*&quot;,&quot;dynamic&quot;:&quot;{exec()}&quot;}-translated-&quot;-&apos;-value-0
 "
@@ -107,11 +103,11 @@ global-{&quot;min&quot;:20,&quot;max&quot;:50,&quot;pattern&quot;:&quot;^[a-zA-Z
     });
   });
 
-  describe('replaceTranslations with wrapTranslation', () => {
-    let replaceTranslations;
+  describe('jhiTransformTranslate with wrapTranslation', () => {
+    let jhiTransformTranslate;
 
     beforeEach(() => {
-      replaceTranslations = createJhiTranslateReplacer(getWebappTranslation, { wrapTranslation: '"' });
+      jhiTransformTranslate = createJhiTransformTranslateReplacer(getWebappTranslation, { wrapTranslation: '"' });
     });
 
     describe('with translation disabled', () => {
@@ -120,7 +116,7 @@ global-{&quot;min&quot;:20,&quot;max&quot;:50,&quot;pattern&quot;:&quot;^[a-zA-Z
           const body = `
 __jhiTransformTranslate__('global')
 `;
-          expect(replaceTranslations(body)).toMatchInlineSnapshot(`
+          expect(jhiTransformTranslate(body)).toMatchInlineSnapshot(`
 "
 "global-translated-"-'-value-0"
 "
@@ -134,7 +130,7 @@ __jhiTransformTranslate__('global', { min:20, max: 50, pattern: '^[a-zA-Z0-9]*$'
   dynamic: exec(),
 })
 `;
-          expect(replaceTranslations(body)).toMatchInlineSnapshot(`
+          expect(jhiTransformTranslate(body)).toMatchInlineSnapshot(`
 "
 "global-{"min":20,"max":50,"pattern":"^[a-zA-Z0-9]*","anotherPattern":"^[a-zA-Z0-9]*","dynamic":"{exec()}"}-translated-"-'-value-0"
 "
@@ -143,4 +139,23 @@ __jhiTransformTranslate__('global', { min:20, max: 50, pattern: '^[a-zA-Z0-9]*$'
       });
     });
   });
+
+  describe('jhiTransformTranslate', () => {
+    let jhiTransformTranslateStringify;
+
+    beforeEach(() => {
+      jhiTransformTranslateStringify = createJhiTransformTranslateStringifyReplacer(getWebappTranslation);
+    });
+
+    it('should replace __jhiTransformTranslateStringify__ function', () => {
+      const body = `
+__jhiTransformTranslateStringify__('global')
+`;
+      expect(jhiTransformTranslateStringify(body)).toMatchInlineSnapshot(`
+"
+"global-translated-\\"-'-value-0"
+"
+`);
+    });
+  });
 });