fix: draft issue delete not working (#2249)

* fix: draft issue not deleting, project can't be changed in draft issue modal

* fix: removed mutation for view where draft issues are not shown

* fix: inline create issue for draft issue

* fix: clearing data from localstorage on discard click

web/components/core/views/inline-issue-create-wrapper.tsx

@@ -39,6 +39,7 @@ import {
   CYCLE_DETAILS,
   MODULE_DETAILS,
   PROJECT_ISSUES_LIST_WITH_PARAMS,
+  PROJECT_DRAFT_ISSUES_LIST_WITH_PARAMS,
 } from "constants/fetch-keys";
 
 // types
@@ -119,6 +120,8 @@ export const InlineCreateIssueFormWrapper: React.FC<Props> = (props) => {
   const router = useRouter();
   const { workspaceSlug, projectId, cycleId, moduleId, viewId } = router.query;
 
+  const isDraftIssues = router.pathname?.split("/")?.[4] === "draft-issues";
+
   const { user } = useUser();
 
   const { setToastAlert } = useToast();
@@ -184,8 +187,15 @@ export const InlineCreateIssueFormWrapper: React.FC<Props> = (props) => {
 
     reset({ ...defaultValues });
 
-    await issuesService
-      .createIssues(workspaceSlug.toString(), projectId.toString(), formData, user)
+    await (!isDraftIssues
+      ? issuesService.createIssues(workspaceSlug.toString(), projectId.toString(), formData, user)
+      : issuesService.createDraftIssue(
+          workspaceSlug.toString(),
+          projectId.toString(),
+          formData,
+          user
+        )
+    )
       .then(async (res) => {
         mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(projectId.toString(), params));
         if (formData.cycle && formData.cycle !== "")
@@ -207,6 +217,8 @@ export const InlineCreateIssueFormWrapper: React.FC<Props> = (props) => {
             params
           );
 
+        if (isDraftIssues)
+          mutate(PROJECT_DRAFT_ISSUES_LIST_WITH_PARAMS(projectId.toString() ?? "", params));
         if (displayFilters.layout === "calendar") mutate(calendarFetchKey);
         if (displayFilters.layout === "gantt_chart") mutate(ganttFetchKey);
         if (displayFilters.layout === "spreadsheet") mutate(spreadsheetFetchKey);

web/components/issues/delete-draft-issue-modal.tsx

@@ -4,6 +4,8 @@ import { useRouter } from "next/router";
 
 import { mutate } from "swr";
 
+import useUser from "hooks/use-user";
+
 // headless ui
 import { Dialog, Transition } from "@headlessui/react";
 // services
@@ -16,7 +18,7 @@ import { ExclamationTriangleIcon } from "@heroicons/react/24/outline";
 // ui
 import { SecondaryButton, DangerButton } from "components/ui";
 // types
-import type { IIssue, ICurrentUserResponse } from "types";
+import type { IIssue } from "types";
 // fetch-keys
 import { PROJECT_DRAFT_ISSUES_LIST_WITH_PARAMS } from "constants/fetch-keys";
 
@@ -24,12 +26,11 @@ type Props = {
   isOpen: boolean;
   handleClose: () => void;
   data: IIssue | null;
-  user?: ICurrentUserResponse;
   onSubmit?: () => Promise<void> | void;
 };
 
 export const DeleteDraftIssueModal: React.FC<Props> = (props) => {
-  const { isOpen, handleClose, data, user, onSubmit } = props;
+  const { isOpen, handleClose, data, onSubmit } = props;
 
   const [isDeleteLoading, setIsDeleteLoading] = useState(false);
 
@@ -40,6 +41,8 @@ export const DeleteDraftIssueModal: React.FC<Props> = (props) => {
 
   const { setToastAlert } = useToast();
 
+  const { user } = useUser();
+
   useEffect(() => {
     setIsDeleteLoading(false);
   }, [isOpen]);

web/components/issues/draft-issue-form.tsx

@@ -66,6 +66,7 @@ interface IssueFormProps {
   createMore: boolean;
   setCreateMore: React.Dispatch<React.SetStateAction<boolean>>;
   handleClose: () => void;
+  handleDiscard: () => void;
   status: boolean;
   user: ICurrentUserResponse | undefined;
   fieldsToShow: (
@@ -97,6 +98,7 @@ export const DraftIssueForm: FC<IssueFormProps> = (props) => {
     status,
     user,
     fieldsToShow,
+    handleDiscard,
   } = props;
 
   const [stateModal, setStateModal] = useState(false);
@@ -569,7 +571,7 @@ export const DraftIssueForm: FC<IssueFormProps> = (props) => {
             <ToggleSwitch value={createMore} onChange={() => {}} size="md" />
           </div>
           <div className="flex items-center gap-2">
-            <SecondaryButton onClick={onClose}>Discard</SecondaryButton>
+            <SecondaryButton onClick={handleDiscard}>Discard</SecondaryButton>
             <SecondaryButton
               loading={isSubmitting}
               onClick={handleSubmit((formData) =>

web/components/issues/draft-issue-modal.tsx

@@ -97,6 +97,11 @@ export const CreateUpdateDraftIssueModal: React.FC<IssuesModalProps> = (props) =
     setActiveProject(null);
   };
 
+  const onDiscard = () => {
+    clearDraftIssueLocalStorage();
+    onClose();
+  };
+
   useEffect(() => {
     setPreloadedData(prePopulateDataProps ?? {});
 
@@ -141,7 +146,7 @@ export const CreateUpdateDraftIssueModal: React.FC<IssuesModalProps> = (props) =
     if (prePopulateData && prePopulateData.project && !activeProject)
       return setActiveProject(prePopulateData.project);
 
-    if (prePopulateData && prePopulateData.project)
+    if (prePopulateData && prePopulateData.project && !activeProject)
       return setActiveProject(prePopulateData.project);
 
     // if data is not present, set active project to the project
@@ -180,16 +185,8 @@ export const CreateUpdateDraftIssueModal: React.FC<IssuesModalProps> = (props) =
     await issuesService
       .createDraftIssue(workspaceSlug as string, activeProject ?? "", payload, user)
       .then(async () => {
-        mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(activeProject ?? "", params));
         mutate(PROJECT_DRAFT_ISSUES_LIST_WITH_PARAMS(activeProject ?? "", params));
 
-        if (displayFilters.layout === "calendar") mutate(calendarFetchKey);
-        if (displayFilters.layout === "gantt_chart")
-          mutate(ganttFetchKey, {
-            start_target_date: true,
-            order_by: "sort_order",
-          });
-        if (displayFilters.layout === "spreadsheet") mutate(spreadsheetFetchKey);
         if (groupedIssues) mutateMyIssues();
 
         setToastAlert({
@@ -200,8 +197,6 @@ export const CreateUpdateDraftIssueModal: React.FC<IssuesModalProps> = (props) =
 
         if (payload.assignees_list?.some((assignee) => assignee === user?.id))
           mutate(USER_ISSUE(workspaceSlug as string));
-
-        if (payload.parent && payload.parent !== "") mutate(SUB_ISSUES(payload.parent));
       })
       .catch(() => {
         setToastAlert({
@@ -396,6 +391,7 @@ export const CreateUpdateDraftIssueModal: React.FC<IssuesModalProps> = (props) =
                     createMore={createMore}
                     setCreateMore={setCreateMore}
                     handleClose={onClose}
+                    handleDiscard={onDiscard}
                     projectId={activeProject ?? ""}
                     setActiveProject={setActiveProject}
                     status={data ? true : false}