From ea5d177675263982826b5e261d288cb2ccff9bb0 Mon Sep 17 00:00:00 2001
From: Aurelien Benel <aurelien.benel@utt.fr>
Date: Sat, 31 Aug 2024 10:25:20 +0200
Subject: [PATCH] FIX: Commenting should be disabled without margin or selected
 text.

---
 frontend/src/components/CommentFragmentAction.jsx | 6 ++++--
 frontend/src/components/Passage.jsx               | 6 +++---
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/CommentFragmentAction.jsx b/frontend/src/components/CommentFragmentAction.jsx
index 36ef2ca..b070981 100644
--- a/frontend/src/components/CommentFragmentAction.jsx
+++ b/frontend/src/components/CommentFragmentAction.jsx
@@ -1,6 +1,8 @@
 import DiscreeteDropdown from './DiscreeteDropdown';
 
-function CommentFragmentAction({selectedText, setSelectedText, setFragment}) {
+function CommentFragmentAction({selectedText, setSelectedText, setFragment, margin}) {
+
+  const disabled = !selectedText || !margin;
 
   const handleClick = () => {
     setFragment(`[${selectedText}]\n`);
@@ -8,7 +10,7 @@ function CommentFragmentAction({selectedText, setSelectedText, setFragment}) {
   };
 
   return (
-    <DiscreeteDropdown.Item onClick={handleClick}>
+    <DiscreeteDropdown.Item onClick={handleClick} {...{disabled}}>
       Comment the selected text...
     </DiscreeteDropdown.Item>
   );
diff --git a/frontend/src/components/Passage.jsx b/frontend/src/components/Passage.jsx
index 98066e7..404d1fb 100644
--- a/frontend/src/components/Passage.jsx
+++ b/frontend/src/components/Passage.jsx
@@ -29,7 +29,7 @@ function Passage({source, rubric, scholia, margin, sourceId, backend, setLastUpd
       <Col className="main">
         <Container>
           <Row>
-            <PassageSource {...{highlightedText, setHighlightedText, setFragment, selectedText, setSelectedText}}>
+            <PassageSource {...{highlightedText, setHighlightedText, setFragment, selectedText, setSelectedText, margin}}>
               {source}
             </PassageSource>
             <Rubric id={rubric} />
@@ -41,7 +41,7 @@ function Passage({source, rubric, scholia, margin, sourceId, backend, setLastUpd
   );
 }
 
-function PassageSource({children, highlightedText, setHighlightedText, setFragment, selectedText, setSelectedText}) {
+function PassageSource({children, highlightedText, setHighlightedText, setFragment, selectedText, setSelectedText, margin}) {
   return (
     <Col className="position-relative">
       {children.map((chunk, index) =>
@@ -52,7 +52,7 @@ function PassageSource({children, highlightedText, setHighlightedText, setFragme
         </Marker>
       )}
       <DiscreeteDropdown>
-        <CommentFragmentAction {...{selectedText, setSelectedText, setFragment}}/>
+        <CommentFragmentAction {...{selectedText, setSelectedText, setFragment, margin}}/>
       </DiscreeteDropdown>
     </Col>
   );