thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

feat: issue links (#288)

Browse Source 
* feat: links for issues

* fix: add issue link in serilaizer

* feat: links can be added to issues

---------

Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>
This commit is contained in:
pablohashescobar 2023-02-17 17:04:12 +05:30 committed by GitHub
parent a66b2fd73d
commit 7c1f357bed
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 331 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
apiserver/plane/api/serializers/issue.py
View File

@ -24,9 +24,15 @@ from plane.db.models import (
Cycle,
Module,
ModuleIssue,
IssueLink,
)
class IssueLinkCreateSerializer(serializers.Serializer):
url = serializers.CharField(required=True)
title = serializers.CharField(required=False)
class IssueFlatSerializer(BaseSerializer):
## Contain only flat fields
@ -86,6 +92,11 @@ class IssueCreateSerializer(BaseSerializer):
write_only=True,
required=False,
)
links_list = serializers.ListField(
child=IssueLinkCreateSerializer(),
write_only=True,
required=False,
)
class Meta:
model = Issue
@ -104,6 +115,7 @@ class IssueCreateSerializer(BaseSerializer):
assignees = validated_data.pop("assignees_list", None)
labels = validated_data.pop("labels_list", None)
blocks = validated_data.pop("blocks_list", None)
links = validated_data.pop("links_list", None)
project = self.context["project"]
issue = Issue.objects.create(**validated_data, project=project)
@ -172,6 +184,24 @@ class IssueCreateSerializer(BaseSerializer):
batch_size=10,
)
if links is not None:
IssueLink.objects.bulk_create(
[
IssueLink(
issue=issue,
project=project,
workspace=project.workspace,
created_by=issue.created_by,
updated_by=issue.updated_by,
title=link.get("title", None),
url=link.get("url", None),
)
for link in links
],
batch_size=10,
ignore_conflicts=True,
)
return issue
def update(self, instance, validated_data):
@ -179,6 +209,7 @@ class IssueCreateSerializer(BaseSerializer):
assignees = validated_data.pop("assignees_list", None)
labels = validated_data.pop("labels_list", None)
blocks = validated_data.pop("blocks_list", None)
links = validated_data.pop("links_list", None)
if blockers is not None:
IssueBlocker.objects.filter(block=instance).delete()
@ -248,6 +279,25 @@ class IssueCreateSerializer(BaseSerializer):
batch_size=10,
)
if links is not None:
IssueLink.objects.filter(issue=instance).delete()
IssueLink.objects.bulk_create(
[
IssueLink(
issue=instance,
project=instance.project,
workspace=instance.project.workspace,
created_by=instance.created_by,
updated_by=instance.updated_by,
title=link.get("title", None),
url=link.get("url", None),
)
for link in links
],
batch_size=10,
ignore_conflicts=True,
)
return super().update(instance, validated_data)
@ -410,6 +460,12 @@ class IssueModuleDetailSerializer(BaseSerializer):
]
class IssueLinkSerializer(BaseSerializer):
class Meta:
model = IssueLink
fields = "__all__"
class IssueSerializer(BaseSerializer):
project_detail = ProjectSerializer(read_only=True, source="project")
state_detail = StateSerializer(read_only=True, source="state")
@ -422,6 +478,7 @@ class IssueSerializer(BaseSerializer):
blocker_issues = BlockerIssueSerializer(read_only=True, many=True)
issue_cycle = IssueCycleDetailSerializer(read_only=True)
issue_module = IssueModuleDetailSerializer(read_only=True)
issue_link = IssueLinkSerializer(read_only=True, many=True)
sub_issues_count = serializers.IntegerField(read_only=True)
class Meta:

24
apiserver/plane/api/views/issue.py
View File

@ -39,6 +39,7 @@ from plane.db.models import (
IssueBlocker,
CycleIssue,
ModuleIssue,
IssueLink,
)
from plane.bgtasks.issue_activites_task import issue_activity
@ -75,7 +76,6 @@ class IssueViewSet(BaseViewSet):
self.get_queryset().filter(pk=self.kwargs.get("pk", None)).first()
)
if current_instance is not None:
issue_activity.delay(
{
"type": "issue.activity",
@ -92,7 +92,6 @@ class IssueViewSet(BaseViewSet):
return super().perform_update(serializer)
def get_queryset(self):
return (
super()
.get_queryset()
@ -136,6 +135,12 @@ class IssueViewSet(BaseViewSet):
).prefetch_related("module__members"),
),
)
.prefetch_related(
Prefetch(
"issue_link",
queryset=IssueLink.objects.select_related("issue"),
)
)
)
def grouper(self, issue, group_by):
@ -265,6 +270,12 @@ class UserWorkSpaceIssues(BaseAPIView):
queryset=ModuleIssue.objects.select_related("module", "issue"),
),
)
.prefetch_related(
Prefetch(
"issue_link",
queryset=IssueLink.objects.select_related("issue"),
)
)
)
serializer = IssueSerializer(issues, many=True)
return Response(serializer.data, status=status.HTTP_200_OK)
@ -277,7 +288,6 @@ class UserWorkSpaceIssues(BaseAPIView):
class WorkSpaceIssuesEndpoint(BaseAPIView):
permission_classes = [
WorkSpaceAdminPermission,
]
@ -298,7 +308,6 @@ class WorkSpaceIssuesEndpoint(BaseAPIView):
class IssueActivityEndpoint(BaseAPIView):
permission_classes = [
ProjectEntityPermission,
]
@ -333,7 +342,6 @@ class IssueActivityEndpoint(BaseAPIView):
class IssueCommentViewSet(BaseViewSet):
serializer_class = IssueCommentSerializer
model = IssueComment
permission_classes = [
@ -436,7 +444,6 @@ class IssuePropertyViewSet(BaseViewSet):
def create(self, request, slug, project_id):
try:
issue_property, created = IssueProperty.objects.get_or_create(
user=request.user,
project_id=project_id,
@ -463,7 +470,6 @@ class IssuePropertyViewSet(BaseViewSet):
class LabelViewSet(BaseViewSet):
serializer_class = LabelSerializer
model = Label
permission_classes = [
@ -490,14 +496,12 @@ class LabelViewSet(BaseViewSet):
class BulkDeleteIssuesEndpoint(BaseAPIView):
permission_classes = [
ProjectEntityPermission,
]
def delete(self, request, slug, project_id):
try:
issue_ids = request.data.get("issue_ids", [])
if not len(issue_ids):
@ -527,14 +531,12 @@ class BulkDeleteIssuesEndpoint(BaseAPIView):
class SubIssuesEndpoint(BaseAPIView):
permission_classes = [
ProjectEntityPermission,
]
def get(self, request, slug, project_id, issue_id):
try:
sub_issues = (
Issue.objects.filter(
parent_id=issue_id, workspace__slug=slug, project_id=project_id

1
apiserver/plane/db/models/__init__.py
View File

@ -23,6 +23,7 @@ from .issue import (
IssueAssignee,
Label,
IssueBlocker,
IssueLink,
)
from .asset import FileAsset

17
apiserver/plane/db/models/issue.py
View File

@ -161,6 +161,23 @@ class IssueAssignee(ProjectBaseModel):
return f"{self.issue.name} {self.assignee.email}"
class IssueLink(ProjectBaseModel):
title = models.CharField(max_length=255, null=True)
url = models.URLField()
issue = models.ForeignKey(
"db.Issue", on_delete=models.CASCADE, related_name="issue_link"
)
class Meta:
verbose_name = "Issue Link"
verbose_name_plural = "Issue Links"
db_table = "issue_links"
ordering = ("-created_at",)
def __str__(self):
return f"{self.issue.name} {self.url}"
class IssueActivity(ProjectBaseModel):
issue = models.ForeignKey(
Issue, on_delete=models.CASCADE, related_name="issue_activity"

1
apps/app/components/core/index.ts
View File

@ -6,4 +6,5 @@ export * from "./existing-issues-list-modal";
export * from "./image-upload-modal";
export * from "./issues-view-filter";
export * from "./issues-view";
export * from "./link-modal";
export * from "./not-authorized-view";

34
apps/app/components/modules/module-link-modal.tsx → apps/app/components/core/link-modal.tsx
View File

@ -8,19 +8,15 @@ import { mutate } from "swr";
import { useForm } from "react-hook-form";
// headless ui
import { Dialog, Transition } from "@headlessui/react";
// services
import modulesService from "services/modules.service";
// ui
import { Button, Input } from "components/ui";
// types
import type { IModule, ModuleLink } from "types";
// fetch-keys
import { MODULE_DETAILS } from "constants/fetch-keys";
import type { IIssueLink, ModuleLink } from "types";
type Props = {
isOpen: boolean;
module: IModule | undefined;
handleClose: () => void;
onFormSubmit: (formData: IIssueLink | ModuleLink) => void;
};
const defaultValues: ModuleLink = {
@ -28,42 +24,20 @@ const defaultValues: ModuleLink = {
url: "",
};
export const ModuleLinkModal: React.FC<Props> = ({ isOpen, module, handleClose }) => {
const router = useRouter();
const { workspaceSlug, projectId, moduleId } = router.query;
export const LinkModal: React.FC<Props> = ({ isOpen, handleClose, onFormSubmit }) => {
const {
register,
formState: { errors, isSubmitting },
handleSubmit,
reset,
setError,
} = useForm<ModuleLink>({
defaultValues,
});
const onSubmit = async (formData: ModuleLink) => {
if (!workspaceSlug || !projectId || !moduleId) return;
await onFormSubmit(formData);
const previousLinks = module?.link_module.map((l) => ({ title: l.title, url: l.url }));
const payload: Partial<IModule> = {
links_list: [...(previousLinks ?? []), formData],
};
await modulesService
.patchModule(workspaceSlug as string, projectId as string, moduleId as string, payload)
.then((res) => {
mutate(MODULE_DETAILS(moduleId as string));
onClose();
})
.catch((err) => {
Object.keys(err).map((key) => {
setError(key as keyof ModuleLink, {
message: err[key].join(", "),
});
});
});
};
const onClose = () => {

1
apps/app/components/issues/index.ts
View File

@ -4,6 +4,7 @@ export * from "./activity";
export * from "./delete-issue-modal";
export * from "./description-form";
export * from "./form";
export * from "./links-list";
export * from "./modal";
export * from "./my-issues-list-item";
export * from "./parent-issues-list-modal";

179
apps/app/components/issues/links-list.tsx Normal file
View File

@ -0,0 +1,179 @@
import { FC, useState } from "react";
import Link from "next/link";
import { useRouter } from "next/router";
import { mutate } from "swr";
// headless ui
import { Disclosure, Transition } from "@headlessui/react";
// services
import issuesService from "services/issues.service";
// hooks
import useToast from "hooks/use-toast";
// components
import { LinkModal } from "components/core";
// ui
import { CustomMenu } from "components/ui";
// icons
import { ChevronRightIcon, LinkIcon, PlusIcon } from "@heroicons/react/24/outline";
// helpers
import { copyTextToClipboard } from "helpers/string.helper";
import { timeAgo } from "helpers/date-time.helper";
// types
import { IIssue, IIssueLink, UserAuth } from "types";
// fetch-keys
import { ISSUE_DETAILS } from "constants/fetch-keys";
type Props = {
parentIssue: IIssue;
userAuth: UserAuth;
};
export const LinksList: FC<Props> = ({ parentIssue, userAuth }) => {
const [linkModal, setLinkModal] = useState(false);
const router = useRouter();
const { workspaceSlug, projectId } = router.query;
const { setToastAlert } = useToast();
const handleCreateLink = async (formData: IIssueLink) => {
if (!workspaceSlug || !projectId || !parentIssue) return;
const previousLinks = parentIssue?.issue_link.map((l) => ({ title: l.title, url: l.url }));
const payload: Partial<IIssue> = {
links_list: [...(previousLinks ?? []), formData],
};
await issuesService
.patchIssue(workspaceSlug as string, projectId as string, parentIssue.id, payload)
.then((res) => {
mutate(ISSUE_DETAILS(parentIssue.id as string));
})
.catch((err) => {
console.log(err);
});
};
const handleDeleteLink = async (linkId: string) => {
if (!workspaceSlug || !projectId || !parentIssue) return;
const updatedLinks = parentIssue.issue_link.filter((l) => l.id !== linkId);
mutate<IIssue>(
ISSUE_DETAILS(parentIssue.id as string),
(prevData) => ({ ...(prevData as IIssue), issue_link: updatedLinks }),
false
);
await issuesService
.patchIssue(workspaceSlug as string, projectId as string, parentIssue.id, {
links_list: updatedLinks,
})
.then((res) => {
mutate(ISSUE_DETAILS(parentIssue.id as string));
})
.catch((err) => {
console.log(err);
});
};
const isNotAllowed = userAuth.isGuest || userAuth.isViewer;
return (
<>
<LinkModal
isOpen={linkModal}
handleClose={() => setLinkModal(false)}
onFormSubmit={handleCreateLink}
/>
{parentIssue.issue_link && parentIssue.issue_link.length > 0 ? (
<Disclosure defaultOpen={true}>
{({ open }) => (
<>
<div className="flex items-center justify-between">
<Disclosure.Button className="flex items-center gap-1 rounded px-2 py-1 text-xs font-medium hover:bg-gray-100">
<ChevronRightIcon className={`h-3 w-3 ${open ? "rotate-90" : ""}`} />
Links <span className="ml-1 text-gray-600">{parentIssue.issue_link.length}</span>
</Disclosure.Button>
{open && !isNotAllowed ? (
<div className="flex items-center">
<button
type="button"
className="flex items-center gap-1 rounded px-2 py-1 text-xs font-medium hover:bg-gray-100"
onClick={() => setLinkModal(true)}
>
<PlusIcon className="h-3 w-3" />
Create new
</button>
</div>
) : null}
</div>
<Transition
enter="transition duration-100 ease-out"
enterFrom="transform scale-95 opacity-0"
enterTo="transform scale-100 opacity-100"
leave="transition duration-75 ease-out"
leaveFrom="transform scale-100 opacity-100"
leaveTo="transform scale-95 opacity-0"
>
<Disclosure.Panel className="mt-3 flex flex-col gap-y-1">
{parentIssue.issue_link.map((link) => (
<div
key={link.id}
className="group flex items-center justify-between gap-2 rounded p-2 hover:bg-gray-100"
>
<Link href={link.url}>
<a className="flex items-center gap-2 rounded text-xs">
<LinkIcon className="h-3 w-3" />
<span className="max-w-sm break-all font-medium">{link.title}</span>
<span className="text-gray-400 text-[0.65rem]">
{timeAgo(link.created_at)}
</span>
</a>
</Link>
{!isNotAllowed && (
<div className="opacity-0 group-hover:opacity-100">
<CustomMenu ellipsis>
<CustomMenu.MenuItem
onClick={() =>
copyTextToClipboard(link.url).then(() => {
setToastAlert({
type: "success",
title: "Link copied to clipboard",
});
})
}
>
Copy link
</CustomMenu.MenuItem>
<CustomMenu.MenuItem onClick={() => handleDeleteLink(link.id)}>
Remove link
</CustomMenu.MenuItem>
</CustomMenu>
</div>
)}
</div>
))}
</Disclosure.Panel>
</Transition>
</>
)}
</Disclosure>
) : (
!isNotAllowed && (
<button
type="button"
className="flex cursor-pointer items-center justify-between gap-1 px-2 py-1 text-xs rounded duration-300 hover:bg-gray-100"
onClick={() => setLinkModal(true)}
>
<PlusIcon className="h-3 w-3" />
Add new link
</button>
)
)}
</>
);
};

20
apps/app/components/issues/sub-issues-list.tsx
View File

@ -15,7 +15,7 @@ import { CreateUpdateIssueModal } from "components/issues";
// ui
import { CustomMenu } from "components/ui";
// icons
import { ChevronRightIcon, PlusIcon } from "@heroicons/react/24/outline";
import { ChevronRightIcon, PlusIcon, XMarkIcon } from "@heroicons/react/24/outline";
// helpers
import { orderArrayBy } from "helpers/array.helper";
// types
@ -23,12 +23,12 @@ import { IIssue, IssueResponse, UserAuth } from "types";
// fetch-keys
import { PROJECT_ISSUES_LIST, SUB_ISSUES } from "constants/fetch-keys";
type SubIssueListProps = {
type Props = {
parentIssue: IIssue;
userAuth: UserAuth;
};
export const SubIssuesList: FC<SubIssueListProps> = ({ parentIssue, userAuth }) => {
export const SubIssuesList: FC<Props> = ({ parentIssue, userAuth }) => {
// states
const [createIssueModal, setCreateIssueModal] = useState(false);
const [subIssuesListModal, setSubIssuesListModal] = useState(false);
@ -226,13 +226,13 @@ export const SubIssuesList: FC<SubIssueListProps> = ({ parentIssue, userAuth })
</a>
</Link>
{!isNotAllowed && (
<div className="opacity-0 group-hover:opacity-100">
<CustomMenu ellipsis>
<CustomMenu.MenuItem onClick={() => handleSubIssueRemove(issue.id)}>
Remove as sub-issue
</CustomMenu.MenuItem>
</CustomMenu>
</div>
<button
type="button"
className="opacity-0 group-hover:opacity-100 cursor-pointer"
onClick={() => handleSubIssueRemove(issue.id)}
>
<XMarkIcon className="h-4 w-4 text-gray-500 hover:text-gray-900" />
</button>
)}
</div>
))}

1
apps/app/components/modules/index.ts
View File

@ -3,6 +3,5 @@ export * from "./sidebar-select";
export * from "./delete-module-modal";
export * from "./form";
export * from "./modal";
export * from "./module-link-modal";
export * from "./sidebar";
export * from "./single-module-card";

41
apps/app/components/modules/sidebar.tsx
View File

@ -27,16 +27,12 @@ import modulesService from "services/modules.service";
// hooks
import useToast from "hooks/use-toast";
// components
import {
DeleteModuleModal,
ModuleLinkModal,
SidebarLeadSelect,
SidebarMembersSelect,
} from "components/modules";
import { LinkModal, SidebarProgressStats } from "components/core";
import { DeleteModuleModal, SidebarLeadSelect, SidebarMembersSelect } from "components/modules";
import ProgressChart from "components/core/sidebar/progress-chart";
import "react-circular-progressbar/dist/styles.css";
// components
import { SidebarProgressStats } from "components/core";
// ui
import { CustomSelect, Loader } from "components/ui";
// helpers
@ -44,10 +40,9 @@ import { renderShortNumericDateFormat, timeAgo } from "helpers/date-time.helper"
import { copyTextToClipboard } from "helpers/string.helper";
import { groupBy } from "helpers/array.helper";
// types
import { IIssue, IModule, ModuleIssueResponse } from "types";
import { IIssue, IModule, ModuleIssueResponse, ModuleLink } from "types";
// fetch-keys
import { MODULE_DETAILS } from "constants/fetch-keys";
import ProgressChart from "components/core/sidebar/progress-chart";
// constant
import { MODULE_STATUS } from "constants/module";
@ -113,6 +108,29 @@ export const ModuleDetailsSidebar: React.FC<Props> = ({ issues, module, isOpen,
});
};
const handleCreateLink = async (formData: ModuleLink) => {
if (!workspaceSlug || !projectId || !moduleId) return;
const previousLinks = module?.link_module.map((l) => ({ title: l.title, url: l.url }));
const payload: Partial<IModule> = {
links_list: [...(previousLinks ?? []), formData],
};
await modulesService
.patchModule(workspaceSlug as string, projectId as string, moduleId as string, payload)
.then((res) => {
mutate(MODULE_DETAILS(moduleId as string));
})
.catch((err) => {
setToastAlert({
type: "error",
title: "Error!",
message: "Couldn't create the link. Please try again.",
});
});
};
useEffect(() => {
if (module)
reset({
@ -123,12 +141,13 @@ export const ModuleDetailsSidebar: React.FC<Props> = ({ issues, module, isOpen,
const isStartValid = new Date(`${module?.start_date}`) <= new Date();
const isEndValid = new Date(`${module?.target_date}`) >= new Date(`${module?.start_date}`);
return (
<>
<ModuleLinkModal
<LinkModal
isOpen={moduleLinkModal}
handleClose={() => setModuleLinkModal(false)}
module={module}
onFormSubmit={handleCreateLink}
/>
<DeleteModuleModal
isOpen={moduleDeleteModal}

4
apps/app/pages/[workspaceSlug]/projects/[projectId]/issues/[issueId].tsx
View File

@ -20,6 +20,7 @@ import {
IssueDetailsSidebar,
IssueActivitySection,
AddComment,
LinksList,
} from "components/issues";
// ui
import { Loader, CustomMenu } from "components/ui";
@ -193,8 +194,9 @@ const IssueDetailsPage: NextPage<UserAuth> = (props) => {
handleFormSubmit={submitChanges}
userAuth={props}
/>
<div className="mt-2">
<div className="mt-2 space-y-2">
<SubIssuesList parentIssue={issueDetails} userAuth={props} />
<LinksList parentIssue={issueDetails} userAuth={props} />
</div>
</div>
<div className="space-y-5 bg-secondary pt-3">

14
apps/app/types/issues.d.ts vendored
View File

@ -60,6 +60,11 @@ export interface IIssueParent {
target_date: string | null;
}
export interface IIssueLink {
title: string;
url: string;
}
export interface IIssue {
assignees: any[] | null;
assignee_details: IUser[];
@ -83,8 +88,17 @@ export interface IIssue {
description_html: any;
id: string;
issue_cycle: IIssueCycle | null;
issue_link: {
created_at: Date;
created_by: string;
created_by_detail: IUserLite;
id: string;
title: string;
url: string;
}[];
issue_module: IIssueModule | null;
label_details: any[];
links_list: IIssueLink[];
module: string | null;
name: string;
parent: string | null;