FIX: Commenting should be disabled without margin or selected text.

Hypertopic · Aug 31, 2024 · ea5d177 · ea5d177
1 parent a9d5aaa
commit ea5d177
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 5 deletions.
diff --git a/frontend/src/components/CommentFragmentAction.jsx b/frontend/src/components/CommentFragmentAction.jsx
@@ -1,14 +1,16 @@
 import DiscreeteDropdown from './DiscreeteDropdown';
 
-function CommentFragmentAction({selectedText, setSelectedText, setFragment}) {
+function CommentFragmentAction({selectedText, setSelectedText, setFragment, margin}) {
+
+  const disabled = !selectedText || !margin;
 
   const handleClick = () => {
     setFragment(`[${selectedText}]\n`);
     setSelectedText();
   };
 
   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
@@ -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>
   );