Fix literal interpolation for curly brackets for Translation Strings (#16235)

* Allow curly brackets usage in Translation Strings

* update test
This commit is contained in:
Azri Kahar
2022-11-02 04:04:01 +08:00
committed by GitHub
parent 5780bb174f
commit 2c0ad892b6
3 changed files with 13 additions and 3 deletions

View File

@@ -8,3 +8,11 @@ test('No special characters', () => {
test('With special characters', () => {
expect(getLiteralInterpolatedTranslation('folding@home')).toBe(`folding{'@'}home`);
});
test('Should not keep curly brackets', () => {
expect(getLiteralInterpolatedTranslation('my {custom} string')).toBe(`my {'{'}custom{'}'} string`);
});
test('Should keep curly brackets', () => {
expect(getLiteralInterpolatedTranslation('my {custom} string', true)).toBe(`my {custom} string`);
});

View File

@@ -2,10 +2,12 @@
* Literal interpolation to use special characters such as "{", "}", "@", "$", and "|" in app translations
*
* @param translation - vue i18n translation string
* @param keepCurlyBrackets - whether to skip interpolation for curly brackets. Defaults to false.
* @returns - literal interpolated translation string
*
* @see {@link https://github.com/directus/directus/pull/11287}
*/
export function getLiteralInterpolatedTranslation(translation: string) {
return translation.replace(/([{}@$|])/g, "{'$1'}");
export function getLiteralInterpolatedTranslation(translation: string, keepCurlyBrackets = false) {
const interpolatedCharacters = keepCurlyBrackets ? '@$|' : '{}@$|';
return translation.replace(new RegExp(`([${interpolatedCharacters}])`, 'g'), "{'$1'}");
}