From 13f1f5bdf5e6c60f551293e974f64de5202a12c9 Mon Sep 17 00:00:00 2001 From: Sampo Tawast <5328394+sirtawast@users.noreply.github.com> Date: Mon, 12 Aug 2024 10:48:46 +0300 Subject: [PATCH] fix: validation and fixes to manual calculation (hl-1107) (#3202) * feat: add validation for manual calculation fields: sum per month required * fix: manual calculation would not be shown if normal is calculated first --- .../SalaryBenefitManualCalculatorView.tsx | 7 ++--- .../SalaryCalculatorResults.tsx | 2 +- .../useSalaryBenefitCalculatorData.ts | 9 +++++-- .../utils/validation.ts | 26 ++++++++++++++++++- 4 files changed, 35 insertions(+), 9 deletions(-) diff --git a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryBenefitManualCalculatorView.tsx b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryBenefitManualCalculatorView.tsx index 3acf840434..7493c8897a 100644 --- a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryBenefitManualCalculatorView.tsx +++ b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryBenefitManualCalculatorView.tsx @@ -6,8 +6,6 @@ import { Field } from 'shared/components/forms/fields/types'; import { $GridCell } from 'shared/components/forms/section/FormSection.sc'; import { formatStringFloatValue } from 'shared/utils/string.utils'; -import { $CalculatorText } from '../ApplicationReview.sc'; - const SalaryBenefitManualCalculatorView: React.FC< SalaryBenefitManualCalculatorViewProps > = ({ formik, fields, getErrorMessage }) => { @@ -18,13 +16,11 @@ const SalaryBenefitManualCalculatorView: React.FC< return ( <> - <$GridCell $colStart={1} $colSpan={2}> - <$CalculatorText>{overrideMonthlyBenefitAmount?.label} - <$GridCell $colStart={1} $colSpan={2}> formik.setFieldValue( overrideMonthlyBenefitAmount?.name, @@ -37,6 +33,7 @@ const SalaryBenefitManualCalculatorView: React.FC< invalid={!!getErrorMessage(overrideMonthlyBenefitAmount?.name)} aria-invalid={!!getErrorMessage(overrideMonthlyBenefitAmount?.name)} errorText={getErrorMessage(overrideMonthlyBenefitAmount?.name)} + required /> diff --git a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryCalculatorResults/SalaryCalculatorResults.tsx b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryCalculatorResults/SalaryCalculatorResults.tsx index eb9d49a2f9..ef9295fa23 100644 --- a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryCalculatorResults/SalaryCalculatorResults.tsx +++ b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/SalaryCalculatorResults/SalaryCalculatorResults.tsx @@ -34,7 +34,7 @@ const SalaryCalculatorResults: React.FC = ({ return null; } - if (rowsWithoutTotal.length === 0) { + if (rowsWithoutTotal.length === 0 && !isManualCalculator) { return null; } diff --git a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/useSalaryBenefitCalculatorData.ts b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/useSalaryBenefitCalculatorData.ts index 833eae80e4..315bd886dc 100644 --- a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/useSalaryBenefitCalculatorData.ts +++ b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/useSalaryBenefitCalculatorData.ts @@ -24,7 +24,10 @@ import { } from 'shared/utils/date.utils'; import { v4 as uuidv4 } from 'uuid'; -import { getValidationSchema } from './utils/validation'; +import { + getManualValidationSchema, + getValidationSchema, +} from './utils/validation'; type ExtendedComponentProps = { formik: FormikProps; @@ -105,7 +108,9 @@ const useSalaryBenefitCalculatorData = ( ? application?.trainingCompensations : [], }, - validationSchema: getValidationSchema(t), + validationSchema: isManualCalculator + ? getManualValidationSchema(t) + : getValidationSchema(t), validateOnChange: true, validateOnBlur: true, enableReinitialize: true, diff --git a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/utils/validation.ts b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/utils/validation.ts index 669e1ea804..2fab10fbb2 100644 --- a/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/utils/validation.ts +++ b/frontend/benefit/handler/src/components/applicationReview/salaryBenefitCalculatorView/utils/validation.ts @@ -1,4 +1,5 @@ import { validateNumberField } from '@frontend/benefit-shared/src/utils/validation'; +import { CALCULATION_SALARY_KEYS } from 'benefit/handler/constants'; import { CALCULATION_EMPLOYMENT_KEYS, EMPLOYEE_KEYS, @@ -6,7 +7,10 @@ import { VALIDATION_MESSAGE_KEYS, } from 'benefit-shared/constants'; import { CalculationCommon } from 'benefit-shared/types/application'; +import { validateDateWithinMonths } from 'benefit-shared/utils/dates'; +import { subMonths } from 'date-fns'; import { TFunction } from 'next-i18next'; +import { convertToUIDateFormat } from 'shared/utils/date.utils'; import * as Yup from 'yup'; export const getValidationSchema = ( @@ -15,9 +19,16 @@ export const getValidationSchema = ( Yup.object().shape({ [CALCULATION_EMPLOYMENT_KEYS.START_DATE]: Yup.string() .typeError(VALIDATION_MESSAGE_KEYS.DATE_FORMAT) - .required(VALIDATION_MESSAGE_KEYS.REQUIRED), + .required(VALIDATION_MESSAGE_KEYS.REQUIRED) + .test({ + message: t(VALIDATION_MESSAGE_KEYS.DATE_MIN, { + min: convertToUIDateFormat(subMonths(new Date(), 60)), + }), + test: (value = '') => validateDateWithinMonths(value, 60), + }), [CALCULATION_EMPLOYMENT_KEYS.END_DATE]: Yup.string() .typeError(VALIDATION_MESSAGE_KEYS.DATE_FORMAT) + .matches(/^\d+\.\d+\.20\d{2}$/, VALIDATION_MESSAGE_KEYS.DATE_FORMAT) .required(VALIDATION_MESSAGE_KEYS.REQUIRED), [EMPLOYEE_KEYS.VACATION_MONEY]: validateNumberField(0, MAX_MONTHLY_PAY, { required: t(VALIDATION_MESSAGE_KEYS.REQUIRED), @@ -32,3 +43,16 @@ export const getValidationSchema = ( typeError: t(VALIDATION_MESSAGE_KEYS.NUMBER_INVALID), }), }); + +export const getManualValidationSchema = ( + t: TFunction +): Yup.SchemaOf => + getValidationSchema(t).shape({ + [CALCULATION_SALARY_KEYS.OVERRIDE_MONTHLY_BENEFIT_AMOUNT]: + validateNumberField(0, 800, { + required: t(VALIDATION_MESSAGE_KEYS.REQUIRED), + typeError: t(VALIDATION_MESSAGE_KEYS.NUMBER_INVALID), + }), + [CALCULATION_SALARY_KEYS.OVERRIDE_MONTHLY_BENEFIT_AMOUNT_COMMENT]: + Yup.string().required(t(VALIDATION_MESSAGE_KEYS.REQUIRED)), + });