diff --git a/web/components/issues/issue-layouts/kanban/roots/draft-issue-root.tsx b/web/components/issues/issue-layouts/kanban/roots/draft-issue-root.tsx index 6ff958a728..4bd840b5ec 100644 --- a/web/components/issues/issue-layouts/kanban/roots/draft-issue-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/draft-issue-root.tsx @@ -1,11 +1,11 @@ import { observer } from "mobx-react-lite"; // components -import { ProjectIssueQuickActions } from "@/components/issues"; +import { DraftIssueQuickActions } from "@/components/issues"; import { EIssuesStoreType } from "@/constants/issue"; import { BaseKanBanRoot } from "../base-kanban-root"; export interface IKanBanLayout {} export const DraftKanBanLayout: React.FC = observer(() => ( - + )); diff --git a/web/components/issues/issue-layouts/list/roots/draft-issue-root.tsx b/web/components/issues/issue-layouts/list/roots/draft-issue-root.tsx index 4f303ffd46..9911b8ed4b 100644 --- a/web/components/issues/issue-layouts/list/roots/draft-issue-root.tsx +++ b/web/components/issues/issue-layouts/list/roots/draft-issue-root.tsx @@ -2,7 +2,7 @@ import { FC } from "react"; import { observer } from "mobx-react-lite"; import { useRouter } from "next/router"; // hooks -import { ProjectIssueQuickActions } from "@/components/issues"; +import { DraftIssueQuickActions } from "@/components/issues"; import { EIssuesStoreType } from "@/constants/issue"; // components // types @@ -15,5 +15,5 @@ export const DraftIssueListLayout: FC = observer(() => { if (!workspaceSlug || !projectId) return null; - return ; + return ; }); diff --git a/web/components/issues/issue-layouts/quick-action-dropdowns/draft-issue.tsx b/web/components/issues/issue-layouts/quick-action-dropdowns/draft-issue.tsx new file mode 100644 index 0000000000..b773e70314 --- /dev/null +++ b/web/components/issues/issue-layouts/quick-action-dropdowns/draft-issue.tsx @@ -0,0 +1,121 @@ +import { useState } from "react"; +import omit from "lodash/omit"; +import { observer } from "mobx-react"; +// hooks +import { Copy, Pencil, Trash2 } from "lucide-react"; +import { TIssue } from "@plane/types"; +import { CustomMenu } from "@plane/ui"; +import { CreateUpdateIssueModal, DeleteIssueModal } from "@/components/issues"; +import { EIssuesStoreType } from "@/constants/issue"; +import { EUserProjectRoles } from "@/constants/project"; +import { useEventTracker, useIssues, useUser } from "@/hooks/store"; +// ui +// components +// helpers +// types +import { IQuickActionProps } from "../list/list-view-types"; +// constant + +export const DraftIssueQuickActions: React.FC = observer((props) => { + const { issue, handleDelete, handleUpdate, customActionButton, portalElement, readOnly = false } = props; + // states + const [createUpdateIssueModal, setCreateUpdateIssueModal] = useState(false); + const [issueToEdit, setIssueToEdit] = useState(undefined); + const [deleteIssueModal, setDeleteIssueModal] = useState(false); + // store hooks + const { + membership: { currentProjectRole }, + } = useUser(); + const { setTrackElement } = useEventTracker(); + const { issuesFilter } = useIssues(EIssuesStoreType.PROJECT); + // derived values + const activeLayout = `${issuesFilter.issueFilters?.displayFilters?.layout} layout`; + // auth + const isEditingAllowed = !!currentProjectRole && currentProjectRole >= EUserProjectRoles.MEMBER && !readOnly; + const isDeletingAllowed = isEditingAllowed; + + const duplicateIssuePayload = omit( + { + ...issue, + name: `${issue.name} (copy)`, + is_draft: true, + }, + ["id"] + ); + + return ( + <> + setDeleteIssueModal(false)} + onSubmit={handleDelete} + /> + + { + setCreateUpdateIssueModal(false); + setIssueToEdit(undefined); + }} + data={issueToEdit ?? duplicateIssuePayload} + onSubmit={async (data) => { + if (issueToEdit && handleUpdate) await handleUpdate(data); + }} + storeType={EIssuesStoreType.PROJECT} + isDraft + /> + + + {isEditingAllowed && ( + { + setTrackElement(activeLayout); + setIssueToEdit(issue); + setCreateUpdateIssueModal(true); + }} + > +
+ + Edit +
+
+ )} + {isEditingAllowed && ( + { + setTrackElement(activeLayout); + setCreateUpdateIssueModal(true); + }} + > +
+ + Make a copy +
+
+ )} + {isDeletingAllowed && ( + { + setTrackElement(activeLayout); + setDeleteIssueModal(true); + }} + > +
+ + Delete +
+
+ )} +
+ + ); +}); diff --git a/web/components/issues/issue-layouts/quick-action-dropdowns/index.ts b/web/components/issues/issue-layouts/quick-action-dropdowns/index.ts index e384400173..212a43f91c 100644 --- a/web/components/issues/issue-layouts/quick-action-dropdowns/index.ts +++ b/web/components/issues/issue-layouts/quick-action-dropdowns/index.ts @@ -2,4 +2,5 @@ export * from "./cycle-issue"; export * from "./module-issue"; export * from "./project-issue"; export * from "./archived-issue"; +export * from "./draft-issue"; export * from "./all-issue";