diff --git a/src/components/CreateProject/BulkAddPaymentModal.tsx b/src/components/CreateProject/BulkAddPaymentModal.tsx index 6555dc8..4e92d4d 100644 --- a/src/components/CreateProject/BulkAddPaymentModal.tsx +++ b/src/components/CreateProject/BulkAddPaymentModal.tsx @@ -73,6 +73,7 @@ const BulkAddPaymentModal: React.FC = ({ const { register, reset, trigger, formState, watch, control } = useForm({ + mode: "onTouched", defaultValues: { dateType: "monthly", dateReference: dayjs() }, }); @@ -87,7 +88,12 @@ const BulkAddPaymentModal: React.FC = ({ description, } = formValues; - if (numberOfEntries > 0 && amountToDivide && description) { + if ( + Number.isInteger(numberOfEntries) && + numberOfEntries > 0 && + amountToDivide && + description + ) { const dividedAmount = amountToDivide / numberOfEntries; return Array(numberOfEntries) .fill(undefined) @@ -157,6 +163,17 @@ const BulkAddPaymentModal: React.FC = ({ {...register("numberOfEntries", { valueAsNumber: true, required: t("Required"), + validate: (value) => { + if (!value) { + return t("Required"); + } else if (value < 0) { + return t("Number must be positive"); + } else if (!Number.isInteger(value)) { + return t("Number must be an integer"); + } else { + return true; + } + }, })} error={Boolean(formState.errors.numberOfEntries)} helperText={formState.errors.numberOfEntries?.message}