fix: added default validator messages from definition

EAVFW · Dec 2, 2024 · 28f1673 · 28f1673
1 parent 7bc7cb9
commit 28f1673
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 26 deletions.
diff --git a/packages/core/src/model/QuickFormModel.ts b/packages/core/src/model/QuickFormModel.ts
@@ -1,12 +1,14 @@
-import { EndingModel, IntroModel, SlideModel, SubmitModel } from "./index";
+import { EndingModel, IntroModel, QuickFormDefinition, SlideModel, SubmitModel } from "./index";
 
 export type QuickFormModel = {
     validation?: {
-        messages?: {
-            "NOT_ALL_QUESTIONS_ANSWERED"?: string,
-            "SOME_QUESTIONS_HAS_EMPTY_ANSWER"?: string,
-            "SOME_QUESTIONS_HAVE_FAILED_VALIDATION"?: string;
-        }
+        messages?: QuickFormDefinition["validation"]["messages"]
+        //{
+        //    "NOT_ALL_QUESTIONS_ANSWERED"?: string,
+        //    "SOME_QUESTIONS_HAS_EMPTY_ANSWER"?: string,
+        //    "SOME_QUESTIONS_HAVE_FAILED_VALIDATION"?: string;
+        //    "TEXT_MUST_BE_AT_LEAST_CHARACTERS_LONG"?: string; // `Text must be at least ${minLength} characters long.`
+        //}
     },
     intro?: IntroModel;
     slides: SlideModel[];

diff --git a/packages/core/src/model/json-definitions/QuickFormDefinition.ts b/packages/core/src/model/json-definitions/QuickFormDefinition.ts
@@ -10,6 +10,10 @@ export interface QuickFormDefinition {
             "NOT_ALL_QUESTIONS_ANSWERED"?: string,
             "SOME_QUESTIONS_HAS_EMPTY_ANSWER"?: string,
             "SOME_QUESTIONS_HAVE_FAILED_VALIDATION"?: string;
+            "TEXT_MUST_BE_AT_LEAST_CHARACTERS_LONG"?: string; // `Text must be at least ${minLength} characters long.`
+            "TEXT_MUST_BE_BETWEEN_AND_CHARACTERS_LONG"?: string;
+            "INVALID_EMAIL_FORMAT"?: string;
+            "INVALID_PHONE_FORMAT"?: string;
         }
     },
     intro?: IntroModel;

diff --git a/packages/core/src/services/defaults/DefaultInputValidator.ts b/packages/core/src/services/defaults/DefaultInputValidator.ts
@@ -3,62 +3,68 @@ import { InputPropertiesTypes, QuestionModel } from "../../model";
 import { registerQuickFormService } from "../QuickFormServices";
 import { QuickformState } from "../../state";
 
-const validateText = (output: any): ValidationResult => {
+
+const formatString = (template: string, ...args: any[]): string => {
+    if (!template) return undefined;
+
+    return template.replace(/{}/g, () => args.shift());
+};
+const validateText = (output: any, props: any, model: any, state: QuickformState): Promise<ValidationResult> => {
     const text = typeof output === 'string' ? output.trim() : '';
     const minLength = 1;
     const valid = text.length >= minLength;
-    return {
+    return Promise.resolve({
         isValid: valid,
-        message: valid ? "" : `Text must be at least ${minLength} characters long.`,
+        message: valid ? "" : formatString(state.data.validation?.messages?.TEXT_MUST_BE_AT_LEAST_CHARACTERS_LONG, minLength) ?? `Text must be at least ${minLength} characters long.`,
         validatedOutput: output,
-    };
+    });
 };
 
-const validateMultilineText = (output: any): ValidationResult => {
+const validateMultilineText = (output: any, props: any, model: any, state: QuickformState): Promise<ValidationResult> => {
     const text = typeof output === 'string' ? output.trim() : '';
     const minLength = 1;
     const maxLength = 500;
     const valid = text.length >= minLength && text.length <= maxLength;
-    return {
+    return Promise.resolve( {
         isValid: valid,
-        message: valid ? "" : `Text must be between ${minLength} and ${maxLength} characters long.`,
+        message: valid ? "" : formatString(state.data.validation?.messages?.TEXT_MUST_BE_BETWEEN_AND_CHARACTERS_LONG, minLength, maxLength) ?? `Text must be between ${minLength} and ${maxLength} characters long.`,
         validatedOutput: output,
-    };
+    });
 };
 
-const validateEmail = (output: any): ValidationResult => {
+const validateEmail = (output: any, props: any, model: any, state: QuickformState): Promise<ValidationResult> => {
     const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
     const valid = typeof output === 'string' && emailRegex.test(output);
-    return {
+    return Promise.resolve( {
         isValid: valid,
-        message: valid ? "" : "Invalid email format.",
+        message: valid ? "" : state.data.validation?.messages?.INVALID_EMAIL_FORMAT ?? "Invalid email format.",
         validatedOutput: output,
-    };
+    });
 };
 
-const validatePhone = async (output: any): Promise<ValidationResult> => {
+const validatePhone = async (output: any, props: any, model: any, state: QuickformState): Promise<ValidationResult> => {
     // Wait for 2 seconds to demo
     // await new Promise(resolve => setTimeout(resolve, 2000));
 
     const phoneRegex = /^[0-9]{8,}$/;
     const valid = typeof output === 'string' && phoneRegex.test(output);
 
-    return {
+    return Promise.resolve({
         isValid: valid,
-        message: valid ? "" : "Invalid phone format. Expected a string of digits (at least 8).",
+        message: valid ? "" : state.data.validation?.messages?.INVALID_PHONE_FORMAT?? "Invalid phone format. Expected a string of digits (at least 8).",
         validatedOutput: output,
-    };
+    });
 };
 
 type ValidatorMap = {
     [inputType: string]: ValidatorFunction<any, any, QuestionModel<any>, QuickformState>;
 };
 
 const validatorMap: ValidatorMap = {
-    email: (output: any) => Promise.resolve(validateEmail(output)),
-    phone: (output: any) => Promise.resolve(validatePhone(output)),
-    text: (output: any) => Promise.resolve(validateText(output)),
-    multilinetext: (output: any) => Promise.resolve(validateMultilineText(output))
+    email: validateEmail,
+    phone: validatePhone,
+    text: validateText,
+    multilinetext: validateMultilineText
 };
 
 const validateQuestionOutput = async <TProps extends InputPropertiesTypes>(questionModel: QuestionModel<TProps>, state: QuickformState): Promise<ValidationResult> => {