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:
Anmol Singh Bhatia 2024-01-05 23:37:13 +05:30 committed by sriram veeraghanta
parent 266f14d550
commit efd3ebf067
65 changed files with 630 additions and 1565 deletions

View file

@ -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>
);
});