chore: create/update estimate points validation (#871)

This commit is contained in:
Aaryan Khandelwal 2023-04-18 10:54:19 +05:30 committed by GitHub
parent acff6396f9
commit 682a1477fb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 58 deletions

View File

@ -1,23 +1,22 @@
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect } from "react";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { useForm } from "react-hook-form"; import { useForm } from "react-hook-form";
import { mutate } from "swr"; import { mutate } from "swr";
// services
import estimatesService from "services/estimates.service";
// headless ui // headless ui
import { Dialog, Transition } from "@headlessui/react"; import { Dialog, Transition } from "@headlessui/react";
// hooks // hooks
import useToast from "hooks/use-toast"; import useToast from "hooks/use-toast";
// ui // ui
import { Input, PrimaryButton, SecondaryButton } from "components/ui"; import { Input, PrimaryButton, SecondaryButton } from "components/ui";
// icons
import { ExclamationTriangleIcon } from "@heroicons/react/24/outline";
// types // types
import type { IEstimate, IEstimatePoint } from "types"; import type { IEstimate, IEstimatePoint } from "types";
// fetch-keys
import estimatesService from "services/estimates.service";
import { ESTIMATE_POINTS_LIST } from "constants/fetch-keys"; import { ESTIMATE_POINTS_LIST } from "constants/fetch-keys";
type Props = { type Props = {
@ -144,6 +143,21 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
}; };
const onSubmit = async (formData: FormValues) => { const onSubmit = async (formData: FormValues) => {
let c = 0;
Object.keys(formData).map((key) => {
if (formData[key as keyof FormValues] === "") c++;
});
if (c !== 0) {
setToastAlert({
type: "error",
title: "Error!",
message: "Please fill all the fields.",
});
return;
}
if (data && data.length !== 0) await updateEstimatePoints(formData); if (data && data.length !== 0) await updateEstimatePoints(formData);
else await createEstimatePoints(formData); else await createEstimatePoints(formData);
@ -195,7 +209,7 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
<div className="space-y-3"> <div className="space-y-3">
<div className="flex flex-col gap-3"> <div className="flex flex-col gap-3">
<h4 className="text-lg font-medium leading-6"> <h4 className="text-lg font-medium leading-6">
{data ? "Update" : "Create"} Estimate Points {data && data.length > 0 ? "Update" : "Create"} Estimate Points
</h4> </h4>
<div className="grid grid-cols-3 gap-3"> <div className="grid grid-cols-3 gap-3">
<div className="flex items-center"> <div className="flex items-center">
@ -206,16 +220,9 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
id="name" id="name"
name="value1" name="value1"
type="name" type="name"
placeholder="Value" placeholder="Point 1"
autoComplete="off" autoComplete="off"
register={register} register={register}
validations={{
required: "value is required",
maxLength: {
value: 10,
message: "Name should be less than 10 characters",
},
}}
/> />
</span> </span>
</span> </span>
@ -228,16 +235,9 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
id="name" id="name"
name="value2" name="value2"
type="name" type="name"
placeholder="Value" placeholder="Point 2"
autoComplete="off" autoComplete="off"
register={register} register={register}
validations={{
required: "value is required",
maxLength: {
value: 10,
message: "Name should be less than 10 characters",
},
}}
/> />
</span> </span>
</span> </span>
@ -250,16 +250,9 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
id="name" id="name"
name="value3" name="value3"
type="name" type="name"
placeholder="Value" placeholder="Point 3"
autoComplete="off" autoComplete="off"
register={register} register={register}
validations={{
required: "value is required",
maxLength: {
value: 10,
message: "Name should be less than 10 characters",
},
}}
/> />
</span> </span>
</span> </span>
@ -272,16 +265,9 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
id="name" id="name"
name="value4" name="value4"
type="name" type="name"
placeholder="Value" placeholder="Point 4"
autoComplete="off" autoComplete="off"
register={register} register={register}
validations={{
required: "value is required",
maxLength: {
value: 10,
message: "Name should be less than 10 characters",
},
}}
/> />
</span> </span>
</span> </span>
@ -294,16 +280,9 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
id="name" id="name"
name="value5" name="value5"
type="name" type="name"
placeholder="Value" placeholder="Point 5"
autoComplete="off" autoComplete="off"
register={register} register={register}
validations={{
required: "value is required",
maxLength: {
value: 10,
message: "Name should be less than 10 characters",
},
}}
/> />
</span> </span>
</span> </span>
@ -316,16 +295,9 @@ export const EstimatePointsModal: React.FC<Props> = ({ isOpen, data, estimate, o
id="name" id="name"
name="value6" name="value6"
type="name" type="name"
placeholder="Value" placeholder="Point 6"
autoComplete="off" autoComplete="off"
register={register} register={register}
validations={{
required: "value is required",
maxLength: {
value: 10,
message: "Name should be less than 10 characters",
},
}}
/> />
</span> </span>
</span> </span>

View File

@ -21,11 +21,12 @@ import {
SquaresPlusIcon, SquaresPlusIcon,
ListBulletIcon, ListBulletIcon,
} from "@heroicons/react/24/outline"; } from "@heroicons/react/24/outline";
// helpers
import { orderArrayBy } from "helpers/array.helper";
// types // types
import { IEstimate, IProject } from "types"; import { IEstimate } from "types";
// fetch-keys // fetch-keys
import { ESTIMATE_POINTS_LIST } from "constants/fetch-keys"; import { ESTIMATE_POINTS_LIST } from "constants/fetch-keys";
import { orderArrayBy } from "helpers/array.helper";
type Props = { type Props = {
estimate: IEstimate; estimate: IEstimate;
@ -41,7 +42,6 @@ export const SingleEstimate: React.FC<Props> = ({
const [isEstimatePointsModalOpen, setIsEstimatePointsModalOpen] = useState(false); const [isEstimatePointsModalOpen, setIsEstimatePointsModalOpen] = useState(false);
const [isDeleteEstimateModalOpen, setIsDeleteEstimateModalOpen] = useState(false); const [isDeleteEstimateModalOpen, setIsDeleteEstimateModalOpen] = useState(false);
const router = useRouter(); const router = useRouter();
const { workspaceSlug, projectId } = router.query; const { workspaceSlug, projectId } = router.query;