From 55f6fbd30b0c069565d7fb79b1994fdceaa25eb6 Mon Sep 17 00:00:00 2001 From: dovilemely Date: Fri, 26 Apr 2024 15:47:02 +0300 Subject: [PATCH 1/3] validate if selected event time is after minTime --- src/components/forms/Registration.tsx | 5 +- src/utils/functions.ts | 6 ++ src/utils/texts.ts | 1 + src/utils/validations.ts | 141 ++++++++++++++------------ 4 files changed, 85 insertions(+), 68 deletions(-) diff --git a/src/components/forms/Registration.tsx b/src/components/forms/Registration.tsx index 5b691ec..452f87f 100644 --- a/src/components/forms/Registration.tsx +++ b/src/components/forms/Registration.tsx @@ -195,7 +195,10 @@ const RegistrationForm = ({ const deleteInfo = getDeleteInfo(); - const validationSchema = isFreelancer ? validateFreelancerFishStocking : validateFishStocking; + const validationSchema = () => { + const applySchema = isFreelancer ? validateFreelancerFishStocking : validateFishStocking; + return applySchema(minTime); + }; const filterFishTypes = (batches: any[]) => { const batchesFishTypesIds = batches.filter((b) => !!b.fishType?.id).map((b) => b.fishType?.id); diff --git a/src/utils/functions.ts b/src/utils/functions.ts index f7ae92b..213c81b 100644 --- a/src/utils/functions.ts +++ b/src/utils/functions.ts @@ -242,3 +242,9 @@ export const compressImageSize = (file: File) => 'blob', ); }); + +export const checkIfDateIsAfter = (value: Date | undefined, minTime: number) => { + const selectedDate = value && new Date(value); + const minDate = new Date(new Date().setDate(new Date().getDate() + minTime)); + return selectedDate && selectedDate > minDate; +}; diff --git a/src/utils/texts.ts b/src/utils/texts.ts index faab3e7..9e3091f 100644 --- a/src/utils/texts.ts +++ b/src/utils/texts.ts @@ -24,6 +24,7 @@ export const validationTexts: any = { positiveNumber: 'Reikšmė turi būti didesnė už nulį', requireFiles: 'Privalote įkelti dokumentus', atLeastOneColumn: 'Turi būti pasirinktas bent vienas stulpelis', + invalidEventTime: 'Pasirinkite teisingą datą', }; export const inputLabels = { diff --git a/src/utils/validations.ts b/src/utils/validations.ts index 1081f02..4cc544d 100644 --- a/src/utils/validations.ts +++ b/src/utils/validations.ts @@ -3,6 +3,7 @@ import * as Yup from 'yup'; import { FishOriginTypes } from './constants'; import { validationTexts } from './texts'; import { FishBatch, FishType } from './types'; +import { checkIfDateIsAfter } from './functions'; export const loginSchema = Yup.object().shape({ email: Yup.string().required(validationTexts.requireText).email(validationTexts.badEmailFormat), @@ -47,74 +48,80 @@ export const validateMyProfile = Yup.object().shape({ .matches(/^(86|\+3706)\d{7}$/, validationTexts.badPhoneFormat), }); -export const validateFishStocking = Yup.object().shape({ - location: Yup.object().required(validationTexts.requireText), - eventTime: Yup.date() - .required(validationTexts.requireText) - .typeError(validationTexts.requireText), - assignedTo: Yup.object().required(validationTexts.requireText).nullable(), - phone: Yup.string() - .required(validationTexts.requireText) - .trim() - .matches(/^(86|\+3706)\d{7}$/, validationTexts.badPhoneFormat), - batches: Yup.array().of( - Yup.object().shape({ - fishType: Yup.object() - .required(validationTexts.requireSelect) - .shape({ - id: Yup.number().required(validationTexts.requireText), - }), - fishAge: Yup.object() - .required(validationTexts.requireSelect) - .shape({ - id: Yup.number().required(validationTexts.requireText), - }), - amount: Yup.string().required(validationTexts.requireText), - }), - ), - fishOriginCompanyName: Yup.string().when('fishOrigin', (fishOrigin: any, schema: any) => - fishOrigin?.[0] === FishOriginTypes.GROWN - ? schema.required(validationTexts.requireText) - : schema, - ), - fishOriginReservoir: Yup.object().when('fishOrigin', (fishOrigin: any, schema: any) => - fishOrigin?.[0] === FishOriginTypes.CAUGHT - ? schema.required(validationTexts.requireText) - : schema, - ), -}); +export const validateFishStocking = (minTime: number) => + Yup.object().shape({ + location: Yup.object().required(validationTexts.requireText), + eventTime: Yup.date() + .test('valid eventTime', validationTexts.invalidEventTime, (value) => { + return checkIfDateIsAfter(value, minTime); + }) + .required(validationTexts.requireText), + assignedTo: Yup.object().required(validationTexts.requireText).nullable(), + phone: Yup.string() + .required(validationTexts.requireText) + .trim() + .matches(/^(86|\+3706)\d{7}$/, validationTexts.badPhoneFormat), + batches: Yup.array().of( + Yup.object().shape({ + fishType: Yup.object() + .required(validationTexts.requireSelect) + .shape({ + id: Yup.number().required(validationTexts.requireText), + }), + fishAge: Yup.object() + .required(validationTexts.requireSelect) + .shape({ + id: Yup.number().required(validationTexts.requireText), + }), + amount: Yup.string().required(validationTexts.requireText), + }), + ), + fishOriginCompanyName: Yup.string().when('fishOrigin', (fishOrigin: any, schema: any) => + fishOrigin?.[0] === FishOriginTypes.GROWN + ? schema.required(validationTexts.requireText) + : schema, + ), + fishOriginReservoir: Yup.object().when('fishOrigin', (fishOrigin: any, schema: any) => + fishOrigin?.[0] === FishOriginTypes.CAUGHT + ? schema.required(validationTexts.requireText) + : schema, + ), + }); -export const validateFreelancerFishStocking = Yup.object().shape({ - location: Yup.object().required(validationTexts.requireText), - eventTime: Yup.date() - .required(validationTexts.requireText) - .typeError(validationTexts.requireText), - batches: Yup.array().of( - Yup.object().shape({ - fishType: Yup.object() - .required(validationTexts.requireSelect) - .shape({ - id: Yup.number().required(validationTexts.requireText), - }), - fishAge: Yup.object() - .required(validationTexts.requireSelect) - .shape({ - id: Yup.number().required(validationTexts.requireText), - }), - amount: Yup.string().required(validationTexts.requireText), - }), - ), - fishOriginCompanyName: Yup.string().when('fishOrigin', (fishOrigin: any, schema: any) => - fishOrigin?.[0] === FishOriginTypes.GROWN - ? schema.required(validationTexts.requireText) - : schema, - ), - fishOriginReservoir: Yup.object().when('fishOrigin', (fishOrigin: any, schema: any) => - fishOrigin?.[0] === FishOriginTypes.CAUGHT - ? schema.required(validationTexts.requireText) - : schema, - ), -}); +export const validateFreelancerFishStocking = (minTime: number) => + Yup.object().shape({ + location: Yup.object().required(validationTexts.requireText), + eventTime: Yup.date() + .test('valid eventTime', validationTexts.invalidEventTime, (value) => { + return checkIfDateIsAfter(value, minTime); + }) + .required(validationTexts.requireText), + batches: Yup.array().of( + Yup.object().shape({ + fishType: Yup.object() + .required(validationTexts.requireSelect) + .shape({ + id: Yup.number().required(validationTexts.requireText), + }), + fishAge: Yup.object() + .required(validationTexts.requireSelect) + .shape({ + id: Yup.number().required(validationTexts.requireText), + }), + amount: Yup.string().required(validationTexts.requireText), + }), + ), + fishOriginCompanyName: Yup.string().when('fishOrigin', (fishOrigin: any, schema: any) => + fishOrigin?.[0] === FishOriginTypes.GROWN + ? schema.required(validationTexts.requireText) + : schema, + ), + fishOriginReservoir: Yup.object().when('fishOrigin', (fishOrigin: any, schema: any) => + fishOrigin?.[0] === FishOriginTypes.CAUGHT + ? schema.required(validationTexts.requireText) + : schema, + ), + }); export const validateFishStockingReview = Yup.object().shape({ waybillNo: Yup.string().required(validationTexts.requireText), From a6a4299cfc06e0eaaf698d5c295f037ef6d25947 Mon Sep 17 00:00:00 2001 From: dovilemely Date: Mon, 6 May 2024 21:18:25 +0300 Subject: [PATCH 2/3] trim phone number value on change, update validation --- src/components/forms/Registration.tsx | 4 ++-- src/pages/MyProfile.tsx | 2 +- src/pages/TenantUsers.tsx | 2 +- src/utils/validations.ts | 8 +++++--- 4 files changed, 9 insertions(+), 7 deletions(-) diff --git a/src/components/forms/Registration.tsx b/src/components/forms/Registration.tsx index 452f87f..a85e494 100644 --- a/src/components/forms/Registration.tsx +++ b/src/components/forms/Registration.tsx @@ -320,7 +320,7 @@ const RegistrationForm = ({ error={errors.assignedTo} onChange={(value: any) => { setFieldValue('assignedTo', value); - setFieldValue('phone', value?.phone || ''); + setFieldValue('phone', value?.phone?.trim() || ''); }} options={users} disabled={isCustomer} @@ -334,7 +334,7 @@ const RegistrationForm = ({ error={errors.phone} onChange={(e: any) => { if (/^\+?[0-9\s]{0,11}$/.test(e)) { - setFieldValue('phone', e); + setFieldValue('phone', e.trim()); } }} disabled={isCustomer} diff --git a/src/pages/MyProfile.tsx b/src/pages/MyProfile.tsx index d5d1a40..3ddcf69 100644 --- a/src/pages/MyProfile.tsx +++ b/src/pages/MyProfile.tsx @@ -95,7 +95,7 @@ const MyProfile = () => { label={inputLabels.phone} name="phone" placeholder="864222222" - onChange={(value) => setFieldValue('phone', value)} + onChange={(value) => setFieldValue('phone', value?.trim())} disabled={disabled} error={errors.phone} /> diff --git a/src/pages/TenantUsers.tsx b/src/pages/TenantUsers.tsx index f3409d8..0fbb43e 100644 --- a/src/pages/TenantUsers.tsx +++ b/src/pages/TenantUsers.tsx @@ -255,7 +255,7 @@ const NariaiPage = () => { label={inputLabels.phone} name="phone" placeholder="864222222" - onChange={(value) => setFieldValue('phone', value)} + onChange={(value) => setFieldValue('phone', value?.trim())} disabled={disabled} error={errors.phone} /> diff --git a/src/utils/validations.ts b/src/utils/validations.ts index 4cc544d..15c9290 100644 --- a/src/utils/validations.ts +++ b/src/utils/validations.ts @@ -5,6 +5,8 @@ import { validationTexts } from './texts'; import { FishBatch, FishType } from './types'; import { checkIfDateIsAfter } from './functions'; +const lithuanianPhoneNumberFormat = /^(06|86|\+3706)\d{7}$/; + export const loginSchema = Yup.object().shape({ email: Yup.string().required(validationTexts.requireText).email(validationTexts.badEmailFormat), password: Yup.string().required(validationTexts.requireText), @@ -29,7 +31,7 @@ export const validateNewTenantUser = Yup.object().shape({ phone: Yup.string() .required(validationTexts.requireText) .trim() - .matches(/^(86|\+3706)\d{7}$/, validationTexts.badPhoneFormat), + .matches(lithuanianPhoneNumberFormat, validationTexts.badPhoneFormat), personalCode: Yup.string() .required(validationTexts.requireText) .trim() @@ -45,7 +47,7 @@ export const validateMyProfile = Yup.object().shape({ phone: Yup.string() .required(validationTexts.requireText) .trim() - .matches(/^(86|\+3706)\d{7}$/, validationTexts.badPhoneFormat), + .matches(lithuanianPhoneNumberFormat, validationTexts.badPhoneFormat), }); export const validateFishStocking = (minTime: number) => @@ -60,7 +62,7 @@ export const validateFishStocking = (minTime: number) => phone: Yup.string() .required(validationTexts.requireText) .trim() - .matches(/^(86|\+3706)\d{7}$/, validationTexts.badPhoneFormat), + .matches(lithuanianPhoneNumberFormat, validationTexts.badPhoneFormat), batches: Yup.array().of( Yup.object().shape({ fishType: Yup.object() From d272cf3abcd95dedbf2c064eaa391cf7fe6042ad Mon Sep 17 00:00:00 2001 From: dovilemely Date: Mon, 6 May 2024 21:43:08 +0300 Subject: [PATCH 3/3] removing trim method from yup validation schema --- src/utils/validations.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/utils/validations.ts b/src/utils/validations.ts index 15c9290..ec5d4d3 100644 --- a/src/utils/validations.ts +++ b/src/utils/validations.ts @@ -30,7 +30,6 @@ export const validateNewTenantUser = Yup.object().shape({ }), phone: Yup.string() .required(validationTexts.requireText) - .trim() .matches(lithuanianPhoneNumberFormat, validationTexts.badPhoneFormat), personalCode: Yup.string() .required(validationTexts.requireText) @@ -46,7 +45,6 @@ export const validateMyProfile = Yup.object().shape({ email: Yup.string().required(validationTexts.requireText).email(validationTexts.badEmailFormat), phone: Yup.string() .required(validationTexts.requireText) - .trim() .matches(lithuanianPhoneNumberFormat, validationTexts.badPhoneFormat), }); @@ -61,7 +59,6 @@ export const validateFishStocking = (minTime: number) => assignedTo: Yup.object().required(validationTexts.requireText).nullable(), phone: Yup.string() .required(validationTexts.requireText) - .trim() .matches(lithuanianPhoneNumberFormat, validationTexts.badPhoneFormat), batches: Yup.array().of( Yup.object().shape({