{
+ try {
+ if (!workspaceSlug || !projectId || !issueId || !replyId) throw new Error("Missing fields");
+ await repliesStore.updateReply(workspaceSlug, projectId, issueId, replyId, data);
+ setToast({
+ title: t("common.success"),
+ type: TOAST_TYPE.SUCCESS,
+ message: t("issue.comments.replies.toast.update.success.message"),
+ });
+ } catch (error) {
+ console.error("Error updating reply:", error);
+ setToast({
+ title: t("common.error.label"),
+ type: TOAST_TYPE.ERROR,
+ message: t("issue.comments.replies.toast.update.error.message"),
+ });
+ }
+ },
deleteReply: async (replyId) => {
try {
if (!workspaceSlug || !projectId || !issueId || !replyId) throw new Error("Missing fields");
diff --git a/apps/web/ee/components/comments/replies/reply-card.tsx b/apps/web/ee/components/comments/replies/reply-card.tsx
index 4d95d651c3..b20039efe2 100644
--- a/apps/web/ee/components/comments/replies/reply-card.tsx
+++ b/apps/web/ee/components/comments/replies/reply-card.tsx
@@ -1,4 +1,4 @@
-import { useRef, useState } from "react";
+import { useMemo, useRef, useState } from "react";
import { observer } from "mobx-react";
// plane imports
import type { EditorRefApi } from "@plane/editor";
@@ -30,11 +30,25 @@ export const ReplyCard = observer(function ReplyCard(props: Props) {
// derived values
const reply = getReply();
+ // Create wrapper operations that route updateComment to updateReply for replies
+ const replyActivityOperations: TCommentsOperations = useMemo(
+ () => ({
+ ...activityOperations,
+ updateComment: async (commentId: string, data: Partial
) => {
+ // Route to reply update operation
+ if (activityOperations.replyOperations?.updateReply) {
+ await activityOperations.replyOperations.updateReply(commentId, data);
+ }
+ },
+ }),
+ [activityOperations]
+ );
+
if (!reply) return null;
return (
"}
containerClassName="min-h-min"
onChange={(comment_json, comment_html) => onChange(comment_html)}
@@ -130,7 +131,7 @@ export const ReplyCreate = observer(function ReplyCreate(props: Props) {
return asset_id;
}}
showToolbarInitially={false}
- parentClassName="p-2"
+ parentClassName="p-2 bg-custom-background-100"
placeholder={t("issue.comments.replies.create.placeholder")}
displayConfig={{
fontSize: "small-font",
diff --git a/apps/web/ee/components/comments/replies/root.tsx b/apps/web/ee/components/comments/replies/root.tsx
index 717066baf0..0faef4bae4 100644
--- a/apps/web/ee/components/comments/replies/root.tsx
+++ b/apps/web/ee/components/comments/replies/root.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState, useImperativeHandle, forwardRef, useRef } from "react";
+import { useEffect, useState, useImperativeHandle, forwardRef } from "react";
import { uniq } from "lodash-es";
import { observer } from "mobx-react";
// plane imports
@@ -46,29 +46,17 @@ export const CommentRepliesRoot = observer(
} = props;
// states
const [isExpanded, setIsExpanded] = useState(false);
- // refs
- const previousRepliesCountRef = useRef(repliesCount);
// store hooks
const { getUserDetails } = useMember();
// Expose method to show editor - expands and shows editor
useImperativeHandle(ref, () => ({
showReplyEditor: () => {
- setIsExpanded(true);
+ if (!isExpanded) {
+ setIsExpanded(true);
+ }
+ editorRef.current?.focus("end");
},
}));
- // Auto-expand only when a new reply is added (repliesCount increases)
- useEffect(() => {
- const previousCount = previousRepliesCountRef.current;
- const currentCount = repliesCount;
-
- // Only auto-expand if replies count increased (new reply added) and not already expanded
- if (currentCount > previousCount && currentCount > 0 && !isExpanded) {
- setIsExpanded(true);
- }
-
- // Update ref for next render
- previousRepliesCountRef.current = currentCount;
- }, [repliesCount, isExpanded]);
// Fetch replies when expanded and has replies
useEffect(() => {
if (isExpanded && repliesCount > 0) {
@@ -79,53 +67,63 @@ export const CommentRepliesRoot = observer(
}, [isExpanded, repliesCount, commentId, activityOperations.replyOperations]);
return (
-
- {repliesCount > 0 && !isExpanded && (
-