chore: bug fixes and improvement (#3303)
* refactor: updated preloaded function for the list view quick add * fix: resolved bug in the assignee dropdown * chore: issue sidebar link improvement * fix: resolved subscription store bug * chore: updated preloaded function for the kanban layout quick add * chore: resolved issues in the list filters and component * chore: filter store updated * fix: issue serializer changed * chore: quick add preload function updated * fix: build error * fix: serializer changed * fix: minor request change * chore: resolved build issues and updated the prepopulated data in the quick add issue. * fix: build fix and code refactor * fix: spreadsheet layout quick add fix * fix: issue peek overview link section updated * fix: cycle status bug fix * fix: serializer changes * fix: assignee and labels listing * chore: issue modal parent_id default value updated * fix: cycle and module issue serializer change * fix: cycle list serializer changed * chore: prepopulated validation in both list and kanban for quick add and group header add issues * chore: group header validation added * fix: issue response payload change * dev: make cycle and module issue create response simillar * chore: custom control link component added * dev: make issue create and update response simillar to list and retrieve * fix: build error * chore: control link component improvement * chore: globalise issue peek overview * chore: control link component improvement * chore: made changes and optimised the issue peek overview root * build-error: resolved build erros for issueId dependancy from issue detail store * chore: peek overview link fix * dev: update state nullable rule --------- Co-authored-by: gurusainath <gurusainath007@gmail.com> Co-authored-by: NarayanBavisetti <narayan3119@gmail.com> Co-authored-by: pablohashescobar <nikhilschacko@gmail.com>
This commit is contained in:
parent
266f14d550
commit
efd3ebf067
65 changed files with 630 additions and 1565 deletions
|
|
@ -1,4 +1,5 @@
|
|||
import { FC, Fragment, ReactNode, useCallback, useEffect } from "react";
|
||||
import { FC, Fragment, useEffect, useState } from "react";
|
||||
// router
|
||||
import { useRouter } from "next/router";
|
||||
import { observer } from "mobx-react-lite";
|
||||
// hooks
|
||||
|
|
@ -13,33 +14,28 @@ import { TIssue, IIssueLink } from "@plane/types";
|
|||
// constants
|
||||
import { EUserProjectRoles } from "constants/project";
|
||||
import { EIssuesStoreType } from "constants/issue";
|
||||
import { EIssueActions } from "../issue-layouts/types";
|
||||
|
||||
interface IIssuePeekOverview {
|
||||
workspaceSlug: string;
|
||||
projectId: string;
|
||||
issueId: string;
|
||||
handleIssue: (issue: Partial<TIssue>, action: EIssueActions) => void;
|
||||
isArchived?: boolean;
|
||||
children?: ReactNode;
|
||||
}
|
||||
|
||||
export const IssuePeekOverview: FC<IIssuePeekOverview> = observer((props) => {
|
||||
const { workspaceSlug, projectId, issueId, handleIssue, children, isArchived = false } = props;
|
||||
const { isArchived = false } = props;
|
||||
// router
|
||||
const router = useRouter();
|
||||
const { peekIssueId } = router.query;
|
||||
// FIXME
|
||||
// store hooks
|
||||
// const {
|
||||
// archivedIssueDetail: {
|
||||
// getIssue: getArchivedIssue,
|
||||
// loader: archivedIssueLoader,
|
||||
// fetchPeekIssueDetails: fetchArchivedPeekIssueDetails,
|
||||
// },
|
||||
// } = useMobxStore();
|
||||
|
||||
// hooks
|
||||
const { currentProjectDetails } = useProject();
|
||||
const { setToastAlert } = useToast();
|
||||
const {
|
||||
membership: { currentProjectRole },
|
||||
} = useUser();
|
||||
const {
|
||||
issues: { removeIssue: removeArchivedIssue },
|
||||
} = useIssues(EIssuesStoreType.ARCHIVED);
|
||||
const {
|
||||
peekIssue,
|
||||
updateIssue,
|
||||
removeIssue,
|
||||
createComment,
|
||||
updateComment,
|
||||
removeComment,
|
||||
|
|
@ -53,37 +49,38 @@ export const IssuePeekOverview: FC<IIssuePeekOverview> = observer((props) => {
|
|||
updateLink,
|
||||
removeLink,
|
||||
issue: { getIssueById, fetchIssue },
|
||||
// loader,
|
||||
setIssueId,
|
||||
fetchActivities,
|
||||
} = useIssueDetail();
|
||||
const {
|
||||
issues: { removeIssue },
|
||||
} = useIssues(EIssuesStoreType.ARCHIVED);
|
||||
const {
|
||||
membership: { currentProjectRole },
|
||||
} = useUser();
|
||||
const { currentProjectDetails } = useProject();
|
||||
|
||||
const { setToastAlert } = useToast();
|
||||
|
||||
const fetchIssueDetail = useCallback(async () => {
|
||||
if (workspaceSlug && projectId && peekIssueId) {
|
||||
//if (isArchived) await fetchArchivedPeekIssueDetails(workspaceSlug, projectId, peekIssueId as string);
|
||||
//else
|
||||
await fetchIssue(workspaceSlug, projectId, peekIssueId.toString());
|
||||
}
|
||||
}, [fetchIssue, workspaceSlug, projectId, peekIssueId]);
|
||||
// state
|
||||
const [loader, setLoader] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
fetchIssueDetail();
|
||||
}, [workspaceSlug, projectId, peekIssueId, fetchIssueDetail]);
|
||||
if (peekIssue) {
|
||||
setLoader(true);
|
||||
fetchIssue(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId).finally(() => {
|
||||
setLoader(false);
|
||||
});
|
||||
}
|
||||
}, [peekIssue, fetchIssue]);
|
||||
|
||||
if (!peekIssue) return <></>;
|
||||
|
||||
const issue = getIssueById(peekIssue.issueId) || undefined;
|
||||
|
||||
const redirectToIssueDetail = () => {
|
||||
router.push({
|
||||
pathname: `/${peekIssue.workspaceSlug}/projects/${peekIssue.projectId}/${
|
||||
isArchived ? "archived-issues" : "issues"
|
||||
}/${peekIssue.issueId}`,
|
||||
});
|
||||
};
|
||||
const handleCopyText = (e: React.MouseEvent<HTMLButtonElement>) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
copyUrlToClipboard(
|
||||
`${workspaceSlug}/projects/${projectId}/${isArchived ? "archived-issues" : "issues"}/${peekIssueId}`
|
||||
`${peekIssue.workspaceSlug}/projects/${peekIssue.projectId}/${isArchived ? "archived-issues" : "issues"}/${
|
||||
peekIssue.issueId
|
||||
}`
|
||||
).then(() => {
|
||||
setToastAlert({
|
||||
type: "success",
|
||||
|
|
@ -93,101 +90,81 @@ export const IssuePeekOverview: FC<IIssuePeekOverview> = observer((props) => {
|
|||
});
|
||||
};
|
||||
|
||||
const redirectToIssueDetail = () => {
|
||||
router.push({
|
||||
pathname: `/${workspaceSlug}/projects/${projectId}/${isArchived ? "archived-issues" : "issues"}/${issueId}`,
|
||||
});
|
||||
};
|
||||
|
||||
// const issue = isArchived ? getArchivedIssue : getIssue;
|
||||
// const isLoading = isArchived ? archivedIssueLoader : loader;
|
||||
|
||||
const issue = getIssueById(issueId);
|
||||
const isLoading = false;
|
||||
|
||||
const issueUpdate = async (_data: Partial<TIssue>) => {
|
||||
if (handleIssue) {
|
||||
await handleIssue(_data, EIssueActions.UPDATE);
|
||||
fetchActivities(workspaceSlug, projectId, issueId);
|
||||
}
|
||||
if (!issue) return;
|
||||
await updateIssue(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, _data);
|
||||
fetchActivities(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId);
|
||||
};
|
||||
const issueDelete = async () => {
|
||||
if (!issue) return;
|
||||
if (isArchived) await removeArchivedIssue(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId);
|
||||
else await removeIssue(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId);
|
||||
};
|
||||
|
||||
const issueReactionCreate = (reaction: string) => createReaction(workspaceSlug, projectId, issueId, reaction);
|
||||
const issueReactionCreate = (reaction: string) =>
|
||||
createReaction(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, reaction);
|
||||
const issueReactionRemove = (reaction: string) =>
|
||||
removeReaction(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, reaction);
|
||||
|
||||
const issueReactionRemove = (reaction: string) => removeReaction(workspaceSlug, projectId, issueId, reaction);
|
||||
|
||||
const issueCommentCreate = (comment: any) => createComment(workspaceSlug, projectId, issueId, comment);
|
||||
|
||||
const issueCommentUpdate = (comment: any) => updateComment(workspaceSlug, projectId, issueId, comment?.id, comment);
|
||||
|
||||
const issueCommentRemove = (commentId: string) => removeComment(workspaceSlug, projectId, issueId, commentId);
|
||||
const issueCommentCreate = (comment: any) =>
|
||||
createComment(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, comment);
|
||||
const issueCommentUpdate = (comment: any) =>
|
||||
updateComment(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, comment?.id, comment);
|
||||
const issueCommentRemove = (commentId: string) =>
|
||||
removeComment(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, commentId);
|
||||
|
||||
const issueCommentReactionCreate = (commentId: string, reaction: string) =>
|
||||
createCommentReaction(workspaceSlug, projectId, commentId, reaction);
|
||||
|
||||
createCommentReaction(peekIssue.workspaceSlug, peekIssue.projectId, commentId, reaction);
|
||||
const issueCommentReactionRemove = (commentId: string, reaction: string) =>
|
||||
removeCommentReaction(workspaceSlug, projectId, commentId, reaction);
|
||||
removeCommentReaction(peekIssue.workspaceSlug, peekIssue.projectId, commentId, reaction);
|
||||
|
||||
const issueSubscriptionCreate = () => createSubscription(workspaceSlug, projectId, issueId);
|
||||
|
||||
const issueSubscriptionRemove = () => removeSubscription(workspaceSlug, projectId, issueId);
|
||||
|
||||
const issueLinkCreate = (formData: IIssueLink) => createLink(workspaceSlug, projectId, issueId, formData);
|
||||
const issueSubscriptionCreate = () =>
|
||||
createSubscription(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId);
|
||||
const issueSubscriptionRemove = () =>
|
||||
removeSubscription(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId);
|
||||
|
||||
const issueLinkCreate = (formData: IIssueLink) =>
|
||||
createLink(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, formData);
|
||||
const issueLinkUpdate = (formData: IIssueLink, linkId: string) =>
|
||||
updateLink(workspaceSlug, projectId, issueId, linkId, formData);
|
||||
|
||||
const issueLinkDelete = (linkId: string) => removeLink(workspaceSlug, projectId, issueId, linkId);
|
||||
|
||||
const handleDeleteIssue = async () => {
|
||||
if (!issue) return;
|
||||
|
||||
if (isArchived) await removeIssue(workspaceSlug, projectId, issue?.id);
|
||||
// FIXME else delete...
|
||||
const { query } = router;
|
||||
if (query.peekIssueId) {
|
||||
setIssueId(undefined);
|
||||
delete query.peekIssueId;
|
||||
delete query.peekProjectId;
|
||||
router.push({
|
||||
pathname: router.pathname,
|
||||
query: { ...query },
|
||||
});
|
||||
}
|
||||
};
|
||||
updateLink(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, linkId, formData);
|
||||
const issueLinkDelete = (linkId: string) =>
|
||||
removeLink(peekIssue.workspaceSlug, peekIssue.projectId, peekIssue.issueId, linkId);
|
||||
|
||||
const userRole = currentProjectRole ?? EUserProjectRoles.GUEST;
|
||||
const isLoading = !issue || loader ? true : false;
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<IssueView
|
||||
workspaceSlug={workspaceSlug}
|
||||
projectId={projectId}
|
||||
issueId={issueId}
|
||||
issue={issue}
|
||||
isLoading={isLoading}
|
||||
isArchived={isArchived}
|
||||
handleCopyText={handleCopyText}
|
||||
redirectToIssueDetail={redirectToIssueDetail}
|
||||
issueUpdate={issueUpdate}
|
||||
issueReactionCreate={issueReactionCreate}
|
||||
issueReactionRemove={issueReactionRemove}
|
||||
issueCommentCreate={issueCommentCreate}
|
||||
issueCommentUpdate={issueCommentUpdate}
|
||||
issueCommentRemove={issueCommentRemove}
|
||||
issueCommentReactionCreate={issueCommentReactionCreate}
|
||||
issueCommentReactionRemove={issueCommentReactionRemove}
|
||||
issueSubscriptionCreate={issueSubscriptionCreate}
|
||||
issueSubscriptionRemove={issueSubscriptionRemove}
|
||||
issueLinkCreate={issueLinkCreate}
|
||||
issueLinkUpdate={issueLinkUpdate}
|
||||
issueLinkDelete={issueLinkDelete}
|
||||
handleDeleteIssue={handleDeleteIssue}
|
||||
disableUserActions={[5, 10].includes(userRole)}
|
||||
showCommentAccessSpecifier={currentProjectDetails?.is_deployed}
|
||||
>
|
||||
{children}
|
||||
</IssueView>
|
||||
{isLoading ? (
|
||||
<></> // TODO: show the spinner
|
||||
) : (
|
||||
<IssueView
|
||||
workspaceSlug={peekIssue.workspaceSlug}
|
||||
projectId={peekIssue.projectId}
|
||||
issueId={peekIssue.issueId}
|
||||
issue={issue}
|
||||
isLoading={isLoading}
|
||||
isArchived={isArchived}
|
||||
handleCopyText={handleCopyText}
|
||||
redirectToIssueDetail={redirectToIssueDetail}
|
||||
issueUpdate={issueUpdate}
|
||||
issueReactionCreate={issueReactionCreate}
|
||||
issueReactionRemove={issueReactionRemove}
|
||||
issueCommentCreate={issueCommentCreate}
|
||||
issueCommentUpdate={issueCommentUpdate}
|
||||
issueCommentRemove={issueCommentRemove}
|
||||
issueCommentReactionCreate={issueCommentReactionCreate}
|
||||
issueCommentReactionRemove={issueCommentReactionRemove}
|
||||
issueSubscriptionCreate={issueSubscriptionCreate}
|
||||
issueSubscriptionRemove={issueSubscriptionRemove}
|
||||
issueLinkCreate={issueLinkCreate}
|
||||
issueLinkUpdate={issueLinkUpdate}
|
||||
issueLinkDelete={issueLinkDelete}
|
||||
handleDeleteIssue={issueDelete}
|
||||
disableUserActions={[5, 10].includes(userRole)}
|
||||
showCommentAccessSpecifier={currentProjectDetails?.is_deployed}
|
||||
/>
|
||||
)}
|
||||
</Fragment>
|
||||
);
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue