From a564ac3a3923ccca1ca2a8ffd2739ba1932d79ce Mon Sep 17 00:00:00 2001 From: Eran Machiels Date: Tue, 9 Feb 2021 08:48:20 +0100 Subject: [PATCH 1/3] Added basics of localization --- src/LocaleMessages.ts | 3 +++ src/Validator.ts | 50 +++++++++++++++++++++++++++++++++++++++--- src/locale/en.ts | 14 ++++++++++++ src/locale/nl-NL.ts | 11 ++++++++++ src/rules/activeUrl.ts | 2 +- src/rules/checked.ts | 2 +- src/rules/max.ts | 2 +- src/rules/min.ts | 2 +- src/rules/regex.ts | 2 +- src/rules/required.ts | 2 +- 10 files changed, 81 insertions(+), 9 deletions(-) create mode 100644 src/LocaleMessages.ts create mode 100644 src/locale/en.ts create mode 100644 src/locale/nl-NL.ts diff --git a/src/LocaleMessages.ts b/src/LocaleMessages.ts new file mode 100644 index 0000000..f606248 --- /dev/null +++ b/src/LocaleMessages.ts @@ -0,0 +1,3 @@ +export type LocaleMessages = Record; + +export type LocaleMessagesMap = Record; diff --git a/src/Validator.ts b/src/Validator.ts index 3bc173b..926c221 100644 --- a/src/Validator.ts +++ b/src/Validator.ts @@ -3,13 +3,15 @@ import { createIntlCache, IntlCache, IntlShape -} from '@formatjs/intl' +} from '@formatjs/intl'; import { Rule, RuleFunction, RuleObject } from './Rule'; import { RuleOptions } from './RuleOptions'; -import { capitalize } from './common/utils'; import { ValidatorArea } from './components/ValidatorArea'; import required from './rules/required'; import { getValue, isCanvasElement } from './common/dom'; +import { LocaleMessagesMap } from './LocaleMessages'; +import { capitalize } from './common/utils'; +import en from './locale/en'; export class Validator { public static VALIDATABLE_ELEMENTS: string[] = [ @@ -63,6 +65,16 @@ export class Validator { */ private validationName?: string; + /** + * The active locale + */ + private static locale = 'en'; + + /** + * Map with messages keyed with locales, containing EN as default + */ + private static messages: LocaleMessagesMap = en; + public constructor( elements: HTMLElement[], rules: RuleOptions, @@ -83,7 +95,8 @@ export class Validator { */ private createIntl(): IntlShape { return createIntl({ - locale: 'en' + locale: Validator.locale, + messages: Validator.messages[Validator.locale] }, this.intlCache); } @@ -252,4 +265,35 @@ export class Validator { public static ruleExists(name: string): boolean { return Object.prototype.hasOwnProperty.call(Validator.rules, name); } + + public static hasLocale(locale: string): boolean { + return !!Object.prototype.hasOwnProperty.call(Validator.messages, locale); + } + + /** + * Adds a locale map to the messages map, keyed by locale + */ + public static addLocale(messages: LocaleMessagesMap): void { + Validator.messages = { + ...Validator.messages, + ...messages + }; + } + + /** + * Sets the given locale for all the new created validator instance or defaults to English if the locale does not + * exist + */ + public static setLocale(locale: string, messages?: LocaleMessagesMap): void { + if (!messages) { + if (Validator.hasLocale(locale)) { + Validator.locale = locale; + } else { + Validator.locale = 'en'; + } + } else { + Validator.addLocale(messages); + Validator.setLocale(locale); + } + } } diff --git a/src/locale/en.ts b/src/locale/en.ts new file mode 100644 index 0000000..28d9aa9 --- /dev/null +++ b/src/locale/en.ts @@ -0,0 +1,14 @@ +import { LocaleMessagesMap } from '../LocaleMessages'; + +const en: LocaleMessagesMap = { + en: { + activeUrl: '{name} is not an active url', + checked: '{name} is not checked', + max: '{name} should be not greater than {0}', + min: '{name} should be at least {0}', + regex: '{name} doesn\'t have a valid format', + required: '{name} is required' + } +} + +export default en; diff --git a/src/locale/nl-NL.ts b/src/locale/nl-NL.ts new file mode 100644 index 0000000..e4e4138 --- /dev/null +++ b/src/locale/nl-NL.ts @@ -0,0 +1,11 @@ +export default { + 'nl-NL': { + activeUrl: '{} is geen actieve URL', + checked: '{name} is niet aangevinkt.', + max: '{name} max niet meer zijn dan {0}', + min: '{name} moet minstens {0} zijn', + regex: '{name} heeft geen geldig formaat', + required: '{name} is verplicht' + } +} + diff --git a/src/rules/activeUrl.ts b/src/rules/activeUrl.ts index b8cb506..ff7d6e0 100644 --- a/src/rules/activeUrl.ts +++ b/src/rules/activeUrl.ts @@ -29,6 +29,6 @@ export default { .length; }, message(): string { - return 'Not an active url' + return 'activeUrl'; } } diff --git a/src/rules/checked.ts b/src/rules/checked.ts index d7d2678..cf4ec1f 100644 --- a/src/rules/checked.ts +++ b/src/rules/checked.ts @@ -28,6 +28,6 @@ export default { }) }, message(): string { - return '{name} is not checked.'; + return 'checked'; } }; diff --git a/src/rules/max.ts b/src/rules/max.ts index 146fb12..f4957ce 100644 --- a/src/rules/max.ts +++ b/src/rules/max.ts @@ -34,6 +34,6 @@ export default { }) }, message(): string { - return `{name} should be not greater than {0}` + return 'max'; } }; diff --git a/src/rules/min.ts b/src/rules/min.ts index d3e11d8..e8d7720 100644 --- a/src/rules/min.ts +++ b/src/rules/min.ts @@ -34,6 +34,6 @@ export default { }) }, message(): string { - return `{name} should be at least {0}` + return 'min'; } }; diff --git a/src/rules/regex.ts b/src/rules/regex.ts index cb1bd19..e92da7b 100644 --- a/src/rules/regex.ts +++ b/src/rules/regex.ts @@ -16,6 +16,6 @@ export default { }) }, message(): string { - return '{name} heeft een ongeldig formaat'; + return 'regex'; } } diff --git a/src/rules/required.ts b/src/rules/required.ts index eb788e9..c81c91a 100644 --- a/src/rules/required.ts +++ b/src/rules/required.ts @@ -27,6 +27,6 @@ export default { }, message(): string { - return `{name} is required`; + return 'required'; } }; From d015484ad0359021756814e8e6e0472f097826dc Mon Sep 17 00:00:00 2001 From: Eran Machiels Date: Tue, 9 Feb 2021 08:54:46 +0100 Subject: [PATCH 2/3] Added getLocale method and tests --- __tests__/suits/Validator.test.tsx | 20 +++++++++++++++++++- src/Validator.ts | 7 +++++++ 2 files changed, 26 insertions(+), 1 deletion(-) diff --git a/__tests__/suits/Validator.test.tsx b/__tests__/suits/Validator.test.tsx index 4e9ec4c..e132317 100644 --- a/__tests__/suits/Validator.test.tsx +++ b/__tests__/suits/Validator.test.tsx @@ -149,5 +149,23 @@ describe('test validator', () => { await validator.validate(); expect(validator.getErrors()[0]).toBe('Value is false negative required'); - }) + }); + + it('should change locale if it exists', () => { + const messages = { + test: { + foo: 'bar' + } + }; + + Validator.setLocale('test', messages); + + expect(Validator.getLocale()).toBe('test'); + }); + + it('should default to en if changing to an non-existing locale', () => { + Validator.setLocale('not_existing'); + + expect(Validator.getLocale()).toBe('en'); + }); }); diff --git a/src/Validator.ts b/src/Validator.ts index 926c221..25733a4 100644 --- a/src/Validator.ts +++ b/src/Validator.ts @@ -296,4 +296,11 @@ export class Validator { Validator.setLocale(locale); } } + + /** + * Gets the current locale of the validator + */ + public static getLocale(): string { + return Validator.locale; + } } From 4021d97d17a6534b774265ca92156457eaf46d57 Mon Sep 17 00:00:00 2001 From: Eran Machiels Date: Tue, 9 Feb 2021 20:33:41 +0100 Subject: [PATCH 3/3] Changed nl file syntax to match en --- src/locale/{nl-NL.ts => nl.ts} | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) rename src/locale/{nl-NL.ts => nl.ts} (70%) diff --git a/src/locale/nl-NL.ts b/src/locale/nl.ts similarity index 70% rename from src/locale/nl-NL.ts rename to src/locale/nl.ts index e4e4138..937f69d 100644 --- a/src/locale/nl-NL.ts +++ b/src/locale/nl.ts @@ -1,5 +1,7 @@ -export default { - 'nl-NL': { +import { LocaleMessagesMap } from '../LocaleMessages'; + +const nl: LocaleMessagesMap = { + nl: { activeUrl: '{} is geen actieve URL', checked: '{name} is niet aangevinkt.', max: '{name} max niet meer zijn dan {0}', @@ -9,3 +11,5 @@ export default { } } +export default nl; +