forked from github/plane
220389e74e
* chore: autorun for the issue detail store * fix: labels mutation * chore: remove old peek overview code * chore: move add to cycle and module logic to store * fix: build errors * chore: add peekProjectId query param for the peek overview * chore: update profile layout * fix: multiple workspaces * style: Issue activity and link design improvements in Peek overview. * fix issue with labels not occupying full widht. * fix links overflow issue. * add tooltip in links to display entire link. * add functionality to copy links to clipboard. * chore: peek overview for all the layouts * fix: build errors --------- Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com> Co-authored-by: sriram veeraghanta <veeraghanta.sriram@gmail.com>
98 lines
3.0 KiB
TypeScript
98 lines
3.0 KiB
TypeScript
import { useEffect } from "react";
|
|
import useSWR from "swr";
|
|
// components
|
|
import { SubIssues } from "./issue";
|
|
// types
|
|
import { IUser, IIssue } from "types";
|
|
import { ISubIssuesRootLoaders, ISubIssuesRootLoadersHandler } from "./root";
|
|
// services
|
|
import { IssueService } from "services/issue";
|
|
// fetch keys
|
|
import { SUB_ISSUES } from "constants/fetch-keys";
|
|
|
|
export interface ISubIssuesRootList {
|
|
workspaceSlug: string;
|
|
projectId: string;
|
|
parentIssue: IIssue;
|
|
spacingLeft?: number;
|
|
user: IUser | undefined;
|
|
editable: boolean;
|
|
removeIssueFromSubIssues: (parentIssueId: string, issue: IIssue) => void;
|
|
issuesLoader: ISubIssuesRootLoaders;
|
|
handleIssuesLoader: ({ key, issueId }: ISubIssuesRootLoadersHandler) => void;
|
|
copyText: (text: string) => void;
|
|
handleIssueCrudOperation: (
|
|
key: "create" | "existing" | "edit" | "delete",
|
|
issueId: string,
|
|
issue?: IIssue | null
|
|
) => void;
|
|
handleUpdateIssue: (issue: IIssue, data: Partial<IIssue>) => void;
|
|
}
|
|
|
|
const issueService = new IssueService();
|
|
|
|
export const SubIssuesRootList: React.FC<ISubIssuesRootList> = ({
|
|
workspaceSlug,
|
|
projectId,
|
|
parentIssue,
|
|
spacingLeft = 10,
|
|
user,
|
|
editable,
|
|
removeIssueFromSubIssues,
|
|
issuesLoader,
|
|
handleIssuesLoader,
|
|
copyText,
|
|
handleIssueCrudOperation,
|
|
handleUpdateIssue,
|
|
}) => {
|
|
const { data: issues, isLoading } = useSWR(
|
|
workspaceSlug && projectId && parentIssue && parentIssue?.id ? SUB_ISSUES(parentIssue?.id) : null,
|
|
workspaceSlug && projectId && parentIssue && parentIssue?.id
|
|
? () => issueService.subIssues(workspaceSlug, projectId, parentIssue.id)
|
|
: null
|
|
);
|
|
|
|
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 });
|
|
}
|
|
}
|
|
}, [handleIssuesLoader, isLoading, issuesLoader.sub_issues, parentIssue?.id]);
|
|
|
|
return (
|
|
<>
|
|
<div className="relative">
|
|
{issues &&
|
|
issues.sub_issues &&
|
|
issues.sub_issues.length > 0 &&
|
|
issues.sub_issues.map((issue: IIssue) => (
|
|
<SubIssues
|
|
key={`${issue?.id}`}
|
|
workspaceSlug={workspaceSlug}
|
|
projectId={projectId}
|
|
parentIssue={parentIssue}
|
|
issue={issue}
|
|
spacingLeft={spacingLeft}
|
|
user={user}
|
|
editable={editable}
|
|
removeIssueFromSubIssues={removeIssueFromSubIssues}
|
|
issuesLoader={issuesLoader}
|
|
handleIssuesLoader={handleIssuesLoader}
|
|
copyText={copyText}
|
|
handleIssueCrudOperation={handleIssueCrudOperation}
|
|
handleUpdateIssue={handleUpdateIssue}
|
|
/>
|
|
))}
|
|
|
|
<div
|
|
className={`absolute top-0 bottom-0 ${spacingLeft > 10 ? `border-l border-custom-border-100` : ``}`}
|
|
style={{ left: `${spacingLeft - 12}px` }}
|
|
/>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|