From 9afb36fa53bae3037dd52753e067a2e84c479cee Mon Sep 17 00:00:00 2001
From: Rishabh <zrishabhgarg@gmail.com>
Date: Thu, 28 Jul 2022 18:49:45 +0530
Subject: [PATCH] Disabled context menu edit if editing another comment

refs https://github.com/TryGhost/Team/issues/1710

- if a comment is in edit mode, it stops opening edit for another comment till existing edit mode is exited
---
 apps/comments-ui/src/components/Comment.js                   | 2 +-
 apps/comments-ui/src/components/More.js                      | 2 +-
 apps/comments-ui/src/components/modals/AuthorContextMenu.js  | 2 +-
 apps/comments-ui/src/components/modals/CommentContextMenu.js | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/comments-ui/src/components/Comment.js b/apps/comments-ui/src/components/Comment.js
index d8d6437b8a..2a8d9ce942 100644
--- a/apps/comments-ui/src/components/Comment.js
+++ b/apps/comments-ui/src/components/Comment.js
@@ -107,7 +107,7 @@ const Comment = ({updateIsEditing = null, isEditing, ...props}) => {
                         <div className="ml-12 sm:ml-[52px] flex gap-5 items-center">
                             {!isNotPublished && <Like comment={comment} />}
                             {!isNotPublished && (canReply && (isNotPublished || !props.parent) && <Reply disabled={!!isEditing} comment={comment} toggleReply={toggleReplyMode} isReplying={isInReplyMode} />)}
-                            <More comment={comment} toggleEdit={toggleEditMode} />
+                            <More comment={comment} toggleEdit={toggleEditMode} disableEditing={isEditing} />
                         </div>
                     </div>
                 </div>
diff --git a/apps/comments-ui/src/components/More.js b/apps/comments-ui/src/components/More.js
index 31d3cfcc00..ad505ee02d 100644
--- a/apps/comments-ui/src/components/More.js
+++ b/apps/comments-ui/src/components/More.js
@@ -30,7 +30,7 @@ const More = (props) => {
     return (
         <div className="relative">
             {show ? <button onClick={toggleContextMenu} className="outline-0"><MoreIcon className='transition duration-50 ease-linear gh-comments-icon gh-comments-icon-more outline-0 fill-neutral-400 dark:fill-rgba(255,255,255,0.5) hover:fill-neutral-600' /></button> : null}
-            {isContextMenuOpen ? <CommentContextMenu comment={comment} close={closeContextMenu} toggleEdit={props.toggleEdit} /> : null}
+            {isContextMenuOpen ? <CommentContextMenu comment={comment} close={closeContextMenu} toggleEdit={props.toggleEdit} disableEditing={props.disableEditing} /> : null}
         </div>
     );
 };
diff --git a/apps/comments-ui/src/components/modals/AuthorContextMenu.js b/apps/comments-ui/src/components/modals/AuthorContextMenu.js
index c6be7222a6..803e0eb9ca 100644
--- a/apps/comments-ui/src/components/modals/AuthorContextMenu.js
+++ b/apps/comments-ui/src/components/modals/AuthorContextMenu.js
@@ -11,7 +11,7 @@ const AuthorContextMenu = (props) => {
 
     return (
         <div className="flex flex-col">
-            <button className="w-full mb-3 text-left text-[14px]" onClick={props.toggleEdit}>
+            <button className="w-full mb-3 text-left text-[14px]" onClick={props.toggleEdit} disabled={props.disableEditing}>
                 Edit
             </button>
             <button className="w-full text-left text-[14px] text-red-600" onClick={deleteComment}>
diff --git a/apps/comments-ui/src/components/modals/CommentContextMenu.js b/apps/comments-ui/src/components/modals/CommentContextMenu.js
index d9bf2a26e4..040d670a62 100644
--- a/apps/comments-ui/src/components/modals/CommentContextMenu.js
+++ b/apps/comments-ui/src/components/modals/CommentContextMenu.js
@@ -40,7 +40,7 @@ const CommentContextMenu = (props) => {
     let contextMenu = null;
     if (comment.status === 'published') {
         if (isAuthor) {
-            contextMenu = <AuthorContextMenu comment={comment} close={props.close} toggleEdit={props.toggleEdit} />;
+            contextMenu = <AuthorContextMenu comment={comment} close={props.close} toggleEdit={props.toggleEdit} disableEditing={props.disableEditing} />;
         } else {
             if (isAdmin) {
                 contextMenu = <AdminContextMenu comment={comment} close={props.close}/>;