Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: copy link option #292

Merged
merged 4 commits into from
Feb 17, 2023
Merged

feat: copy link option #292

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
28a6776
feat: copy issue link added in issue card
anmolsinghbhatia Feb 16, 2023
35d52a1
feat: copy cycle link added
anmolsinghbhatia Feb 16, 2023
499263c
feat: ellipsis added in module card
anmolsinghbhatia Feb 17, 2023
4b0673c
fix: origin path and handlecopytext added
anmolsinghbhatia Feb 17, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 24 additions & 1 deletion apps/app/components/core/board-view/single-issue.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -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;
Expand Down Expand Up @@ -187,6 +189,27 @@ export const SingleBoardIssue: React.FC<Props> = ({
</button> */}
{type && !isNotAllowed && (
<CustomMenu width="auto" ellipsis>
<CustomMenu.MenuItem
onClick={() =>
copyTextToClipboard(
`https://app.plane.so/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Change the Path

)
.then(() => {
setToastAlert({
type: "success",
title: "Issue link copied to clipboard",
});
})
.catch(() => {
setToastAlert({
type: "error",
title: "Some error occurred",
});
})
}
>
Copy issue link
</CustomMenu.MenuItem>
<CustomMenu.MenuItem onClick={editIssue}>Edit</CustomMenu.MenuItem>
{type !== "issue" && removeIssue && (
<CustomMenu.MenuItem onClick={removeIssue}>
Expand Down
25 changes: 24 additions & 1 deletion apps/app/components/core/list-view/single-issue.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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;
Expand Down Expand Up @@ -181,6 +183,27 @@ export const SingleListIssue: React.FC<Props> = ({
)}
{type && !isNotAllowed && (
<CustomMenu width="auto" ellipsis>
<CustomMenu.MenuItem
onClick={() =>
copyTextToClipboard(
`https://app.plane.so/${workspaceSlug}/projects/${projectId}/issues/${issue.id}`
)
.then(() => {
setToastAlert({
type: "success",
title: "Issue link copied to clipboard",
});
})
.catch(() => {
setToastAlert({
type: "error",
title: "Some error occurred",
});
})
}
>
Copy issue link
</CustomMenu.MenuItem>
<CustomMenu.MenuItem onClick={editIssue}>Edit</CustomMenu.MenuItem>
{type !== "issue" && removeIssue && (
<CustomMenu.MenuItem onClick={removeIssue}>
Expand Down
42 changes: 32 additions & 10 deletions apps/app/components/modules/single-module-card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand All @@ -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;
Expand All @@ -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;
Expand All @@ -40,14 +43,33 @@ 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={() =>
copyTextToClipboard(
`https://app.plane.so/${workspaceSlug}/projects/${projectId}/modules/${module.id}`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

using an absolute path like this will create an issue. in stage, it will copy the production link.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Okay, I get it. I've fixed it. Now, instead of using an absolute path, I'm using the origin.

)
.then(() => {
setToastAlert({
type: "success",
title: "Module link copied to clipboard",
});
})
.catch(() => {
setToastAlert({
type: "error",
title: "Some error occurred",
});
})
}
>
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 ">
Expand Down
24 changes: 24 additions & 0 deletions apps/app/components/project/cycles/stats-view/single-stat.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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,
Expand Down Expand Up @@ -77,6 +80,27 @@ const SingleStat: React.FC<TSingleStatProps> = (props) => {
</a>
</Link>
<CustomMenu width="auto" ellipsis>
<CustomMenu.MenuItem
onClick={() =>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Create a separate function for this onclick function handleCopyText

copyTextToClipboard(
`https://app.plane.so/${workspaceSlug}/projects/${projectId}/cycles/${cycle.id}`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Change the Path

)
.then(() => {
setToastAlert({
type: "success",
title: "Cycle link copied to clipboard",
});
})
.catch(() => {
setToastAlert({
type: "error",
title: "Some error occurred",
});
})
}
>
Copy cycle link
</CustomMenu.MenuItem>
<CustomMenu.MenuItem onClick={handleEditCycle}>Edit cycle</CustomMenu.MenuItem>
<CustomMenu.MenuItem onClick={handleDeleteCycle}>
Delete cycle permanently
Expand Down