plane/web/components/issues/issue-layouts/quick-action-dropdowns/project-issue.tsx

115 lines
3.5 KiB
TypeScript
Raw Normal View History

import { useState } from "react";
import { useRouter } from "next/router";
import { CustomMenu } from "@plane/ui";
import { Copy, Link, Pencil, Trash2 } from "lucide-react";
// hooks
import useToast from "hooks/use-toast";
// components
import { CreateUpdateIssueModal, DeleteIssueModal } from "components/issues";
// helpers
import { copyUrlToClipboard } from "helpers/string.helper";
// types
import { IIssue } from "types";
chore: implemented new store and issue layouts for issues and updated new data structure for issues (#2843) * fix: Implemented new workflow in the issue store and updated the quick add workflow in list layout * fix: initial load and mutaion of issues in list layout * dev: implemented the new project issues store with grouped, subGrouped and unGrouped issue computed functions * dev: default display properties data made as a function * conflict: merge conflict resolved * dev: implemented quick add logic in kanban * chore: implemented quick add logic in calendar and spreadsheet layout * fix: spreadsheet layout quick add fix * dev: optimised the issues workflow and handled the issues order_by filter * dev: project issue CRUD operations in new issue store architecture * dev: issues filtering in calendar layout * fix: build error * dev/issue_filters_store * chore: updated filters computed structure * conflict: merge conflicts resolved in project issues * dev: implemented gantt chart for project issues using the new mobx store * dev: initialized cycle and module issue filters store * dev: issue store and list layout store updates * dev: quick add and update, delete issue in the list * refactor list root changes * dev: store new structure * refactor spreadsheet and gnatt project roots * fix errors for base gantt and spreadsheet roots * connect Calendar project view * minor house keeping * connect Kanban View to th enew store * generalise base calendar issue actions * dev: store project issues and issue filters * dev: store project issues and filters * dev: updated undefined with displayFilters in project issue store * Add Quick add to all the layouts * connect module views to store * dev: Rendering list issues in project issues * dev: removed console log * dev: module filters store * fix errors and connect modules list and quick add for list * dev: module issue store * dev: modle filter store issue fixed and updates cycle issue filters * minor house keeping changes * dev: cycle issues and cycle filters * connecty cycles to teh store * dev: project view issues and issue filtrs * connect project views * dev: updated applied filters in layouts * dev: replaced project id with view id in project views * dev: in cycle and module store made cycledId and moduleId as optional * fix minor issues and build errots * dev: project draft and archived issues store and filters --------- Co-authored-by: Anmol Singh Bhatia <anmolsinghbhatia@plane.so> Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com> Co-authored-by: rahulramesha <rahulramesham@gmail.com>
2023-11-23 09:17:04 +00:00
import { IQuickActionProps } from "../list/list-view-types";
import { EProjectStore } from "store/command-palette.store";
chore: implemented new store and issue layouts for issues and updated new data structure for issues (#2843) * fix: Implemented new workflow in the issue store and updated the quick add workflow in list layout * fix: initial load and mutaion of issues in list layout * dev: implemented the new project issues store with grouped, subGrouped and unGrouped issue computed functions * dev: default display properties data made as a function * conflict: merge conflict resolved * dev: implemented quick add logic in kanban * chore: implemented quick add logic in calendar and spreadsheet layout * fix: spreadsheet layout quick add fix * dev: optimised the issues workflow and handled the issues order_by filter * dev: project issue CRUD operations in new issue store architecture * dev: issues filtering in calendar layout * fix: build error * dev/issue_filters_store * chore: updated filters computed structure * conflict: merge conflicts resolved in project issues * dev: implemented gantt chart for project issues using the new mobx store * dev: initialized cycle and module issue filters store * dev: issue store and list layout store updates * dev: quick add and update, delete issue in the list * refactor list root changes * dev: store new structure * refactor spreadsheet and gnatt project roots * fix errors for base gantt and spreadsheet roots * connect Calendar project view * minor house keeping * connect Kanban View to th enew store * generalise base calendar issue actions * dev: store project issues and issue filters * dev: store project issues and filters * dev: updated undefined with displayFilters in project issue store * Add Quick add to all the layouts * connect module views to store * dev: Rendering list issues in project issues * dev: removed console log * dev: module filters store * fix errors and connect modules list and quick add for list * dev: module issue store * dev: modle filter store issue fixed and updates cycle issue filters * minor house keeping changes * dev: cycle issues and cycle filters * connecty cycles to teh store * dev: project view issues and issue filtrs * connect project views * dev: updated applied filters in layouts * dev: replaced project id with view id in project views * dev: in cycle and module store made cycledId and moduleId as optional * fix minor issues and build errots * dev: project draft and archived issues store and filters --------- Co-authored-by: Anmol Singh Bhatia <anmolsinghbhatia@plane.so> Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com> Co-authored-by: rahulramesha <rahulramesham@gmail.com>
2023-11-23 09:17:04 +00:00
export const ProjectIssueQuickActions: React.FC<IQuickActionProps> = (props) => {
const { issue, handleDelete, handleUpdate } = props;
const router = useRouter();
const { workspaceSlug } = router.query;
// states
const [createUpdateIssueModal, setCreateUpdateIssueModal] = useState(false);
const [issueToEdit, setIssueToEdit] = useState<IIssue | null>(null);
const [deleteIssueModal, setDeleteIssueModal] = useState(false);
const { setToastAlert } = useToast();
const handleCopyIssueLink = () => {
copyUrlToClipboard(`/${workspaceSlug}/projects/${issue.project}/issues/${issue.id}`).then(() =>
setToastAlert({
type: "success",
title: "Link copied",
message: "Issue link copied to clipboard",
})
);
};
return (
<>
<DeleteIssueModal
data={issue}
isOpen={deleteIssueModal}
handleClose={() => setDeleteIssueModal(false)}
onSubmit={handleDelete}
/>
<CreateUpdateIssueModal
isOpen={createUpdateIssueModal}
handleClose={() => {
setCreateUpdateIssueModal(false);
setIssueToEdit(null);
}}
// pre-populate date only if not editing
prePopulateData={!issueToEdit && createUpdateIssueModal ? { ...issue, name: `${issue.name} (copy)` } : {}}
data={issueToEdit}
onSubmit={async (data) => {
chore: implemented new store and issue layouts for issues and updated new data structure for issues (#2843) * fix: Implemented new workflow in the issue store and updated the quick add workflow in list layout * fix: initial load and mutaion of issues in list layout * dev: implemented the new project issues store with grouped, subGrouped and unGrouped issue computed functions * dev: default display properties data made as a function * conflict: merge conflict resolved * dev: implemented quick add logic in kanban * chore: implemented quick add logic in calendar and spreadsheet layout * fix: spreadsheet layout quick add fix * dev: optimised the issues workflow and handled the issues order_by filter * dev: project issue CRUD operations in new issue store architecture * dev: issues filtering in calendar layout * fix: build error * dev/issue_filters_store * chore: updated filters computed structure * conflict: merge conflicts resolved in project issues * dev: implemented gantt chart for project issues using the new mobx store * dev: initialized cycle and module issue filters store * dev: issue store and list layout store updates * dev: quick add and update, delete issue in the list * refactor list root changes * dev: store new structure * refactor spreadsheet and gnatt project roots * fix errors for base gantt and spreadsheet roots * connect Calendar project view * minor house keeping * connect Kanban View to th enew store * generalise base calendar issue actions * dev: store project issues and issue filters * dev: store project issues and filters * dev: updated undefined with displayFilters in project issue store * Add Quick add to all the layouts * connect module views to store * dev: Rendering list issues in project issues * dev: removed console log * dev: module filters store * fix errors and connect modules list and quick add for list * dev: module issue store * dev: modle filter store issue fixed and updates cycle issue filters * minor house keeping changes * dev: cycle issues and cycle filters * connecty cycles to teh store * dev: project view issues and issue filtrs * connect project views * dev: updated applied filters in layouts * dev: replaced project id with view id in project views * dev: in cycle and module store made cycledId and moduleId as optional * fix minor issues and build errots * dev: project draft and archived issues store and filters --------- Co-authored-by: Anmol Singh Bhatia <anmolsinghbhatia@plane.so> Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com> Co-authored-by: rahulramesha <rahulramesham@gmail.com>
2023-11-23 09:17:04 +00:00
if (issueToEdit && handleUpdate) handleUpdate({ ...issueToEdit, ...data });
}}
currentStore={EProjectStore.PROJECT}
/>
2023-10-31 06:44:06 +00:00
<CustomMenu placement="bottom-start" ellipsis>
<CustomMenu.MenuItem
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
handleCopyIssueLink();
}}
>
<div className="flex items-center gap-2">
<Link className="h-3 w-3" />
Copy link
</div>
</CustomMenu.MenuItem>
<CustomMenu.MenuItem
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
setIssueToEdit(issue);
setCreateUpdateIssueModal(true);
}}
>
<div className="flex items-center gap-2">
<Pencil className="h-3 w-3" />
Edit issue
</div>
</CustomMenu.MenuItem>
<CustomMenu.MenuItem
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
setCreateUpdateIssueModal(true);
}}
>
<div className="flex items-center gap-2">
<Copy className="h-3 w-3" />
Make a copy
</div>
</CustomMenu.MenuItem>
<CustomMenu.MenuItem
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
setDeleteIssueModal(true);
}}
>
<div className="flex items-center gap-2">
<Trash2 className="h-3 w-3" />
Delete issue
</div>
</CustomMenu.MenuItem>
</CustomMenu>
</>
);
};