Fix Translations Not Loading for Global Zod Validators Error Messages…

… and Improve Patient Registration Error Messages (#10581)
ohcnetwork · Feb 13, 2025 · 6c5cefc · 6c5cefc
1 parent ad5cfa4
commit 6c5cefc
Show file tree

Hide file tree

Showing 6 changed files with 32 additions and 19 deletions.
diff --git a/public/locale/en.json b/public/locale/en.json
@@ -1616,7 +1616,6 @@
   "phone_number": "Phone Number",
   "phone_number_at_current_facility": "Phone Number of Contact person at current Facility",
   "phone_number_min_error": "Phone number must be at least 10 characters long",
-  "phone_number_must_be_10_digits": "Phone number must be a 10-digit mobile number",
   "phone_number_not_found": "Phone number not found",
   "phone_number_validation_error": "Entered phone number is not valid",
   "phone_number_verified": "Phone Number Verified",

diff --git a/src/Utils/validators.ts b/src/Utils/validators.ts
@@ -2,27 +2,32 @@ import { t } from "i18next";
 import { isValidPhoneNumber } from "react-phone-number-input";
 import { z } from "zod";
 
-export default {
+export default () => ({
   phoneNumber: {
     optional: z
       .string()
       .optional()
       .refine((val) => !val || isValidPhoneNumber(val), {
         message: t("phone_number_validation_error"),
       }),
-    required: z.string().refine((val) => isValidPhoneNumber(val), {
-      message: t("phone_number_validation_error"),
-    }),
+
+    required: z
+      .string()
+      .min(1, { message: t("field_required") })
+      .refine((val) => isValidPhoneNumber(val), {
+        message: t("phone_number_validation_error"),
+      }),
   },
 
   coordinates: {
     latitude: z
       .number()
       .min(-90, t("invalid_latitude"))
       .max(90, t("invalid_latitude")),
+
     longitude: z
       .number()
       .min(-180, t("invalid_longitude"))
       .max(180, t("invalid_longitude")),
   },
-};
+});
diff --git a/src/components/Facility/FacilityForm.tsx b/src/components/Facility/FacilityForm.tsx
@@ -66,9 +66,9 @@ export default function FacilityForm({
     pincode: z.string().refine(validatePincode, t("invalid_pincode")),
     geo_organization: z.string().min(1, t("field_required")),
     address: z.string().min(1, t("address_is_required")),
-    phone_number: validators.phoneNumber.required,
-    latitude: validators.coordinates.latitude.optional(),
-    longitude: validators.coordinates.longitude.optional(),
+    phone_number: validators().phoneNumber.required,
+    latitude: validators().coordinates.latitude.optional(),
+    longitude: validators().coordinates.longitude.optional(),
     is_public: z.boolean().default(false),
   });
 

diff --git a/src/components/Patient/PatientRegistration.tsx b/src/components/Patient/PatientRegistration.tsx
@@ -87,9 +87,9 @@ export default function PatientRegistration(
       z
         .object({
           name: z.string().nonempty(t("name_is_required")),
-          phone_number: validators.phoneNumber.required,
+          phone_number: validators().phoneNumber.required,
           same_phone_number: z.boolean(),
-          emergency_phone_number: validators.phoneNumber.required,
+          emergency_phone_number: validators().phoneNumber.required,
           gender: z.enum(GENDERS, { required_error: t("gender_is_required") }),
           blood_group: z.enum(BLOOD_GROUPS, {
             required_error: t("blood_group_is_required"),
@@ -120,7 +120,10 @@ export default function PatientRegistration(
             .min(100000, t("pincode_must_be_6_digits"))
             .max(999999, t("pincode_must_be_6_digits")),
           nationality: z.string().nonempty(t("nationality_is_required")),
-          geo_organization: z.string().uuid().optional(),
+          geo_organization: z
+            .string()
+            .uuid({ message: t("geo_organization_is_required") })
+            .optional(),
         })
         .refine(
           (data) => (data.age_or_dob === "dob" ? !!data.date_of_birth : true),
@@ -552,7 +555,7 @@ export default function PatientRegistration(
                                 "age",
                                 e.target.value
                                   ? Number(e.target.value)
-                                  : (undefined as unknown as number), // intentionally setting to undefined, when the value is empty to avoid 0 in the input field
+                                  : (null as unknown as number),
                               )
                             }
                             data-cy="age-input"
@@ -561,10 +564,16 @@ export default function PatientRegistration(
 
                         <FormMessage />
                         {form.getValues("age") && (
-                          <div className="text-violet-600 text-sm font-bold">
-                            {t("year_of_birth")}:{" "}
-                            {new Date().getFullYear() -
-                              Number(form.getValues("age"))}
+                          <div className="text-sm font-bold">
+                            {Number(form.getValues("age")) <= 0 ? (
+                              <span className="text-red-600">Invalid age</span>
+                            ) : (
+                              <span className="text-violet-600">
+                                {t("year_of_birth")}:{" "}
+                                {new Date().getFullYear() -
+                                  Number(form.getValues("age"))}
+                              </span>
+                            )}
                           </div>
                         )}
                       </FormItem>

diff --git a/src/components/Resource/ResourceCreate.tsx b/src/components/Resource/ResourceCreate.tsx
@@ -76,7 +76,7 @@ export default function ResourceCreate(props: ResourceProps) {
     referring_facility_contact_name: z
       .string()
       .min(1, { message: t("field_required") }),
-    referring_facility_contact_number: validators.phoneNumber.required,
+    referring_facility_contact_number: validators().phoneNumber.required,
     priority: z.number().default(1),
   });
 

diff --git a/src/components/Users/UserForm.tsx b/src/components/Users/UserForm.tsx
@@ -90,7 +90,7 @@ export default function UserForm({
       first_name: z.string().min(1, t("field_required")),
       last_name: z.string().min(1, t("field_required")),
       email: z.string().email(t("invalid_email_address")),
-      phone_number: validators.phoneNumber.required,
+      phone_number: validators().phoneNumber.required,
       gender: z.enum(GENDERS, { required_error: t("gender_is_required") }),
       /* TODO: Userbase doesn't currently support these, neither does BE
       but we will probably need these */