mirror of
https://github.com/makeplane/plane
synced 2024-06-14 14:31:34 +00:00
feat: copy link option (#292)
* feat: copy issue link added in issue card * feat: copy cycle link added * feat: ellipsis added in module card * fix: origin path and handlecopytext added
This commit is contained in:
parent
a28be95002
commit
1665863bd9
@ -37,6 +37,8 @@ import {
|
||||
} from "types";
|
||||
// fetch-keys
|
||||
import { CYCLE_ISSUES, MODULE_ISSUES, PROJECT_ISSUES_LIST } from "constants/fetch-keys";
|
||||
import { copyTextToClipboard } from "helpers/string.helper";
|
||||
import useToast from "hooks/use-toast";
|
||||
|
||||
type Props = {
|
||||
type?: string;
|
||||
@ -69,7 +71,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
|
||||
}) => {
|
||||
const router = useRouter();
|
||||
const { workspaceSlug, projectId, cycleId, moduleId } = router.query;
|
||||
|
||||
const { setToastAlert } = useToast();
|
||||
const partialUpdateIssue = useCallback(
|
||||
(formData: Partial<IIssue>) => {
|
||||
if (!workspaceSlug || !projectId) return;
|
||||
@ -159,6 +161,23 @@ export const SingleBoardIssue: React.FC<Props> = ({
|
||||
};
|
||||
}
|
||||
|
||||
const handleCopyText = () => {
|
||||
const originURL =
|
||||
typeof window !== "undefined" && window.location.origin ? window.location.origin : "";
|
||||
copyTextToClipboard(`${originURL}/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`)
|
||||
.then(() => {
|
||||
setToastAlert({
|
||||
type: "success",
|
||||
title: "Issue link copied to clipboard",
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
setToastAlert({
|
||||
type: "error",
|
||||
title: "Some error occurred",
|
||||
});
|
||||
});
|
||||
};
|
||||
const isNotAllowed = userAuth.isGuest || userAuth.isViewer;
|
||||
|
||||
useEffect(() => {
|
||||
@ -187,6 +206,7 @@ export const SingleBoardIssue: React.FC<Props> = ({
|
||||
</button> */}
|
||||
{type && !isNotAllowed && (
|
||||
<CustomMenu width="auto" ellipsis>
|
||||
<CustomMenu.MenuItem onClick={handleCopyText}>Copy issue link</CustomMenu.MenuItem>
|
||||
<CustomMenu.MenuItem onClick={editIssue}>Edit</CustomMenu.MenuItem>
|
||||
{type !== "issue" && removeIssue && (
|
||||
<CustomMenu.MenuItem onClick={removeIssue}>
|
||||
|
@ -27,6 +27,8 @@ import {
|
||||
} from "types";
|
||||
// fetch-keys
|
||||
import { CYCLE_ISSUES, MODULE_ISSUES, PROJECT_ISSUES_LIST, STATE_LIST } from "constants/fetch-keys";
|
||||
import { copyTextToClipboard } from "helpers/string.helper";
|
||||
import useToast from "hooks/use-toast";
|
||||
|
||||
type Props = {
|
||||
type?: string;
|
||||
@ -49,7 +51,7 @@ export const SingleListIssue: React.FC<Props> = ({
|
||||
}) => {
|
||||
const router = useRouter();
|
||||
const { workspaceSlug, projectId, cycleId, moduleId } = router.query;
|
||||
|
||||
const { setToastAlert } = useToast();
|
||||
const partialUpdateIssue = useCallback(
|
||||
(formData: Partial<IIssue>) => {
|
||||
if (!workspaceSlug || !projectId) return;
|
||||
@ -123,6 +125,23 @@ export const SingleListIssue: React.FC<Props> = ({
|
||||
[workspaceSlug, projectId, cycleId, moduleId, issue]
|
||||
);
|
||||
|
||||
const handleCopyText = () => {
|
||||
const originURL =
|
||||
typeof window !== "undefined" && window.location.origin ? window.location.origin : "";
|
||||
copyTextToClipboard(`${originURL}/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`)
|
||||
.then(() => {
|
||||
setToastAlert({
|
||||
type: "success",
|
||||
title: "Issue link copied to clipboard",
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
setToastAlert({
|
||||
type: "error",
|
||||
title: "Some error occurred",
|
||||
});
|
||||
});
|
||||
};
|
||||
const isNotAllowed = userAuth.isGuest || userAuth.isViewer;
|
||||
|
||||
return (
|
||||
@ -181,6 +200,7 @@ export const SingleListIssue: React.FC<Props> = ({
|
||||
)}
|
||||
{type && !isNotAllowed && (
|
||||
<CustomMenu width="auto" ellipsis>
|
||||
<CustomMenu.MenuItem onClick={handleCopyText}>Copy issue link</CustomMenu.MenuItem>
|
||||
<CustomMenu.MenuItem onClick={editIssue}>Edit</CustomMenu.MenuItem>
|
||||
{type !== "issue" && removeIssue && (
|
||||
<CustomMenu.MenuItem onClick={removeIssue}>
|
||||
|
@ -6,7 +6,7 @@ import { useRouter } from "next/router";
|
||||
// components
|
||||
import { DeleteModuleModal } from "components/modules";
|
||||
// ui
|
||||
import { AssigneesList, Avatar } from "components/ui";
|
||||
import { AssigneesList, Avatar, CustomMenu } from "components/ui";
|
||||
// icons
|
||||
import { CalendarDaysIcon, TrashIcon } from "@heroicons/react/24/outline";
|
||||
// helpers
|
||||
@ -15,6 +15,8 @@ import { renderShortNumericDateFormat } from "helpers/date-time.helper";
|
||||
import { IModule } from "types";
|
||||
// common
|
||||
import { MODULE_STATUS } from "constants/module";
|
||||
import useToast from "hooks/use-toast";
|
||||
import { copyTextToClipboard } from "helpers/string.helper";
|
||||
|
||||
type Props = {
|
||||
module: IModule;
|
||||
@ -24,7 +26,8 @@ export const SingleModuleCard: React.FC<Props> = ({ module }) => {
|
||||
const [moduleDeleteModal, setModuleDeleteModal] = useState(false);
|
||||
|
||||
const router = useRouter();
|
||||
const { workspaceSlug } = router.query;
|
||||
const { workspaceSlug, projectId } = router.query;
|
||||
const { setToastAlert } = useToast();
|
||||
|
||||
const handleDeleteModule = () => {
|
||||
if (!module) return;
|
||||
@ -32,6 +35,24 @@ export const SingleModuleCard: React.FC<Props> = ({ module }) => {
|
||||
setModuleDeleteModal(true);
|
||||
};
|
||||
|
||||
const handleCopyText = () => {
|
||||
const originURL =
|
||||
typeof window !== "undefined" && window.location.origin ? window.location.origin : "";
|
||||
copyTextToClipboard(`${originURL}/${workspaceSlug}/projects/${projectId}/modules/${module.id}`)
|
||||
.then(() => {
|
||||
setToastAlert({
|
||||
type: "success",
|
||||
title: "Module link copied to clipboard",
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
setToastAlert({
|
||||
type: "error",
|
||||
title: "Some error occurred",
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<DeleteModuleModal
|
||||
@ -40,14 +61,13 @@ export const SingleModuleCard: React.FC<Props> = ({ module }) => {
|
||||
data={module}
|
||||
/>
|
||||
<div className="group/card h-full w-full relative select-none p-2">
|
||||
<div className="absolute top-4 right-4 z-10 bg-red-200 opacity-0 group-hover/card:opacity-100">
|
||||
<button
|
||||
type="button"
|
||||
className="grid h-7 w-7 place-items-center bg-white p-1 text-red-500 outline-none duration-300 hover:bg-red-50"
|
||||
onClick={() => handleDeleteModule()}
|
||||
>
|
||||
<TrashIcon className="h-4 w-4" />
|
||||
</button>
|
||||
<div className="absolute top-4 right-4 ">
|
||||
<CustomMenu width="auto" ellipsis>
|
||||
<CustomMenu.MenuItem onClick={handleCopyText}>Copy module link</CustomMenu.MenuItem>
|
||||
<CustomMenu.MenuItem onClick={handleDeleteModule}>
|
||||
Delete module permanently
|
||||
</CustomMenu.MenuItem>
|
||||
</CustomMenu>
|
||||
</div>
|
||||
<Link href={`/${workspaceSlug}/projects/${module.project}/modules/${module.id}`}>
|
||||
<a className="flex flex-col cursor-pointer rounded-md border bg-white p-3 ">
|
||||
|
@ -21,6 +21,8 @@ import { groupBy } from "helpers/array.helper";
|
||||
import { CycleIssueResponse, ICycle } from "types";
|
||||
// fetch-keys
|
||||
import { CYCLE_ISSUES } from "constants/fetch-keys";
|
||||
import { copyTextToClipboard } from "helpers/string.helper";
|
||||
import useToast from "hooks/use-toast";
|
||||
|
||||
type TSingleStatProps = {
|
||||
cycle: ICycle;
|
||||
@ -43,6 +45,7 @@ const SingleStat: React.FC<TSingleStatProps> = (props) => {
|
||||
|
||||
const router = useRouter();
|
||||
const { workspaceSlug, projectId } = router.query;
|
||||
const { setToastAlert } = useToast();
|
||||
|
||||
const { data: cycleIssues } = useSWR<CycleIssueResponse[]>(
|
||||
workspaceSlug && projectId && cycle.id ? CYCLE_ISSUES(cycle.id as string) : null,
|
||||
@ -63,6 +66,24 @@ const SingleStat: React.FC<TSingleStatProps> = (props) => {
|
||||
...groupBy(cycleIssues ?? [], "issue_detail.state_detail.group"),
|
||||
};
|
||||
|
||||
const handleCopyText = () => {
|
||||
const originURL =
|
||||
typeof window !== "undefined" && window.location.origin ? window.location.origin : "";
|
||||
copyTextToClipboard(`${originURL}/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`)
|
||||
.then(() => {
|
||||
setToastAlert({
|
||||
type: "success",
|
||||
title: "Cycle link copied to clipboard",
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
setToastAlert({
|
||||
type: "error",
|
||||
title: "Some error occurred",
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="rounded-md border bg-white p-3">
|
||||
@ -77,6 +98,7 @@ const SingleStat: React.FC<TSingleStatProps> = (props) => {
|
||||
</a>
|
||||
</Link>
|
||||
<CustomMenu width="auto" ellipsis>
|
||||
<CustomMenu.MenuItem onClick={handleCopyText}>Copy cycle link</CustomMenu.MenuItem>
|
||||
<CustomMenu.MenuItem onClick={handleEditCycle}>Edit cycle</CustomMenu.MenuItem>
|
||||
<CustomMenu.MenuItem onClick={handleDeleteCycle}>
|
||||
Delete cycle permanently
|
||||
|
Loading…
Reference in New Issue
Block a user