[842] chore: disable comments and reactions in archived issues. (#4101)

This commit is contained in:
Prateek Shourya 2024-04-03 18:02:07 +05:30 committed by GitHub
parent fed5916907
commit 68ebcfd04e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 77 additions and 36 deletions

View File

@ -13,10 +13,11 @@ type TIssueActivityCommentRoot = {
issueId: string;
activityOperations: TActivityOperations;
showAccessSpecifier?: boolean;
disabled?: boolean;
};
export const IssueActivityCommentRoot: FC<TIssueActivityCommentRoot> = observer((props) => {
const { workspaceSlug, issueId, activityOperations, showAccessSpecifier } = props;
const { workspaceSlug, issueId, activityOperations, showAccessSpecifier, disabled } = props;
// hooks
const {
activity: { getActivityCommentByIssueId },
@ -37,6 +38,7 @@ export const IssueActivityCommentRoot: FC<TIssueActivityCommentRoot> = observer(
activityOperations={activityOperations}
ends={index === 0 ? "top" : index === activityComments.length - 1 ? "bottom" : undefined}
showAccessSpecifier={showAccessSpecifier}
disabled={disabled}
/>
) : activityComment.activity_type === "ACTIVITY" ? (
<IssueActivityList

View File

@ -25,10 +25,11 @@ type TIssueCommentCard = {
activityOperations: TActivityOperations;
ends: "top" | "bottom" | undefined;
showAccessSpecifier?: boolean;
disabled?: boolean;
};
export const IssueCommentCard: FC<TIssueCommentCard> = (props) => {
const { workspaceSlug, commentId, activityOperations, ends, showAccessSpecifier = false } = props;
const { workspaceSlug, commentId, activityOperations, ends, showAccessSpecifier = false, disabled = false } = props;
// hooks
const {
comment: { getCommentById },
@ -81,7 +82,7 @@ export const IssueCommentCard: FC<TIssueCommentCard> = (props) => {
commentId={commentId}
quickActions={
<>
{currentUser?.id === comment.actor && (
{!disabled && currentUser?.id === comment.actor && (
<CustomMenu ellipsis>
<CustomMenu.MenuItem onClick={() => setIsEditing(true)} className="flex items-center gap-1">
<Pencil className="h-3 w-3" />
@ -184,6 +185,7 @@ export const IssueCommentCard: FC<TIssueCommentCard> = (props) => {
projectId={comment?.project_detail?.id}
commentId={comment.id}
currentUser={currentUser}
disabled={disabled}
/>
</div>
</>

View File

@ -12,10 +12,11 @@ type TIssueCommentRoot = {
issueId: string;
activityOperations: TActivityOperations;
showAccessSpecifier?: boolean;
disabled?: boolean;
};
export const IssueCommentRoot: FC<TIssueCommentRoot> = observer((props) => {
const { workspaceSlug, issueId, activityOperations, showAccessSpecifier } = props;
const { workspaceSlug, issueId, activityOperations, showAccessSpecifier, disabled } = props;
// hooks
const {
comment: { getCommentsByIssueId },
@ -34,6 +35,7 @@ export const IssueCommentRoot: FC<TIssueCommentRoot> = observer((props) => {
ends={index === 0 ? "top" : index === commentIds.length - 1 ? "bottom" : undefined}
activityOperations={activityOperations}
showAccessSpecifier={showAccessSpecifier}
disabled={disabled}
/>
))}
</div>

View File

@ -14,6 +14,7 @@ type TIssueActivity = {
workspaceSlug: string;
projectId: string;
issueId: string;
disabled?: boolean;
};
type TActivityTabs = "all" | "activity" | "comments";
@ -43,7 +44,7 @@ export type TActivityOperations = {
};
export const IssueActivity: FC<TIssueActivity> = observer((props) => {
const { workspaceSlug, projectId, issueId } = props;
const { workspaceSlug, projectId, issueId, disabled = false } = props;
// hooks
const { createComment, updateComment, removeComment } = useIssueDetail();
const { getProjectById } = useProject();
@ -145,12 +146,15 @@ export const IssueActivity: FC<TIssueActivity> = observer((props) => {
issueId={issueId}
activityOperations={activityOperations}
showAccessSpecifier={project.is_deployed}
disabled={disabled}
/>
{!disabled && (
<IssueCommentCreate
workspaceSlug={workspaceSlug}
activityOperations={activityOperations}
showAccessSpecifier={project.is_deployed}
/>
)}
</div>
) : activityTab === "activity" ? (
<IssueActivityRoot issueId={issueId} />
@ -161,12 +165,15 @@ export const IssueActivity: FC<TIssueActivity> = observer((props) => {
issueId={issueId}
activityOperations={activityOperations}
showAccessSpecifier={project.is_deployed}
disabled={disabled}
/>
{!disabled && (
<IssueCommentCreate
workspaceSlug={workspaceSlug}
activityOperations={activityOperations}
showAccessSpecifier={project.is_deployed}
/>
)}
</div>
)}
</div>

View File

@ -132,7 +132,7 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
disabled={!is_editable}
/>
<IssueActivity workspaceSlug={workspaceSlug} projectId={projectId} issueId={issueId} />
<IssueActivity workspaceSlug={workspaceSlug} projectId={projectId} issueId={issueId} disabled={!is_editable} />
</>
);
});

View File

@ -3,10 +3,12 @@ import { observer } from "mobx-react-lite";
import { IUser } from "@plane/types";
// components
import { TOAST_TYPE, Tooltip, setToast } from "@plane/ui";
// helper
import { cn } from "@/helpers/common.helper";
import { renderEmoji } from "@/helpers/emoji.helper";
import { formatTextList } from "@/helpers/issue.helper";
// hooks
import { useIssueDetail, useMember } from "@/hooks/store";
// helper
// types
import { ReactionSelector } from "./reaction-selector";
@ -15,10 +17,11 @@ export type TIssueCommentReaction = {
projectId: string;
commentId: string;
currentUser: IUser;
disabled?: boolean;
};
export const IssueCommentReaction: FC<TIssueCommentReaction> = observer((props) => {
const { workspaceSlug, projectId, commentId, currentUser } = props;
const { workspaceSlug, projectId, commentId, currentUser, disabled = false } = props;
// hooks
const {
@ -88,12 +91,14 @@ export const IssueCommentReaction: FC<TIssueCommentReaction> = observer((props)
return (
<div className="mt-4 relative flex items-center gap-1.5">
{!disabled && (
<ReactionSelector
size="md"
position="top"
value={userReactions}
onSelect={issueCommentReactionOperations.react}
/>
)}
{reactionIds &&
Object.keys(reactionIds || {}).map(
@ -103,11 +108,15 @@ export const IssueCommentReaction: FC<TIssueCommentReaction> = observer((props)
<Tooltip tooltipContent={getReactionUsers(reaction)}>
<button
type="button"
onClick={() => issueCommentReactionOperations.react(reaction)}
onClick={() => !disabled && issueCommentReactionOperations.react(reaction)}
key={reaction}
className={`flex h-full items-center gap-1 rounded-md px-2 py-1 text-sm text-custom-text-100 ${
userReactions.includes(reaction) ? "bg-custom-primary-100/10" : "bg-custom-background-80"
}`}
className={cn(
"flex h-full items-center gap-1 rounded-md px-2 py-1 text-sm text-custom-text-100",
userReactions.includes(reaction) ? "bg-custom-primary-100/10" : "bg-custom-background-80",
{
"cursor-not-allowed": disabled,
}
)}
>
<span>{renderEmoji(reaction)}</span>
<span className={userReactions.includes(reaction) ? "text-custom-primary-100" : ""}>

View File

@ -5,6 +5,7 @@ import { IUser } from "@plane/types";
// ui
import { TOAST_TYPE, Tooltip, setToast } from "@plane/ui";
// helpers
import { cn } from "@/helpers/common.helper";
import { renderEmoji } from "@/helpers/emoji.helper";
import { formatTextList } from "@/helpers/issue.helper";
import { useIssueDetail, useMember } from "@/hooks/store";
@ -16,10 +17,11 @@ export type TIssueReaction = {
projectId: string;
issueId: string;
currentUser: IUser;
disabled?: boolean;
};
export const IssueReaction: FC<TIssueReaction> = observer((props) => {
const { workspaceSlug, projectId, issueId, currentUser } = props;
const { workspaceSlug, projectId, issueId, currentUser, disabled = false } = props;
// hooks
const {
reaction: { getReactionsByIssueId, reactionsByUser, getReactionById },
@ -89,7 +91,9 @@ export const IssueReaction: FC<TIssueReaction> = observer((props) => {
return (
<div className="mt-4 relative flex items-center gap-1.5">
{!disabled && (
<ReactionSelector size="md" position="top" value={userReactions} onSelect={issueReactionOperations.react} />
)}
{reactionIds &&
Object.keys(reactionIds || {}).map(
@ -99,11 +103,15 @@ export const IssueReaction: FC<TIssueReaction> = observer((props) => {
<Tooltip tooltipContent={getReactionUsers(reaction)}>
<button
type="button"
onClick={() => issueReactionOperations.react(reaction)}
onClick={() => !disabled && issueReactionOperations.react(reaction)}
key={reaction}
className={`flex h-full items-center gap-1 rounded-md px-2 py-1 text-sm text-custom-text-100 ${
userReactions.includes(reaction) ? "bg-custom-primary-100/10" : "bg-custom-background-80"
}`}
className={cn(
"flex h-full items-center gap-1 rounded-md px-2 py-1 text-sm text-custom-text-100",
userReactions.includes(reaction) ? "bg-custom-primary-100/10" : "bg-custom-background-80",
{
"cursor-not-allowed": disabled,
}
)}
>
<span>{renderEmoji(reaction)}</span>
<span className={userReactions.includes(reaction) ? "text-custom-primary-100" : ""}>

View File

@ -87,6 +87,7 @@ export const PeekOverviewIssueDetails: FC<IPeekOverviewIssueDetails> = observer(
projectId={issue.project_id}
issueId={issueId}
currentUser={currentUser}
disabled={disabled}
/>
)}
</div>

View File

@ -177,7 +177,12 @@ export const IssueView: FC<IIssueView> = observer((props) => {
disabled={disabled || is_archived}
/>
<IssueActivity workspaceSlug={workspaceSlug} projectId={projectId} issueId={issueId} />
<IssueActivity
workspaceSlug={workspaceSlug}
projectId={projectId}
issueId={issueId}
disabled={disabled || is_archived}
/>
</div>
) : (
<div className="vertical-scrollbar flex h-full w-full overflow-auto">
@ -210,7 +215,12 @@ export const IssueView: FC<IIssueView> = observer((props) => {
workspaceSlug={workspaceSlug}
/>
<IssueActivity workspaceSlug={workspaceSlug} projectId={projectId} issueId={issueId} />
<IssueActivity
workspaceSlug={workspaceSlug}
projectId={projectId}
issueId={issueId}
disabled={disabled || is_archived}
/>
</div>
</div>
<div