From f37d2d03dca436dc3adea3ca177a1bc6bc00f479 Mon Sep 17 00:00:00 2001
From: Maria Martinez <maria.martinez@gov.bc.ca>
Date: Wed, 17 Jan 2024 09:32:57 -0800
Subject: [PATCH] FSADT1-1147: - Improved error messages to be meaningful to
 the user - Fixed validation to allow US zip code format

---
 .../client/ClientAddressDtoValidator.java         | 15 ++++++++-------
 .../ErrorNotificationGroupingComponent.vue        |  2 +-
 frontend/src/dto/CommonTypesDto.ts                |  1 +
 frontend/src/pages/FormBCSCPage.vue               |  2 ++
 frontend/src/pages/FormBCeIDPage.vue              |  2 ++
 frontend/src/services/ForestClientService.ts      | 10 ++++++++++
 6 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/backend/src/main/java/ca/bc/gov/app/validator/client/ClientAddressDtoValidator.java b/backend/src/main/java/ca/bc/gov/app/validator/client/ClientAddressDtoValidator.java
index d1f97bfbc6..5c94067233 100644
--- a/backend/src/main/java/ca/bc/gov/app/validator/client/ClientAddressDtoValidator.java
+++ b/backend/src/main/java/ca/bc/gov/app/validator/client/ClientAddressDtoValidator.java
@@ -19,6 +19,7 @@ public class ClientAddressDtoValidator implements Validator {
   private final ProvinceCodeRepository provinceCodeRepository;
 
   private static final Pattern CA_POSTAL_CODE_FORMAT = Pattern.compile("[A-Z]\\d[A-Z]\\d[A-Z]\\d");
+  private static final Pattern US_ZIP_CODE_FORMAT = Pattern.compile("^\\d{5}(?:-\\d{4})?$");
 
   @Override
   public boolean supports(Class<?> clazz) {
@@ -113,7 +114,7 @@ private void handleBlankPostalCode(String postalCode, String country, String pos
         errors.rejectValue(postalCodeField, "You must include a postal code in the format A9A9A9.");
       } 
       else if ("US".equalsIgnoreCase(country)) {
-        errors.rejectValue(postalCodeField, "You must include a ZIP code in the format 00000.");
+        errors.rejectValue(postalCodeField, "You must include a ZIP code in the format 000000 or 00000-0000.");
       } 
       else {
         errors.rejectValue(postalCodeField, "You must include a postal code.");
@@ -134,13 +135,13 @@ private void handlePostalCodeLengthAndFormat(String postalCode, String country,
       }
     } 
     else if ("US".equalsIgnoreCase(country)) {
-      // For US, postal code should be digits (numbers only)
-      if (!StringUtils.isNumeric(postalCode)) {
-        errors.rejectValue(postalCodeField, "should be numeric");
+      // For US, postal code should be up to 10 digits
+      if (StringUtils.length(postalCode) > 10) {
+        errors.rejectValue(postalCodeField, "has more than 10 characters");
       }
-      // For US, postal code should be up to 5 digits
-      if (StringUtils.length(postalCode) > 5) {
-        errors.rejectValue(postalCodeField, "has more than 5 characters");
+      // CA postal code format is A9A9A9
+      if (!US_ZIP_CODE_FORMAT.matcher(postalCode).matches()) {
+        errors.rejectValue(postalCodeField, "invalid US zip code format");
       }
     } 
     else {
diff --git a/frontend/src/components/grouping/ErrorNotificationGroupingComponent.vue b/frontend/src/components/grouping/ErrorNotificationGroupingComponent.vue
index 8d19b53195..a3877dee54 100644
--- a/frontend/src/components/grouping/ErrorNotificationGroupingComponent.vue
+++ b/frontend/src/components/grouping/ErrorNotificationGroupingComponent.vue
@@ -143,7 +143,7 @@ const goToStep = (step: number) => {
       kind="error"
       title="Your application could not be submitted:"      
     >    
-      <div>{{ globalErrorMessage.errorMsg }}</div>    
+      <div>{{ globalErrorMessage.fieldName }} {{ globalErrorMessage.errorMsg }}</div>    
     </cds-actionable-notification>
 
     <cds-actionable-notification
diff --git a/frontend/src/dto/CommonTypesDto.ts b/frontend/src/dto/CommonTypesDto.ts
index a68c888e02..f128554f0a 100644
--- a/frontend/src/dto/CommonTypesDto.ts
+++ b/frontend/src/dto/CommonTypesDto.ts
@@ -20,6 +20,7 @@ export interface BusinessSearchResult {
 
 export interface ValidationMessageType {
   fieldId: string;
+  fieldName: string;
   errorMsg: string;
   originalValue?: string;
 }
diff --git a/frontend/src/pages/FormBCSCPage.vue b/frontend/src/pages/FormBCSCPage.vue
index 03a0bdfeb8..55ed0103c1 100644
--- a/frontend/src/pages/FormBCSCPage.vue
+++ b/frontend/src/pages/FormBCSCPage.vue
@@ -17,6 +17,7 @@ import { isTouchScreen } from "@/composables/useScreenSize";
 import { useEventBus } from "@vueuse/core";
 import {
   codeConversionFn,
+  convertFieldNameToSentence,
   getEnumKeyByEnumValue,
 } from "@/services/ForestClientService";
 import {
@@ -325,6 +326,7 @@ watch([error], () => {
   validationErrors.forEach((errorItem: ValidationMessageType) =>
     notificationBus.emit({
       fieldId: "server.validation.error",
+      fieldName: convertFieldNameToSentence(errorItem.fieldId),
       errorMsg: errorItem.errorMsg,
     })
   );
diff --git a/frontend/src/pages/FormBCeIDPage.vue b/frontend/src/pages/FormBCeIDPage.vue
index d220c3cea6..529da347ce 100644
--- a/frontend/src/pages/FormBCeIDPage.vue
+++ b/frontend/src/pages/FormBCeIDPage.vue
@@ -41,6 +41,7 @@ import ArrowRight16 from "@carbon/icons-vue/es/arrow--right/16";
 import LogOut16 from "@carbon/icons-vue/es/logout/16";
 // @ts-ignore
 import Check16 from "@carbon/icons-vue/es/checkmark/16";
+import { convertFieldNameToSentence } from "@/services/ForestClientService";
 
 const errorBus = useEventBus<ValidationMessageType[]>(
   "submission-error-notification"
@@ -127,6 +128,7 @@ watch([error], () => {
   validationErrors.forEach((errorItem: ValidationMessageType) =>
     notificationBus.emit({
       fieldId: "server.validation.error",
+      fieldName: convertFieldNameToSentence(errorItem.fieldId),
       errorMsg: errorItem.errorMsg,
     })
   );
diff --git a/frontend/src/services/ForestClientService.ts b/frontend/src/services/ForestClientService.ts
index a5e5fc0b44..f4f4562cfb 100644
--- a/frontend/src/services/ForestClientService.ts
+++ b/frontend/src/services/ForestClientService.ts
@@ -65,3 +65,13 @@ export const openMailtoLink = (email) => {
   const mailtoLink = 'mailto:' +  encodedEmail;
   location.assign(mailtoLink);
 }
+
+export const convertFieldNameToSentence = (input: string): string => {
+  const lastPart = input.split('.').pop();
+
+  const words = lastPart
+                  .replace(/([a-z])([A-Z])/g, '$1 $2') // Insert space between camel case
+                  .split(/\s+/);
+  
+  return words.map(word => word.charAt(0).toUpperCase() + word.slice(1)).join(' ');
+};