thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

fix: delete mutations for issues, cycles and modules (#634)

Browse Source
This commit is contained in:
Aaryan Khandelwal 2023-03-31 02:17:35 +05:30 committed by GitHub
parent 29ea592c4a
commit 66d07e340b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 131 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
apps/app/components/core/list-view/single-issue.tsx
View File

@ -26,6 +26,7 @@ import {
LinkIcon,
PencilIcon,
TrashIcon,
XMarkIcon,
} from "@heroicons/react/24/outline";
// helpers
import { copyTextToClipboard, truncateText } from "helpers/string.helper";
@ -38,6 +39,7 @@ import {
MODULE_ISSUES_WITH_PARAMS,
PROJECT_ISSUES_LIST_WITH_PARAMS,
} from "constants/fetch-keys";
import { DIVIDER } from "@blueprintjs/core/lib/esm/common/classes";
type Props = {
type?: string;
@ -258,27 +260,30 @@ export const SingleListIssue: React.FC<Props> = ({
{type && !isNotAllowed && (
<CustomMenu width="auto" ellipsis>
<CustomMenu.MenuItem onClick={editIssue}>
<span className="flex items-center justify-start gap-2">
<div className="flex items-center justify-start gap-2">
<PencilIcon className="h-4 w-4" />
<span>Edit issue</span>
</span>
</div>
</CustomMenu.MenuItem>
{type !== "issue" && removeIssue && (
<CustomMenu.MenuItem onClick={removeIssue}>
<>Remove from {type}</>
<div className="flex items-center justify-start gap-2">
<XMarkIcon className="h-4 w-4" />
<span>Remove from {type}</span>
</div>
</CustomMenu.MenuItem>
)}
<CustomMenu.MenuItem onClick={() => handleDeleteIssue(issue)}>
<span className="flex items-center justify-start gap-2">
<div className="flex items-center justify-start gap-2">
<TrashIcon className="h-4 w-4" />
<span>Delete issue</span>
</span>
</div>
</CustomMenu.MenuItem>
<CustomMenu.MenuItem onClick={handleCopyText}>
<span className="flex items-center justify-start gap-2">
<div className="flex items-center justify-start gap-2">
<LinkIcon className="h-4 w-4" />
<span>Copy issue link</span>
</span>
</div>
</CustomMenu.MenuItem>
</CustomMenu>
)}

85
apps/app/components/cycles/delete-cycle-modal.tsx
View File

@ -14,14 +14,25 @@ import { DangerButton, SecondaryButton } from "components/ui";
// icons
import { ExclamationTriangleIcon } from "@heroicons/react/24/outline";
// types
import type { ICycle } from "types";
import type {
CompletedCyclesResponse,
CurrentAndUpcomingCyclesResponse,
DraftCyclesResponse,
ICycle,
} from "types";
type TConfirmCycleDeletionProps = {
isOpen: boolean;
setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;
data?: ICycle;
};
// fetch-keys
import { CYCLE_LIST } from "constants/fetch-keys";
import {
CYCLE_COMPLETE_LIST,
CYCLE_CURRENT_AND_UPCOMING_LIST,
CYCLE_DRAFT_LIST,
CYCLE_LIST,
} from "constants/fetch-keys";
import { getDateRangeStatus } from "helpers/date-time.helper";
export const DeleteCycleModal: React.FC<TConfirmCycleDeletionProps> = ({
isOpen,
@ -31,7 +42,7 @@ export const DeleteCycleModal: React.FC<TConfirmCycleDeletionProps> = ({
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
const router = useRouter();
const { workspaceSlug } = router.query;
const { workspaceSlug, projectId } = router.query;
const { setToastAlert } = useToast();
@ -41,16 +52,68 @@ export const DeleteCycleModal: React.FC<TConfirmCycleDeletionProps> = ({
};
const handleDeletion = async () => {
setIsDeleteLoading(true);
if (!data || !workspaceSlug) return;
setIsDeleteLoading(true);
await cycleService
.deleteCycle(workspaceSlug as string, data.project, data.id)
.then(() => {
mutate<ICycle[]>(
CYCLE_LIST(data.project),
(prevData) => prevData?.filter((cycle) => cycle.id !== data?.id),
switch (getDateRangeStatus(data.start_date, data.end_date)) {
case "completed":
mutate<CompletedCyclesResponse>(
CYCLE_COMPLETE_LIST(projectId as string),
(prevData) => {
if (!prevData) return;
return {
completed_cycles: prevData.completed_cycles?.filter(
(cycle) => cycle.id !== data?.id
),
};
},
false
);
break;
case "current":
mutate<CurrentAndUpcomingCyclesResponse>(
CYCLE_CURRENT_AND_UPCOMING_LIST(projectId as string),
(prevData) => {
if (!prevData) return;
return {
current_cycle: prevData.current_cycle?.filter((c) => c.id !== data?.id),
upcoming_cycle: prevData.upcoming_cycle,
};
},
false
);
break;
case "upcoming":
mutate<CurrentAndUpcomingCyclesResponse>(
CYCLE_CURRENT_AND_UPCOMING_LIST(projectId as string),
(prevData) => {
if (!prevData) return;
return {
current_cycle: prevData.current_cycle,
upcoming_cycle: prevData.upcoming_cycle?.filter((c) => c.id !== data?.id),
};
},
false
);
break;
default:
mutate<DraftCyclesResponse>(
CYCLE_DRAFT_LIST(projectId as string),
(prevData) => {
if (!prevData) return;
return {
draft_cycles: prevData.draft_cycles?.filter((cycle) => cycle.id !== data?.id),
};
},
false
);
}
handleClose();
setToastAlert({
@ -59,8 +122,7 @@ export const DeleteCycleModal: React.FC<TConfirmCycleDeletionProps> = ({
message: "Cycle deleted successfully",
});
})
.catch((error) => {
console.log(error);
.catch(() => {
setIsDeleteLoading(false);
});
};
@ -107,9 +169,8 @@ export const DeleteCycleModal: React.FC<TConfirmCycleDeletionProps> = ({
<div className="mt-2">
<p className="text-sm text-gray-500">
Are you sure you want to delete cycle-{" "}
<span className="font-bold">{data?.name}</span>
? All of the data related to the cycle will be permanently removed.
This action cannot be undone.
<span className="font-bold">{data?.name}</span>? All of the data related
to the cycle will be permanently removed. This action cannot be undone.
</p>
</div>
</div>

53
apps/app/components/issues/delete-issue-modal.tsx
View File

@ -1,4 +1,4 @@
import React, { useEffect, useRef, useState } from "react";
import React, { useEffect, useState } from "react";
import { useRouter } from "next/router";
@ -17,7 +17,15 @@ import { SecondaryButton, DangerButton } from "components/ui";
// types
import type { CycleIssueResponse, IIssue, ModuleIssueResponse } from "types";
// fetch-keys
import { CYCLE_ISSUES, PROJECT_ISSUES_LIST, MODULE_ISSUES, USER_ISSUE } from "constants/fetch-keys";
import {
CYCLE_ISSUES,
CYCLE_ISSUES_WITH_PARAMS,
MODULE_ISSUES,
MODULE_ISSUES_WITH_PARAMS,
PROJECT_ISSUES_LIST_WITH_PARAMS,
USER_ISSUE,
} from "constants/fetch-keys";
import useIssuesView from "hooks/use-issues-view";
type Props = {
isOpen: boolean;
@ -29,7 +37,9 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data })
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
const router = useRouter();
const { workspaceSlug, projectId: queryProjectId } = router.query;
const { workspaceSlug, projectId, cycleId, moduleId } = router.query;
const { params } = useIssuesView();
const { setToastAlert } = useToast();
@ -44,37 +54,14 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data })
const handleDeletion = async () => {
setIsDeleteLoading(true);
if (!data || !workspaceSlug) return;
if (!workspaceSlug || !projectId || !data) return;
const projectId = data.project;
await issueServices
.deleteIssue(workspaceSlug as string, projectId, data.id)
.deleteIssue(workspaceSlug as string, projectId as string, data.id)
.then(() => {
const cycleId = data?.cycle;
const moduleId = data?.module;
if (cycleId) {
mutate<CycleIssueResponse[]>(
CYCLE_ISSUES(cycleId),
(prevData) => prevData?.filter((i) => i.issue !== data.id),
false
);
}
if (moduleId) {
mutate<ModuleIssueResponse[]>(
MODULE_ISSUES(moduleId),
(prevData) => prevData?.filter((i) => i.issue !== data.id),
false
);
}
if (!queryProjectId)
mutate<IIssue[]>(
USER_ISSUE(workspaceSlug as string),
(prevData) => prevData?.filter((i) => i.id !== data.id),
false
);
if (cycleId) mutate(CYCLE_ISSUES_WITH_PARAMS(cycleId as string, params));
else if (moduleId) mutate(MODULE_ISSUES_WITH_PARAMS(moduleId as string, params));
else mutate(PROJECT_ISSUES_LIST_WITH_PARAMS(projectId as string, params));
handleClose();
setToastAlert({
@ -133,8 +120,8 @@ export const DeleteIssueModal: React.FC<Props> = ({ isOpen, handleClose, data })
Are you sure you want to delete issue{" "}
<span className="break-all font-semibold">
{data?.project_detail.identifier}-{data?.sequence_id}
</span>{""}
? All of the data related to the issue will be permanently removed. This
</span>
{""}? All of the data related to the issue will be permanently removed. This
action cannot be undone.
</p>
</span>

41
apps/app/components/modules/delete-module-modal.tsx
View File

@ -1,4 +1,4 @@
import React, { useEffect, useRef, useState } from "react";
import React, { useState } from "react";
import { useRouter } from "next/router";
@ -29,7 +29,7 @@ export const DeleteModuleModal: React.FC<Props> = ({ isOpen, setIsOpen, data })
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
const router = useRouter();
const { workspaceSlug } = router.query;
const { workspaceSlug, projectId, moduleId } = router.query;
const { setToastAlert } = useToast();
@ -41,22 +41,26 @@ export const DeleteModuleModal: React.FC<Props> = ({ isOpen, setIsOpen, data })
const handleDeletion = async () => {
setIsDeleteLoading(true);
if (!workspaceSlug || !data) return;
await modulesService
.deleteModule(workspaceSlug as string, data.project, data.id)
.then(() => {
mutate(MODULE_LIST(data.project));
router.push(`/${workspaceSlug}/projects/${data.project}/modules`);
handleClose();
if (!workspaceSlug || !projectId || !data) return;
setToastAlert({
title: "Success",
type: "success",
message: "Module deleted successfully",
});
mutate<IModule[]>(
MODULE_LIST(projectId as string),
(prevData) => prevData?.filter((m) => m.id !== data.id),
false
);
await modulesService
.deleteModule(workspaceSlug as string, projectId as string, data.id)
.then(() => {
if (moduleId) router.push(`/${workspaceSlug}/projects/${data.project}/modules`);
handleClose();
})
.catch((error) => {
console.log(error);
.catch(() => {
setToastAlert({
type: "error",
title: "Error!",
message: "Module could not be deleted. Please try again.",
});
setIsDeleteLoading(false);
});
};
@ -103,9 +107,8 @@ export const DeleteModuleModal: React.FC<Props> = ({ isOpen, setIsOpen, data })
<div className="mt-2">
<p className="text-sm text-gray-500">
Are you sure you want to delete module-{" "}
<span className="font-bold">{data?.name}</span>
? All of the data related to the module will be permanently removed.
This action cannot be undone.
<span className="font-bold">{data?.name}</span>? All of the data related
to the module will be permanently removed. This action cannot be undone.
</p>
</div>
</div>

2
apps/app/hooks/use-issues-view.tsx
View File

@ -36,7 +36,7 @@ const useIssuesView = () => {
setFilters,
resetFilterToDefault,
setNewFilterDefaultView,
setIssueView
setIssueView,
} = useContext(issueViewContext);
const router = useRouter();