forked from github/plane
fix: issues resolved in sub issues (#2238)
This commit is contained in:
guru_sainath
GitHub
parent
978909c021
commit
73afb8f4d8
@ -43,7 +43,7 @@ export const IssueMainContent: React.FC<Props> = ({
|
||||
uneditable = false,
|
||||
}) => {
|
||||
const router = useRouter();
|
||||
const { workspaceSlug, projectId, issueId, archivedIssueId } = router.query;
|
||||
const { workspaceSlug, projectId, issueId } = router.query;
|
||||
|
||||
const { setToastAlert } = useToast();
|
||||
|
||||
@ -206,7 +206,7 @@ export const IssueMainContent: React.FC<Props> = ({
|
||||
<IssueReaction workspaceSlug={workspaceSlug} issueId={issueId} projectId={projectId} />
|
||||
|
||||
<div className="mt-2 space-y-2">
|
||||
<SubIssuesRoot parentIssue={issueDetails} user={user} editable={uneditable} />
|
||||
<SubIssuesRoot parentIssue={issueDetails} user={user} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3 py-3">
|
||||
|
||||
@ -16,9 +16,9 @@ import { SubIssuesRootList } from "./issues-list";
|
||||
import { IssueProperty } from "./properties";
|
||||
// ui
|
||||
import { Tooltip, CustomMenu } from "components/ui";
|
||||
|
||||
// types
|
||||
import { ICurrentUserResponse, IIssue } from "types";
|
||||
import { ISubIssuesRootLoaders, ISubIssuesRootLoadersHandler } from "./root";
|
||||
|
||||
export interface ISubIssues {
|
||||
workspaceSlug: string;
|
||||
@ -29,8 +29,8 @@ export interface ISubIssues {
|
||||
user: ICurrentUserResponse | undefined;
|
||||
editable: boolean;
|
||||
removeIssueFromSubIssues: (parentIssueId: string, issue: IIssue) => void;
|
||||
issuesVisibility: string[];
|
||||
handleIssuesVisibility: (issueId: string) => void;
|
||||
issuesLoader: ISubIssuesRootLoaders;
|
||||
handleIssuesLoader: ({ key, issueId }: ISubIssuesRootLoadersHandler) => void;
|
||||
copyText: (text: string) => void;
|
||||
handleIssueCrudOperation: (
|
||||
key: "create" | "existing" | "edit" | "delete",
|
||||
@ -48,8 +48,8 @@ export const SubIssues: React.FC<ISubIssues> = ({
|
||||
user,
|
||||
editable,
|
||||
removeIssueFromSubIssues,
|
||||
issuesVisibility,
|
||||
handleIssuesVisibility,
|
||||
issuesLoader,
|
||||
handleIssuesLoader,
|
||||
copyText,
|
||||
handleIssueCrudOperation,
|
||||
}) => (
|
||||
@ -62,19 +62,21 @@ export const SubIssues: React.FC<ISubIssues> = ({
|
||||
<div className="flex-shrink-0 w-[22px] h-[22px]">
|
||||
{issue?.sub_issues_count > 0 && (
|
||||
<>
|
||||
{true ? (
|
||||
{issuesLoader.sub_issues.includes(issue?.id) ? (
|
||||
<div className="w-full h-full flex justify-center items-center rounded-sm bg-custom-background-80 transition-all cursor-not-allowed">
|
||||
<Loader width={14} strokeWidth={2} className="animate-spin" />
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
className="w-full h-full flex justify-center items-center rounded-sm hover:bg-custom-background-80 transition-all cursor-pointer"
|
||||
onClick={() => handleIssuesVisibility(issue?.id)}
|
||||
onClick={() => handleIssuesLoader({ key: "visibility", issueId: issue?.id })}
|
||||
>
|
||||
{issuesVisibility && issuesVisibility.includes(issue?.id) ? (
|
||||
{issuesLoader && issuesLoader.visibility.includes(issue?.id) ? (
|
||||
<ChevronDown width={14} strokeWidth={2} />
|
||||
) : (
|
||||
<ChevronRight width={14} strokeWidth={2} />
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<Loader width={14} strokeWidth={2} className="animate-spin" />
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
@ -92,7 +94,7 @@ export const SubIssues: React.FC<ISubIssues> = ({
|
||||
{issue.project_detail.identifier}-{issue?.sequence_id}
|
||||
</div>
|
||||
<Tooltip tooltipHeading="Title" tooltipContent={`${issue?.name}`}>
|
||||
<div className="line-clamp-1 text-xs text-custom-text-100">{issue?.name}</div>
|
||||
<div className="line-clamp-1 text-xs text-custom-text-100 pr-2">{issue?.name}</div>
|
||||
</Tooltip>
|
||||
</a>
|
||||
</Link>
|
||||
@ -132,7 +134,11 @@ export const SubIssues: React.FC<ISubIssues> = ({
|
||||
</CustomMenu.MenuItem>
|
||||
)}
|
||||
|
||||
<CustomMenu.MenuItem onClick={copyText}>
|
||||
<CustomMenu.MenuItem
|
||||
onClick={() =>
|
||||
copyText(`${workspaceSlug}/projects/${issue.project}/issues/${issue.id}`)
|
||||
}
|
||||
>
|
||||
<div className="flex items-center justify-start gap-2">
|
||||
<LinkIcon width={14} strokeWidth={2} />
|
||||
<span>Copy issue link</span>
|
||||
@ -142,17 +148,28 @@ export const SubIssues: React.FC<ISubIssues> = ({
|
||||
</div>
|
||||
|
||||
{editable && (
|
||||
<div
|
||||
className="flex-shrink-0 invisible group-hover:visible w-[22px] h-[22px] flex justify-center items-center rounded-sm hover:bg-custom-background-80 transition-all cursor-pointer overflow-hidden"
|
||||
onClick={() => removeIssueFromSubIssues(parentIssue?.id, issue)}
|
||||
>
|
||||
<X width={14} strokeWidth={2} />
|
||||
</div>
|
||||
<>
|
||||
{issuesLoader.delete.includes(issue?.id) ? (
|
||||
<div className="flex-shrink-0 w-[22px] h-[22px] rounded-sm bg-red-200/10 text-red-500 transition-all cursor-not-allowed overflow-hidden flex justify-center items-center">
|
||||
<Loader width={14} strokeWidth={2} className="animate-spin" />
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
className="flex-shrink-0 invisible group-hover:visible w-[22px] h-[22px] rounded-sm hover:bg-custom-background-80 transition-all cursor-pointer overflow-hidden flex justify-center items-center"
|
||||
onClick={() => {
|
||||
handleIssuesLoader({ key: "delete", issueId: issue?.id });
|
||||
removeIssueFromSubIssues(parentIssue?.id, issue);
|
||||
}}
|
||||
>
|
||||
<X width={14} strokeWidth={2} />
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{issuesVisibility.includes(issue?.id) && issue?.sub_issues_count > 0 && (
|
||||
{issuesLoader.visibility.includes(issue?.id) && issue?.sub_issues_count > 0 && (
|
||||
<SubIssuesRootList
|
||||
workspaceSlug={workspaceSlug}
|
||||
projectId={projectId}
|
||||
@ -161,8 +178,8 @@ export const SubIssues: React.FC<ISubIssues> = ({
|
||||
user={user}
|
||||
editable={editable}
|
||||
removeIssueFromSubIssues={removeIssueFromSubIssues}
|
||||
issuesVisibility={issuesVisibility}
|
||||
handleIssuesVisibility={handleIssuesVisibility}
|
||||
issuesLoader={issuesLoader}
|
||||
handleIssuesLoader={handleIssuesLoader}
|
||||
copyText={copyText}
|
||||
handleIssueCrudOperation={handleIssueCrudOperation}
|
||||
/>
|
||||
|
||||
@ -5,6 +5,7 @@ import useSWR from "swr";
|
||||
import { SubIssues } from "./issue";
|
||||
// types
|
||||
import { ICurrentUserResponse, IIssue } from "types";
|
||||
import { ISubIssuesRootLoaders, ISubIssuesRootLoadersHandler } from "./root";
|
||||
// services
|
||||
import issuesService from "services/issues.service";
|
||||
// fetch keys
|
||||
@ -18,8 +19,8 @@ export interface ISubIssuesRootList {
|
||||
user: ICurrentUserResponse | undefined;
|
||||
editable: boolean;
|
||||
removeIssueFromSubIssues: (parentIssueId: string, issue: IIssue) => void;
|
||||
issuesVisibility: string[];
|
||||
handleIssuesVisibility: (issueId: string) => void;
|
||||
issuesLoader: ISubIssuesRootLoaders;
|
||||
handleIssuesLoader: ({ key, issueId }: ISubIssuesRootLoadersHandler) => void;
|
||||
copyText: (text: string) => void;
|
||||
handleIssueCrudOperation: (
|
||||
key: "create" | "existing" | "edit" | "delete",
|
||||
@ -36,8 +37,8 @@ export const SubIssuesRootList: React.FC<ISubIssuesRootList> = ({
|
||||
user,
|
||||
editable,
|
||||
removeIssueFromSubIssues,
|
||||
issuesVisibility,
|
||||
handleIssuesVisibility,
|
||||
issuesLoader,
|
||||
handleIssuesLoader,
|
||||
copyText,
|
||||
handleIssueCrudOperation,
|
||||
}) => {
|
||||
@ -50,6 +51,16 @@ export const SubIssuesRootList: React.FC<ISubIssuesRootList> = ({
|
||||
: null
|
||||
);
|
||||
|
||||
React.useEffect(() => {
|
||||
if (isLoading) {
|
||||
handleIssuesLoader({ key: "sub_issues", issueId: parentIssue?.id });
|
||||
} else {
|
||||
if (issuesLoader.sub_issues.includes(parentIssue?.id)) {
|
||||
handleIssuesLoader({ key: "sub_issues", issueId: parentIssue?.id });
|
||||
}
|
||||
}
|
||||
}, [isLoading]);
|
||||
|
||||
return (
|
||||
<div className="relative">
|
||||
{issues &&
|
||||
@ -66,8 +77,8 @@ export const SubIssuesRootList: React.FC<ISubIssuesRootList> = ({
|
||||
user={user}
|
||||
editable={editable}
|
||||
removeIssueFromSubIssues={removeIssueFromSubIssues}
|
||||
issuesVisibility={issuesVisibility}
|
||||
handleIssuesVisibility={handleIssuesVisibility}
|
||||
issuesLoader={issuesLoader}
|
||||
handleIssuesLoader={handleIssuesLoader}
|
||||
copyText={copyText}
|
||||
handleIssueCrudOperation={handleIssueCrudOperation}
|
||||
/>
|
||||
|
||||
@ -14,7 +14,7 @@ export const ProgressBar = ({ total = 0, done = 0 }: IProgressBar) => {
|
||||
<div className="w-full">
|
||||
<div className="w-full rounded-full bg-custom-background-80 overflow-hidden shadow">
|
||||
<div
|
||||
className="bg-green-500 h-[6px] rounded-full"
|
||||
className="bg-green-500 h-[6px] rounded-full transition-all"
|
||||
style={{ width: `${calPercentage(done, total)}%` }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -86,12 +86,14 @@ export const IssueProperty: React.FC<IIssueProperty> = ({
|
||||
};
|
||||
|
||||
const handleAssigneeChange = (data: any) => {
|
||||
const newData = issue.assignees ?? [];
|
||||
let newData = issue.assignees ?? [];
|
||||
|
||||
if (newData.includes(data)) newData.splice(newData.indexOf(data), 1);
|
||||
else newData.push(data);
|
||||
if (newData && newData.length > 0) {
|
||||
if (newData.includes(data)) newData = newData.splice(newData.indexOf(data), 1);
|
||||
else newData = [...newData, data];
|
||||
} else newData = [...newData, data];
|
||||
|
||||
partialUpdateIssue({ assignees_list: data });
|
||||
partialUpdateIssue({ assignees_list: data, assignees: data });
|
||||
|
||||
trackEventServices.trackIssuePartialPropertyUpdateEvent(
|
||||
{
|
||||
|
||||
@ -14,6 +14,7 @@ import { ProgressBar } from "./progressbar";
|
||||
import { CustomMenu } from "components/ui";
|
||||
// hooks
|
||||
import { useProjectMyMembership } from "contexts/project-member.context";
|
||||
import useToast from "hooks/use-toast";
|
||||
// helpers
|
||||
import { copyTextToClipboard } from "helpers/string.helper";
|
||||
// types
|
||||
@ -25,18 +26,27 @@ import { SUB_ISSUES } from "constants/fetch-keys";
|
||||
|
||||
export interface ISubIssuesRoot {
|
||||
parentIssue: IIssue;
|
||||
|
||||
user: ICurrentUserResponse | undefined;
|
||||
editable: boolean;
|
||||
}
|
||||
|
||||
export const SubIssuesRoot: React.FC<ISubIssuesRoot> = ({ parentIssue, user, editable }) => {
|
||||
export interface ISubIssuesRootLoaders {
|
||||
visibility: string[];
|
||||
delete: string[];
|
||||
sub_issues: string[];
|
||||
}
|
||||
export interface ISubIssuesRootLoadersHandler {
|
||||
key: "visibility" | "delete" | "sub_issues";
|
||||
issueId: string;
|
||||
}
|
||||
|
||||
export const SubIssuesRoot: React.FC<ISubIssuesRoot> = ({ parentIssue, user }) => {
|
||||
const router = useRouter();
|
||||
const { workspaceSlug, projectId } = router.query as { workspaceSlug: string; projectId: string };
|
||||
|
||||
const { memberRole } = useProjectMyMembership();
|
||||
const { setToastAlert } = useToast();
|
||||
|
||||
const { data: issues } = useSWR(
|
||||
const { data: issues, isLoading } = useSWR(
|
||||
workspaceSlug && projectId && parentIssue && parentIssue?.id
|
||||
? SUB_ISSUES(parentIssue?.id)
|
||||
: null,
|
||||
@ -45,13 +55,18 @@ export const SubIssuesRoot: React.FC<ISubIssuesRoot> = ({ parentIssue, user, edi
|
||||
: null
|
||||
);
|
||||
|
||||
const [issuesVisibility, setIssuesVisibility] = React.useState<string[]>([parentIssue?.id]);
|
||||
const handleIssuesVisibility = (issueId: string) => {
|
||||
if (issuesVisibility.includes(issueId)) {
|
||||
setIssuesVisibility(issuesVisibility.filter((i: string) => i !== issueId));
|
||||
} else {
|
||||
setIssuesVisibility([...issuesVisibility, issueId]);
|
||||
}
|
||||
const [issuesLoader, setIssuesLoader] = React.useState<ISubIssuesRootLoaders>({
|
||||
visibility: [parentIssue?.id],
|
||||
delete: [],
|
||||
sub_issues: [],
|
||||
});
|
||||
const handleIssuesLoader = ({ key, issueId }: ISubIssuesRootLoadersHandler) => {
|
||||
setIssuesLoader((previousData: ISubIssuesRootLoaders) => ({
|
||||
...previousData,
|
||||
[key]: previousData[key].includes(issueId)
|
||||
? previousData[key].filter((i: string) => i !== issueId)
|
||||
: [...previousData[key], issueId],
|
||||
}));
|
||||
};
|
||||
|
||||
const [issueCrudOperation, setIssueCrudOperation] = React.useState<{
|
||||
@ -100,7 +115,6 @@ export const SubIssuesRoot: React.FC<ISubIssuesRoot> = ({ parentIssue, user, edi
|
||||
const payload = {
|
||||
sub_issue_ids: data.map((i) => i.id),
|
||||
};
|
||||
|
||||
await issuesService.addSubIssues(workspaceSlug, projectId, issueId, payload).finally(() => {
|
||||
if (issueId) mutate(SUB_ISSUES(issueId));
|
||||
});
|
||||
@ -110,8 +124,22 @@ export const SubIssuesRoot: React.FC<ISubIssuesRoot> = ({ parentIssue, user, edi
|
||||
if (!workspaceSlug || !parentIssue || !issue?.id) return;
|
||||
issuesService
|
||||
.patchIssue(workspaceSlug, projectId, issue.id, { parent: null }, user)
|
||||
.finally(() => {
|
||||
if (parentIssueId) mutate(SUB_ISSUES(parentIssueId));
|
||||
.then(async () => {
|
||||
if (parentIssueId) await mutate(SUB_ISSUES(parentIssueId));
|
||||
handleIssuesLoader({ key: "delete", issueId: issue?.id });
|
||||
setToastAlert({
|
||||
type: "success",
|
||||
title: `Issue removed!`,
|
||||
message: `Issue removed successfully.`,
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
handleIssuesLoader({ key: "delete", issueId: issue?.id });
|
||||
setToastAlert({
|
||||
type: "warning",
|
||||
title: `Error!`,
|
||||
message: `Error, Please try again later.`,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
@ -119,11 +147,11 @@ export const SubIssuesRoot: React.FC<ISubIssuesRoot> = ({ parentIssue, user, edi
|
||||
const originURL =
|
||||
typeof window !== "undefined" && window.location.origin ? window.location.origin : "";
|
||||
copyTextToClipboard(`${originURL}/${text}`).then(() => {
|
||||
// setToastAlert({
|
||||
// type: "success",
|
||||
// title: "Link Copied!",
|
||||
// message: "Issue link copied to clipboard.",
|
||||
// });
|
||||
setToastAlert({
|
||||
type: "success",
|
||||
title: "Link Copied!",
|
||||
message: "Issue link copied to clipboard.",
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
@ -135,148 +163,165 @@ export const SubIssuesRoot: React.FC<ISubIssuesRoot> = ({ parentIssue, user, edi
|
||||
|
||||
return (
|
||||
<div className="w-full h-full space-y-2">
|
||||
{parentIssue && parentIssue?.sub_issues_count > 0 ? (
|
||||
{!issues && isLoading ? (
|
||||
<div className="py-3 text-center text-sm text-custom-text-300 font-medium">Loading...</div>
|
||||
) : (
|
||||
<>
|
||||
{/* header */}
|
||||
<div className="relative flex items-center gap-4 text-xs">
|
||||
<div
|
||||
className="rounded border border-custom-border-100 shadow p-1.5 px-2 flex items-center gap-1 hover:bg-custom-background-80 transition-all cursor-pointer select-none"
|
||||
onClick={() => handleIssuesVisibility(parentIssue?.id)}
|
||||
>
|
||||
<div className="flex-shrink-0 w-[16px] h-[16px] flex justify-center items-center">
|
||||
{issuesVisibility.includes(parentIssue?.id) ? (
|
||||
<ChevronDown width={16} strokeWidth={2} />
|
||||
) : (
|
||||
<ChevronRight width={14} strokeWidth={2} />
|
||||
{issues && issues?.sub_issues && issues?.sub_issues?.length > 0 ? (
|
||||
<>
|
||||
{/* header */}
|
||||
<div className="relative flex items-center gap-4 text-xs">
|
||||
<div
|
||||
className="rounded border border-custom-border-100 shadow p-1.5 px-2 flex items-center gap-1 hover:bg-custom-background-80 transition-all cursor-pointer select-none"
|
||||
onClick={() =>
|
||||
handleIssuesLoader({ key: "visibility", issueId: parentIssue?.id })
|
||||
}
|
||||
>
|
||||
<div className="flex-shrink-0 w-[16px] h-[16px] flex justify-center items-center">
|
||||
{issuesLoader.visibility.includes(parentIssue?.id) ? (
|
||||
<ChevronDown width={16} strokeWidth={2} />
|
||||
) : (
|
||||
<ChevronRight width={14} strokeWidth={2} />
|
||||
)}
|
||||
</div>
|
||||
<div>Sub-issues</div>
|
||||
<div>({issues?.sub_issues?.length || 0})</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full max-w-[250px] select-none">
|
||||
<ProgressBar
|
||||
total={issues?.sub_issues?.length || 0}
|
||||
done={
|
||||
(issues?.state_distribution?.cancelled || 0) +
|
||||
(issues?.state_distribution?.completed || 0)
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{isEditable && issuesLoader.visibility.includes(parentIssue?.id) && (
|
||||
<div className="ml-auto flex-shrink-0 flex items-center gap-2 select-none">
|
||||
<div
|
||||
className="hover:bg-custom-background-80 transition-all cursor-pointer p-1.5 px-2 rounded border border-custom-border-100 shadow"
|
||||
onClick={() => handleIssueCrudOperation("create", parentIssue?.id)}
|
||||
>
|
||||
Add sub-issue
|
||||
</div>
|
||||
<div
|
||||
className="hover:bg-custom-background-80 transition-all cursor-pointer p-1.5 px-2 rounded border border-custom-border-100 shadow"
|
||||
onClick={() => handleIssueCrudOperation("existing", parentIssue?.id)}
|
||||
>
|
||||
Add an existing issue
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div>Sub-issues</div>
|
||||
<div>({parentIssue?.sub_issues_count})</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full max-w-[250px] select-none">
|
||||
<ProgressBar
|
||||
total={parentIssue?.sub_issues_count}
|
||||
done={
|
||||
(issues?.state_distribution?.cancelled || 0) +
|
||||
(issues?.state_distribution?.completed || 0)
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{isEditable && issuesVisibility.includes(parentIssue?.id) && (
|
||||
<div className="ml-auto flex-shrink-0 flex items-center gap-2 select-none">
|
||||
<div
|
||||
className="hover:bg-custom-background-80 transition-all cursor-pointer p-1.5 px-2 rounded border border-custom-border-100 shadow"
|
||||
onClick={() => handleIssueCrudOperation("create", parentIssue?.id)}
|
||||
>
|
||||
Add sub-issue
|
||||
{/* issues */}
|
||||
{issuesLoader.visibility.includes(parentIssue?.id) && (
|
||||
<div className="border border-b-0 border-custom-border-100">
|
||||
<SubIssuesRootList
|
||||
workspaceSlug={workspaceSlug}
|
||||
projectId={projectId}
|
||||
parentIssue={parentIssue}
|
||||
user={undefined}
|
||||
editable={isEditable}
|
||||
removeIssueFromSubIssues={removeIssueFromSubIssues}
|
||||
issuesLoader={issuesLoader}
|
||||
handleIssuesLoader={handleIssuesLoader}
|
||||
copyText={copyText}
|
||||
handleIssueCrudOperation={handleIssueCrudOperation}
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
className="hover:bg-custom-background-80 transition-all cursor-pointer p-1.5 px-2 rounded border border-custom-border-100 shadow"
|
||||
onClick={() => handleIssueCrudOperation("existing", parentIssue?.id)}
|
||||
>
|
||||
Add an existing issue
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* issues */}
|
||||
{issuesVisibility.includes(parentIssue?.id) && (
|
||||
<div className="border border-b-0 border-custom-border-100">
|
||||
<SubIssuesRootList
|
||||
workspaceSlug={workspaceSlug}
|
||||
projectId={projectId}
|
||||
parentIssue={parentIssue}
|
||||
user={undefined}
|
||||
editable={isEditable}
|
||||
removeIssueFromSubIssues={removeIssueFromSubIssues}
|
||||
issuesVisibility={issuesVisibility}
|
||||
handleIssuesVisibility={handleIssuesVisibility}
|
||||
copyText={copyText}
|
||||
handleIssueCrudOperation={handleIssueCrudOperation}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
isEditable && (
|
||||
<div className="text-xs py-2 text-custom-text-300 font-medium">
|
||||
<div className="py-3 text-center">No sub issues are available</div>
|
||||
<>
|
||||
<CustomMenu
|
||||
label={
|
||||
<>
|
||||
<Plus className="h-3 w-3" />
|
||||
Add sub-issue
|
||||
</>
|
||||
}
|
||||
buttonClassName="whitespace-nowrap"
|
||||
position="left"
|
||||
noBorder
|
||||
noChevron
|
||||
>
|
||||
<CustomMenu.MenuItem
|
||||
onClick={() => handleIssueCrudOperation("create", parentIssue?.id)}
|
||||
>
|
||||
Create new
|
||||
</CustomMenu.MenuItem>
|
||||
<CustomMenu.MenuItem
|
||||
onClick={() => handleIssueCrudOperation("existing", parentIssue?.id)}
|
||||
>
|
||||
Add an existing issue
|
||||
</CustomMenu.MenuItem>
|
||||
</CustomMenu>
|
||||
)}
|
||||
</>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
|
||||
{isEditable && issueCrudOperation?.create?.toggle && (
|
||||
<CreateUpdateIssueModal
|
||||
isOpen={issueCrudOperation?.create?.toggle}
|
||||
prePopulateData={{
|
||||
parent: issueCrudOperation?.create?.issueId,
|
||||
}}
|
||||
handleClose={() => handleIssueCrudOperation("create", null)}
|
||||
/>
|
||||
)}
|
||||
|
||||
{isEditable &&
|
||||
issueCrudOperation?.existing?.toggle &&
|
||||
issueCrudOperation?.existing?.issueId && (
|
||||
<ExistingIssuesListModal
|
||||
isOpen={issueCrudOperation?.existing?.toggle}
|
||||
handleClose={() => handleIssueCrudOperation("existing", null)}
|
||||
searchParams={{ sub_issue: true, issue_id: issueCrudOperation?.existing?.issueId }}
|
||||
handleOnSubmit={addAsSubIssueFromExistingIssues}
|
||||
workspaceLevelToggle
|
||||
/>
|
||||
)}
|
||||
|
||||
{isEditable && issueCrudOperation?.edit?.toggle && issueCrudOperation?.edit?.issueId && (
|
||||
<CreateUpdateIssueModal
|
||||
isOpen={issueCrudOperation?.edit?.toggle}
|
||||
handleClose={() => {
|
||||
mutateSubIssues(issueCrudOperation?.edit?.issueId);
|
||||
handleIssueCrudOperation("edit", null, null);
|
||||
}}
|
||||
data={issueCrudOperation?.edit?.issue}
|
||||
/>
|
||||
)}
|
||||
|
||||
{isEditable && issueCrudOperation?.delete?.toggle && issueCrudOperation?.delete?.issueId && (
|
||||
<DeleteIssueModal
|
||||
isOpen={issueCrudOperation?.delete?.toggle}
|
||||
handleClose={() => {
|
||||
mutateSubIssues(issueCrudOperation?.delete?.issueId);
|
||||
handleIssueCrudOperation("delete", null, null);
|
||||
}}
|
||||
data={issueCrudOperation?.delete?.issue}
|
||||
user={user}
|
||||
redirection={false}
|
||||
/>
|
||||
) : (
|
||||
isEditable && (
|
||||
<div className="text-xs py-2 text-custom-text-300 font-medium">
|
||||
<div className="py-3 text-center">No sub issues are available</div>
|
||||
<>
|
||||
<CustomMenu
|
||||
label={
|
||||
<>
|
||||
<Plus className="h-3 w-3" />
|
||||
Add sub-issue
|
||||
</>
|
||||
}
|
||||
buttonClassName="whitespace-nowrap"
|
||||
position="left"
|
||||
noBorder
|
||||
noChevron
|
||||
>
|
||||
<CustomMenu.MenuItem
|
||||
onClick={() => {
|
||||
mutateSubIssues(parentIssue?.id);
|
||||
handleIssueCrudOperation("create", parentIssue?.id);
|
||||
}}
|
||||
>
|
||||
Create new
|
||||
</CustomMenu.MenuItem>
|
||||
<CustomMenu.MenuItem
|
||||
onClick={() => {
|
||||
mutateSubIssues(parentIssue?.id);
|
||||
handleIssueCrudOperation("existing", parentIssue?.id);
|
||||
}}
|
||||
>
|
||||
Add an existing issue
|
||||
</CustomMenu.MenuItem>
|
||||
</CustomMenu>
|
||||
</>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
{isEditable && issueCrudOperation?.create?.toggle && (
|
||||
<CreateUpdateIssueModal
|
||||
isOpen={issueCrudOperation?.create?.toggle}
|
||||
prePopulateData={{
|
||||
parent: issueCrudOperation?.create?.issueId,
|
||||
}}
|
||||
handleClose={() => {
|
||||
mutateSubIssues(issueCrudOperation?.create?.issueId);
|
||||
handleIssueCrudOperation("create", null);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{isEditable &&
|
||||
issueCrudOperation?.existing?.toggle &&
|
||||
issueCrudOperation?.existing?.issueId && (
|
||||
<ExistingIssuesListModal
|
||||
isOpen={issueCrudOperation?.existing?.toggle}
|
||||
handleClose={() => handleIssueCrudOperation("existing", null)}
|
||||
searchParams={{ sub_issue: true, issue_id: issueCrudOperation?.existing?.issueId }}
|
||||
handleOnSubmit={addAsSubIssueFromExistingIssues}
|
||||
workspaceLevelToggle
|
||||
/>
|
||||
)}
|
||||
{isEditable && issueCrudOperation?.edit?.toggle && issueCrudOperation?.edit?.issueId && (
|
||||
<>
|
||||
<CreateUpdateIssueModal
|
||||
isOpen={issueCrudOperation?.edit?.toggle}
|
||||
handleClose={() => {
|
||||
mutateSubIssues(issueCrudOperation?.edit?.issueId);
|
||||
handleIssueCrudOperation("edit", null, null);
|
||||
}}
|
||||
data={issueCrudOperation?.edit?.issue}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{isEditable &&
|
||||
issueCrudOperation?.delete?.toggle &&
|
||||
issueCrudOperation?.delete?.issueId && (
|
||||
<DeleteIssueModal
|
||||
isOpen={issueCrudOperation?.delete?.toggle}
|
||||
handleClose={() => {
|
||||
mutateSubIssues(issueCrudOperation?.delete?.issueId);
|
||||
handleIssueCrudOperation("delete", null, null);
|
||||
}}
|
||||
data={issueCrudOperation?.delete?.issue}
|
||||
user={user}
|
||||
redirection={false}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user