import { useEffect } from "react"; // react-hook-form import { Controller, useForm } from "react-hook-form"; // components import { ModuleLeadSelect, ModuleMembersSelect, ModuleStatusSelect } from "components/modules"; // ui import { DateSelect, Input, PrimaryButton, SecondaryButton, TextArea } from "components/ui"; // types import { IModule } from "types"; type Props = { handleFormSubmit: (values: Partial) => Promise; handleClose: () => void; status: boolean; data?: IModule; }; const defaultValues: Partial = { name: "", description: "", status: "backlog", lead: null, members_list: [], }; export const ModuleForm: React.FC = ({ handleFormSubmit, handleClose, status, data }) => { const { register, formState: { errors, isSubmitting }, handleSubmit, watch, control, reset, } = useForm({ defaultValues, }); const handleCreateUpdateModule = async (formData: Partial) => { await handleFormSubmit(formData); reset({ ...defaultValues, }); }; useEffect(() => { reset({ ...defaultValues, ...data, }); }, [data, reset]); const startDate = watch("start_date"); const targetDate = watch("target_date"); const minDate = startDate ? new Date(startDate) : null; minDate?.setDate(minDate.getDate()); const maxDate = targetDate ? new Date(targetDate) : null; maxDate?.setDate(maxDate.getDate()); return (

{status ? "Update" : "Create"} Module