Merge pull request #1391 from Gary-Community-Ventures/feat/trim_input…

…_text Trim input text
Gary-Community-Ventures · Dec 6, 2024 · 9c926e6 · 9c926e6
2 parents c815978 + fff2c74
commit 9c926e6
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 24 deletions.
diff --git a/src/Components/Steps/Expenses/Expenses.tsx b/src/Components/Steps/Expenses/Expenses.tsx
@@ -37,8 +37,6 @@ import './Expenses.css';
 const Expenses = () => {
   const { formData, setFormData, locale } = useContext(Context);
   const { uuid, id } = useParams();
-  const currentStepId = Number(id);
-  const navigate = useNavigate();
   const intl = useIntl();
   const translatedAriaLabel = intl.formatMessage({
     id: 'questions.hasExpenses-ariaLabel',
@@ -51,7 +49,7 @@ const Expenses = () => {
   const oneOrMoreDigitsButNotAllZero = /^(?!0+$)\d+$/;
   const expenseSourceSchema = z.object({
     expenseSourceName: z.string().min(1),
-    expenseAmount: z.string().regex(oneOrMoreDigitsButNotAllZero),
+    expenseAmount: z.string().trim().regex(oneOrMoreDigitsButNotAllZero),
   });
   const expenseSourcesSchema = z.array(expenseSourceSchema);
   const hasExpensesSchema = z.string().regex(/^true|false$/);

diff --git a/src/Components/Steps/HouseholdSize.tsx b/src/Components/Steps/HouseholdSize.tsx
@@ -47,15 +47,15 @@ const HouseholdSize = () => {
     },
   });
 
-  const formSubmitHandler: SubmitHandler<z.infer<typeof formSchema>> = async ({ householdSize }) => {
+  const formSubmitHandler: SubmitHandler<z.infer<typeof formSchema>> = ({ householdSize }) => {
     if (uuid) {
       const updatedFormData = {
         ...formData,
         householdSize,
         householdData: formData.householdData.slice(0, householdSize),
       };
       setFormData(updatedFormData);
-      await updateScreen(uuid, updatedFormData, locale);
+      updateScreen(uuid, updatedFormData, locale);
       nextStep();
     }
   };

diff --git a/src/Components/Steps/Referrer.tsx b/src/Components/Steps/Referrer.tsx
@@ -42,7 +42,7 @@ export default function ReferralSourceStep() {
           defaultMessage: 'Please select a referral source.',
         }),
       ),
-      otherReferrer: z.string(),
+      otherReferrer: z.string().trim(),
     })
     .refine((val) => val.referralSource !== 'other' || val.otherReferrer.length > 0, {
       message: formatMessage({

diff --git a/src/Components/Steps/ZipcodeStep.tsx b/src/Components/Steps/ZipcodeStep.tsx
@@ -8,24 +8,35 @@ import { FormattedMessageType } from '../../Types/Questions';
 import { FormData } from '../../Types/FormData';
 import { Context } from '../Wrapper/Wrapper';
 import { updateScreen } from '../../Assets/updateScreen';
-import ErrorMessageWrapper from '../ErrorMessage/ErrorMessageWrapper.tsx';
-import { useConfig } from '../Config/configHook.tsx';
+import ErrorMessageWrapper from '../ErrorMessage/ErrorMessageWrapper';
+import { useConfig } from '../Config/configHook';
 import * as z from 'zod';
 import QuestionHeader from '../QuestionComponents/QuestionHeader';
 import QuestionLeadText from '../QuestionComponents/QuestionLeadText';
 import QuestionQuestion from '../QuestionComponents/QuestionQuestion';
-import PrevAndContinueButtons from '../PrevAndContinueButtons/PrevAndContinueButtons.tsx';
+import PrevAndContinueButtons from '../PrevAndContinueButtons/PrevAndContinueButtons';
 import { useDefaultBackNavigationFunction, useGoToNextStep } from '../QuestionComponents/questionHooks';
 
 export const ZipcodeStep = () => {
   const { formData, locale, setFormData } = useContext(Context);
   const { uuid } = useParams();
   const backNavigationFunction = useDefaultBackNavigationFunction('zipcode');
 
-  const countiesByZipcode = useConfig('counties_by_zipcode');
+  const countiesByZipcode = useConfig<{ [key: string]: { [key: string]: string } }>('counties_by_zipcode');
+
+  const checkCountyIsValid = ({ zipcode, county }: { zipcode: string; county: string }) => {
+    const validCounties = countiesByZipcode[zipcode];
+
+    if (validCounties && county in validCounties) {
+      return true;
+    }
+    return false;
+  };
+
   const numberMustBeFiveDigitsLongRegex = /^\d{5}$/;
   const zipcodeSchema = z
     .string()
+    .trim()
     .regex(numberMustBeFiveDigitsLongRegex)
     .refine((data) => data in countiesByZipcode);
 
@@ -50,27 +61,19 @@ export const ZipcodeStep = () => {
   });
 
   const currentZipcodeValue = watch('zipcode');
-  const shouldShowCountyInput = zipcodeSchema.safeParse(currentZipcodeValue).success;
+  const parsedZipCode = zipcodeSchema.safeParse(currentZipcodeValue);
+
   const nextStep = useGoToNextStep('zipcode');
 
-  const formSubmitHandler = async (zipCodeAndCountyData: FormData) => {
+  const formSubmitHandler = (zipCodeAndCountyData: FormData) => {
     if (uuid) {
       const updatedFormData = { ...formData, ...zipCodeAndCountyData };
       setFormData(updatedFormData);
-      await updateScreen(uuid, updatedFormData, locale);
+      updateScreen(uuid, updatedFormData, locale);
       nextStep();
     }
   };
 
-  const checkCountyIsValid = ({ zipcode, county }) => {
-    const validCounties = countiesByZipcode[zipcode];
-
-    if (validCounties && county in validCounties) {
-      return true;
-    }
-    return false;
-  };
-
   const createMenuItems = (disabledSelectMenuItemText: FormattedMessageType, options: Record<string, string>) => {
     const disabledSelectMenuItem = (
       <MenuItem value="disabled-select" key="disabled-select" disabled>
@@ -138,7 +141,7 @@ export const ZipcodeStep = () => {
             />
           )}
         />
-        {shouldShowCountyInput && (
+        {parsedZipCode.success && (
           <div>
             <QuestionQuestion>
               <FormattedMessage id="questions.zipcode-a" defaultMessage="Please select a county:" />
@@ -164,7 +167,7 @@ export const ZipcodeStep = () => {
                           id="questions.zipcode-a-disabledSelectMenuItemText"
                           defaultMessage="Select a county"
                         />,
-                        countiesByZipcode[watch('zipcode')],
+                        countiesByZipcode[parsedZipCode.data],
                       )}
                     </Select>
                     <FormHelperText>{errors.county !== undefined && renderCountyHelperText()}</FormHelperText>