mirror/plane
1
0
Fork 0
mirror of https://github.com/makeplane/plane.git synced 2026-02-04 05:00:42 -06:00
Code Issues Packages Projects Releases Wiki Activity

[WIKI-551] refactor: work item activity logic #7417

Browse Source
This commit is contained in:
Aaryan Khandelwal
2025-07-15 20:49:20 +05:30
committed by GitHub
parent 2058f06b8a
commit df762afaef
3 changed files with 56 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
apps/web/ce/store/issue/issue-details/activity.store.ts
View File

@@ -43,7 +43,7 @@ export interface IIssueActivityStore extends IIssueActivityStoreActions {
// helper methods
getActivitiesByIssueId: (issueId: string) => string[] | undefined;
getActivityById: (activityId: string) => TIssueActivity | undefined;
getActivityCommentByIssueId: (issueId: string, sortOrder: E_SORT_ORDER) => TIssueActivityComment[] | undefined;
getActivityAndCommentsByIssueId: (issueId: string, sortOrder: E_SORT_ORDER) => TIssueActivityComment[] | undefined;
}
export class IssueActivityStore implements IIssueActivityStore {
@@ -84,7 +84,7 @@ export class IssueActivityStore implements IIssueActivityStore {
return this.activityMap[activityId] ?? undefined;
};
getActivityCommentByIssueId = computedFn((issueId: string, sortOrder: E_SORT_ORDER) => {
getActivityAndCommentsByIssueId = computedFn((issueId: string, sortOrder: E_SORT_ORDER) => {
if (!issueId) return undefined;
let activityComments: TIssueActivityComment[] = [];
@@ -92,10 +92,12 @@ export class IssueActivityStore implements IIssueActivityStore {
const currentStore =
this.serviceType === EIssueServiceType.EPICS ? this.store.issue.epicDetail : this.store.issue.issueDetail;
const activities = this.getActivitiesByIssueId(issueId) || [];
const comments = currentStore.comment.getCommentsByIssueId(issueId) || [];
const activities = this.getActivitiesByIssueId(issueId);
const comments = currentStore.comment.getCommentsByIssueId(issueId);
activities.forEach((activityId) => {
if (!activities || !comments) return undefined;
activities?.forEach((activityId) => {
const activity = this.getActivityById(activityId);
if (!activity) return;
activityComments.push({
@@ -105,7 +107,7 @@ export class IssueActivityStore implements IIssueActivityStore {
});
});
comments.forEach((commentId) => {
comments?.forEach((commentId) => {
const comment = currentStore.comment.getCommentById(commentId);
if (!comment) return;
activityComments.push({

30
apps/web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx
View File

@@ -1,16 +1,18 @@
import { FC } from "react";
import { observer } from "mobx-react";
// constants
// plane imports
import { E_SORT_ORDER, TActivityFilters, filterActivityOnSelectedFilters } from "@plane/constants";
// hooks
import { TCommentsOperations } from "@plane/types";
// components
import { CommentCard } from "@/components/comments/card/root";
// hooks
import { useIssueDetail } from "@/hooks/store";
// plane web components
import { IssueAdditionalPropertiesActivity } from "@/plane-web/components/issues";
import { IssueActivityWorklog } from "@/plane-web/components/issues/worklog/activity/root";
// components
// local imports
import { IssueActivityItem } from "./activity/activity-list";
import { IssueActivityLoader } from "./loader";
type TIssueActivityCommentRoot = {
workspaceSlug: string;
@@ -34,21 +36,23 @@ export const IssueActivityCommentRoot: FC<TIssueActivityCommentRoot> = observer(
disabled,
sortOrder,
} = props;
// hooks
// store hooks
const {
activity: { getActivityCommentByIssueId },
activity: { getActivityAndCommentsByIssueId },
comment: { getCommentById },
} = useIssueDetail();
// derived values
const activityAndComments = getActivityAndCommentsByIssueId(issueId, sortOrder);
const activityComments = getActivityCommentByIssueId(issueId, sortOrder);
if (!activityAndComments) return <IssueActivityLoader />;
if (!activityComments || (activityComments && activityComments.length <= 0)) return <></>;
if (activityAndComments.length <= 0) return null;
const filteredActivityComments = filterActivityOnSelectedFilters(activityComments, selectedFilters);
const filteredActivityAndComments = filterActivityOnSelectedFilters(activityAndComments, selectedFilters);
return (
<div>
{filteredActivityComments.map((activityComment, index) => {
{filteredActivityAndComments.map((activityComment, index) => {
const comment = getCommentById(activityComment.id);
return activityComment.activity_type === "COMMENT" ? (
<CommentCard
@@ -56,7 +60,7 @@ export const IssueActivityCommentRoot: FC<TIssueActivityCommentRoot> = observer(
workspaceSlug={workspaceSlug}
comment={comment}
activityOperations={activityOperations}
ends={index === 0 ? "top" : index === filteredActivityComments.length - 1 ? "bottom" : undefined}
ends={index === 0 ? "top" : index === filteredActivityAndComments.length - 1 ? "bottom" : undefined}
showAccessSpecifier={!!showAccessSpecifier}
showCopyLinkOption
disabled={disabled}
@@ -65,12 +69,12 @@ export const IssueActivityCommentRoot: FC<TIssueActivityCommentRoot> = observer(
) : activityComment.activity_type === "ACTIVITY" ? (
<IssueActivityItem
activityId={activityComment.id}
ends={index === 0 ? "top" : index === filteredActivityComments.length - 1 ? "bottom" : undefined}
ends={index === 0 ? "top" : index === filteredActivityAndComments.length - 1 ? "bottom" : undefined}
/>
) : activityComment.activity_type === "ISSUE_ADDITIONAL_PROPERTIES_ACTIVITY" ? (
<IssueAdditionalPropertiesActivity
activityId={activityComment.id}
ends={index === 0 ? "top" : index === filteredActivityComments.length - 1 ? "bottom" : undefined}
ends={index === 0 ? "top" : index === filteredActivityAndComments.length - 1 ? "bottom" : undefined}
/>
) : activityComment.activity_type === "WORKLOG" ? (
<IssueActivityWorklog
@@ -78,7 +82,7 @@ export const IssueActivityCommentRoot: FC<TIssueActivityCommentRoot> = observer(
projectId={projectId}
issueId={issueId}
activityComment={activityComment}
ends={index === 0 ? "top" : index === filteredActivityComments.length - 1 ? "bottom" : undefined}
ends={index === 0 ? "top" : index === filteredActivityAndComments.length - 1 ? "bottom" : undefined}
/>
) : (
<></>

31
apps/web/core/components/issues/issue-detail/issue-activity/loader.tsx Normal file
View File

@@ -0,0 +1,31 @@
// plane imports
import { Loader } from "@plane/ui";
export const IssueActivityLoader = () => (
<Loader className="space-y-8">
<div className="flex items-start gap-3">
<Loader.Item className="shrink-0" height="28px" width="28px" />
<div className="space-y-2 w-full">
<Loader.Item height="8px" width="60%" />
<Loader.Item height="8px" width="40%" />
<Loader.Item height="10px" width="100%" />
</div>
</div>
<div className="flex items-start gap-3">
<Loader.Item className="shrink-0" height="28px" width="28px" />
<div className="space-y-2 w-full">
<Loader.Item height="8px" width="40%" />
<Loader.Item height="8px" width="60%" />
<Loader.Item height="10px" width="80%" />
</div>
</div>
<div className="flex items-start gap-3">
<Loader.Item className="shrink-0" height="28px" width="28px" />
<div className="space-y-2 w-full">
<Loader.Item height="8px" width="60%" />
<Loader.Item height="8px" width="40%" />
<Loader.Item height="10px" width="100%" />
</div>
</div>
</Loader>
);