diff --git a/__tests__/Trans.test.js b/__tests__/Trans.test.js index e39f6ee..c217497 100644 --- a/__tests__/Trans.test.js +++ b/__tests__/Trans.test.js @@ -49,6 +49,75 @@ describe('Trans', () => { expect(container.textContent).toContain(expected) }) + test('should work with arrays', () => { + const i18nKey = 'ns:parent.child' + const expectedFirstElement = 'First element 42' + const expectedSecondElement = 'Second element 42' + const withSingular = { + parent: { + child: [ + '<0>First element {{num}}', + '<0>Second element {{num}}', + ], + }, + } + const { container } = render( + ]} + /> + ) + expect(container.innerHTML).toContain(expectedFirstElement) + expect(container.innerHTML).toContain(expectedSecondElement) + }) + + test('should work with arrays and singulars', () => { + const i18nKey = 'ns:withsingular' + const expected = 'The number is one' + const withSingular = { + withsingular_0: ['<0>The number is ZERO!'], + withsingular_one: ['<0>The number is one'], + withsingular_other: ['<0>The number is plural'], + } + + const { container } = render( + ]} + /> + ) + + expect(container.innerHTML).toContain(expected) + }) + + test('should work with arrays and plurals', () => { + const i18nKey = 'ns:withsingular' + const expected = 'The number is plural' + const withSingular = { + withsingular: ['<0>First is not zero'], + withsingular_0: ['<0>The number is ZERO!'], + withsingular_other: ['<0>The number is plural'], + } + + const { container } = render( + ]} + /> + ) + + expect(container.innerHTML).toContain(expected) + }) + test('should work with nested keys and custom keySeparator', () => { const i18nKey = 'ns:parent_child' const expected = 'The number is 42' diff --git a/src/Trans.tsx b/src/Trans.tsx index 4d6bbe4..077e7d8 100644 --- a/src/Trans.tsx +++ b/src/Trans.tsx @@ -16,6 +16,7 @@ export default function Trans({ fallback, defaultTrans, ns, + returnObjects, }: TransProps): any { const { t, lang } = useTranslation(ns) @@ -23,11 +24,19 @@ export default function Trans({ * Memoize the transformation */ const result = useMemo(() => { - const text = t(i18nKey, values, { fallback, default: defaultTrans }) + const text = t(i18nKey, values, { + fallback, + default: defaultTrans, + returnObjects, + }) if (!text) return text - if (!components || components.length === 0) return text + if (!components || components.length === 0) + return Array.isArray(text) ? text.map((item) => item) : text + + if (Array.isArray(text)) + return text.map((item) => formatElements(item, components)) return formatElements(text, components) }, [i18nKey, values, components, lang]) as string diff --git a/src/index.tsx b/src/index.tsx index 52ee3c8..fa4bd7c 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -41,6 +41,7 @@ export interface TransProps { fallback?: string | string[] defaultTrans?: string ns?: string + returnObjects?: boolean } export type PageValue = string[] | ((context: object) => string[]) diff --git a/src/transCore.tsx b/src/transCore.tsx index 3f5a40a..9f06cdd 100644 --- a/src/transCore.tsx +++ b/src/transCore.tsx @@ -65,7 +65,14 @@ export default function transCore({ ) const dic = (namespace && allNamespaces[namespace]) || {} - const keyWithPlural = plural(pluralRules, dic, i18nKey, config, query) + const keyWithPlural = plural( + pluralRules, + dic, + i18nKey, + config, + query, + options + ) const dicValue = getDicValue(dic, keyWithPlural, config, options) const value = typeof dicValue === 'object' @@ -157,11 +164,14 @@ function getDicValue( if ( typeof value === 'string' || - ((value as unknown) instanceof Object && options.returnObjects) + ((value as unknown) instanceof Object && + options.returnObjects && + Object.keys(value).length > 0) ) { return value } + if (Array.isArray(value) && options.returnObjects) return value return undefined } @@ -173,23 +183,29 @@ function plural( dic: I18nDictionary, key: string, config: I18nConfig, - query?: TranslationQuery | null + query?: TranslationQuery | null, + options?: { + returnObjects?: boolean + fallback?: string | string[] + } ): string { if (!query || typeof query.count !== 'number') return key const numKey = `${key}_${query.count}` - if (getDicValue(dic, numKey, config) !== undefined) return numKey + if (getDicValue(dic, numKey, config, options) !== undefined) return numKey const pluralKey = `${key}_${pluralRules.select(query.count)}` - if (getDicValue(dic, pluralKey, config) !== undefined) { + if (getDicValue(dic, pluralKey, config, options) !== undefined) { return pluralKey } const nestedNumKey = `${key}.${query.count}` - if (getDicValue(dic, nestedNumKey, config) !== undefined) return nestedNumKey + if (getDicValue(dic, nestedNumKey, config, options) !== undefined) + return nestedNumKey const nestedKey = `${key}.${pluralRules.select(query.count)}` - if (getDicValue(dic, nestedKey, config) !== undefined) return nestedKey + if (getDicValue(dic, nestedKey, config, options) !== undefined) + return nestedKey return key }