From fe6077194364c4ae1483d65b9dba6fc9b9a62424 Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Sun, 23 Jul 2023 22:54:17 +0530 Subject: [PATCH] fix: create cycle modal (#1631) * fix: cycle date select in the modal * chore: update remove assignee issue activity --- apps/app/components/cycles/form.tsx | 29 +++++-- apps/app/components/cycles/modal.tsx | 104 ++++++++---------------- apps/app/components/issues/activity.tsx | 31 +++---- apps/app/components/ui/date.tsx | 18 +++- apps/app/services/cycles.service.ts | 7 +- apps/app/types/cycles.d.ts | 6 ++ 6 files changed, 96 insertions(+), 99 deletions(-) diff --git a/apps/app/components/cycles/form.tsx b/apps/app/components/cycles/form.tsx index 071577b3f..4643a58bc 100644 --- a/apps/app/components/cycles/form.tsx +++ b/apps/app/components/cycles/form.tsx @@ -29,16 +29,13 @@ export const CycleForm: React.FC = ({ handleFormSubmit, handleClose, stat handleSubmit, control, reset, + watch, } = useForm({ defaultValues, }); const handleCreateUpdateCycle = async (formData: Partial) => { await handleFormSubmit(formData); - - reset({ - ...defaultValues, - }); }; useEffect(() => { @@ -48,6 +45,15 @@ export const CycleForm: React.FC = ({ handleFormSubmit, handleClose, stat }); }, [data, reset]); + const startDate = watch("start_date"); + const endDate = watch("end_date"); + + const minDate = startDate ? new Date(startDate) : new Date(); + minDate.setDate(minDate.getDate() + 1); + + const maxDate = endDate ? new Date(endDate) : null; + maxDate?.setDate(maxDate.getDate() - 1); + return (
@@ -91,7 +97,13 @@ export const CycleForm: React.FC = ({ handleFormSubmit, handleClose, stat control={control} name="start_date" render={({ field: { value, onChange } }) => ( - onChange(val)} /> + onChange(val)} + minDate={new Date()} + maxDate={maxDate ?? undefined} + /> )} />
@@ -100,7 +112,12 @@ export const CycleForm: React.FC = ({ handleFormSubmit, handleClose, stat control={control} name="end_date" render={({ field: { value, onChange } }) => ( - onChange(val)} /> + onChange(val)} + minDate={minDate} + /> )} /> diff --git a/apps/app/components/cycles/modal.tsx b/apps/app/components/cycles/modal.tsx index c83d1d851..9833bc375 100644 --- a/apps/app/components/cycles/modal.tsx +++ b/apps/app/components/cycles/modal.tsx @@ -13,9 +13,9 @@ import useToast from "hooks/use-toast"; // components import { CycleForm } from "components/cycles"; // helper -import { getDateRangeStatus, isDateGreaterThanToday } from "helpers/date-time.helper"; +import { getDateRangeStatus } from "helpers/date-time.helper"; // types -import type { ICurrentUserResponse, ICycle } from "types"; +import type { CycleDateCheckData, ICurrentUserResponse, ICycle } from "types"; // fetch keys import { COMPLETED_CYCLES_LIST, @@ -65,7 +65,6 @@ export const CreateUpdateCycleModal: React.FC = ({ } mutate(INCOMPLETE_CYCLES_LIST(projectId.toString())); mutate(CYCLES_LIST(projectId.toString())); - handleClose(); setToastAlert({ type: "success", @@ -121,8 +120,6 @@ export const CreateUpdateCycleModal: React.FC = ({ } } - handleClose(); - setToastAlert({ type: "success", title: "Success!", @@ -138,19 +135,16 @@ export const CreateUpdateCycleModal: React.FC = ({ }); }; - const dateChecker = async (payload: any) => { - try { - const res = await cycleService.cycleDateCheck( - workspaceSlug as string, - projectId as string, - payload - ); - console.log(res); - return res.status; - } catch (err) { - console.log(err); - return false; - } + const dateChecker = async (payload: CycleDateCheckData) => { + let status = false; + + await cycleService + .cycleDateCheck(workspaceSlug as string, projectId as string, payload) + .then((res) => { + status = res.status; + }); + + return status; }; const handleFormSubmit = async (formData: Partial) => { @@ -160,66 +154,34 @@ export const CreateUpdateCycleModal: React.FC = ({ ...formData, }; - if (payload.start_date && payload.end_date) { - if (!isDateGreaterThanToday(payload.end_date)) { - setToastAlert({ - type: "error", - title: "Error!", - message: "Unable to create cycle in past date. Please enter a valid date.", - }); - handleClose(); - return; - } + let isDateValid: boolean = true; - if (data?.start_date && data?.end_date) { - const isDateValidForExistingCycle = await dateChecker({ + if (payload.start_date && payload.end_date) { + if (data?.start_date && data?.end_date) + isDateValid = await dateChecker({ start_date: payload.start_date, end_date: payload.end_date, cycle_id: data.id, }); - - if (isDateValidForExistingCycle) { - await updateCycle(data.id, payload); - return; - } else { - setToastAlert({ - type: "error", - title: "Error!", - message: - "You have a cycle already on the given dates, if you want to create your draft cycle you can do that by removing dates", - }); - handleClose(); - return; - } - } - - const isDateValid = await dateChecker({ - start_date: payload.start_date, - end_date: payload.end_date, - }); - - if (isDateValid) { - if (data) { - await updateCycle(data.id, payload); - } else { - await createCycle(payload); - } - } else { - setToastAlert({ - type: "error", - title: "Error!", - message: - "You have a cycle already on the given dates, if you want to create your draft cycle you can do that by removing dates", + else + isDateValid = await dateChecker({ + start_date: payload.start_date, + end_date: payload.end_date, }); - handleClose(); - } - } else { - if (data) { - await updateCycle(data.id, payload); - } else { - await createCycle(payload); - } } + + if (isDateValid) { + if (data) await updateCycle(data.id, payload); + else await createCycle(payload); + + handleClose(); + } else + setToastAlert({ + type: "error", + title: "Error!", + message: + "You already have a cycle on the given dates, if you want to create a draft cycle, remove the dates.", + }); }; return ( diff --git a/apps/app/components/issues/activity.tsx b/apps/app/components/issues/activity.tsx index 958a707d8..81b253669 100644 --- a/apps/app/components/issues/activity.tsx +++ b/apps/app/components/issues/activity.tsx @@ -27,22 +27,23 @@ const activityDetails: { icon: React.ReactNode; }; } = { - assignee: { - message: (activity) => ( - <> - removed the assignee{" "} - {activity.old_value}. - - ), - icon: