From 6177d6f3cb7bc8d29a281b83dbbaf5be1b0640fb Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Thu, 16 Nov 2023 20:36:08 -0500
Subject: [PATCH] fix: Comment should not appear in selection toolbar with
 view-only permissions. closes #6011

---
 app/editor/components/SelectionToolbar.tsx | 10 +++++++---
 app/editor/index.tsx                       |  1 +
 app/editor/menus/readOnly.tsx              |  2 ++
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/app/editor/components/SelectionToolbar.tsx b/app/editor/components/SelectionToolbar.tsx
index 5798a9d74..f4fc0009d 100644
--- a/app/editor/components/SelectionToolbar.tsx
+++ b/app/editor/components/SelectionToolbar.tsx
@@ -33,6 +33,7 @@ type Props = {
   isTemplate: boolean;
   readOnly?: boolean;
   canComment?: boolean;
+  canUpdate?: boolean;
   onOpen: () => void;
   onClose: () => void;
   onSearchLink?: (term: string) => Promise<SearchResult[]>;
@@ -197,12 +198,12 @@ export default function SelectionToolbar(props: Props) {
     );
   };
 
-  const { onCreateLink, isTemplate, rtl, canComment, ...rest } = props;
+  const { onCreateLink, isTemplate, rtl, canComment, canUpdate, ...rest } =
+    props;
   const { state } = view;
   const { selection } = state;
   const isDividerSelection = isNodeActive(state.schema.nodes.hr)(state);
 
-  // no toolbar in read-only without commenting or when dragging
   if ((readOnly && !canComment) || isDragging) {
     return null;
   }
@@ -231,7 +232,7 @@ export default function SelectionToolbar(props: Props) {
   } else if (isDividerSelection) {
     items = getDividerMenuItems(state, dictionary);
   } else if (readOnly) {
-    items = getReadOnlyMenuItems(state, dictionary);
+    items = getReadOnlyMenuItems(state, !!canUpdate, dictionary);
   } else {
     items = getFormattingMenuItems(state, isTemplate, isMobile, dictionary);
   }
@@ -244,6 +245,9 @@ export default function SelectionToolbar(props: Props) {
     if (item.name && !commands[item.name]) {
       return false;
     }
+    if (!item.visible) {
+      return false;
+    }
     return true;
   });
 
diff --git a/app/editor/index.tsx b/app/editor/index.tsx
index b58b79fb9..5171433f5 100644
--- a/app/editor/index.tsx
+++ b/app/editor/index.tsx
@@ -742,6 +742,7 @@ export class Editor extends React.PureComponent<
               <SelectionToolbar
                 rtl={isRTL}
                 readOnly={readOnly}
+                canUpdate={this.props.canUpdate}
                 canComment={this.props.canComment}
                 isTemplate={this.props.template === true}
                 onOpen={this.handleOpenSelectionToolbar}
diff --git a/app/editor/menus/readOnly.tsx b/app/editor/menus/readOnly.tsx
index e86d9eca2..2a9dd331e 100644
--- a/app/editor/menus/readOnly.tsx
+++ b/app/editor/menus/readOnly.tsx
@@ -7,12 +7,14 @@ import { Dictionary } from "~/hooks/useDictionary";
 
 export default function readOnlyMenuItems(
   state: EditorState,
+  canUpdate: boolean,
   dictionary: Dictionary
 ): MenuItem[] {
   const { schema } = state;
 
   return [
     {
+      visible: canUpdate,
       name: "comment",
       tooltip: dictionary.comment,
       label: dictionary.comment,