Re: [PR] fix: Clicking in the body of a Markdown component does not put it into edit mode [superset]

Wed, 19 Mar 2025 06:48:25 -0700 


korbit-ai[bot] commented on code in PR #32384:
URL: https://github.com/apache/superset/pull/32384#discussion_r2003375905


##########
superset-frontend/src/dashboard/components/gridComponents/Markdown.jsx:
##########
@@ -295,15 +295,17 @@ class Markdown extends PureComponent {
     const { hasError } = this.state;
 
     return (
-      <SafeMarkdown
-        source={
-          hasError
-            ? MARKDOWN_ERROR_MESSAGE
-            : this.state.markdownSource || MARKDOWN_PLACE_HOLDER
-        }
-        htmlSanitization={this.props.htmlSanitization}
-        htmlSchemaOverrides={this.props.htmlSchemaOverrides}
-      />
+      <div style={{ pointerEvents: 'none' }}>

Review Comment:
   ### Overly Restrictive Event Blocking <sub>![category 
Functionality](https://img.shields.io/badge/Functionality-0284c7)</sub>
   
   <details>
     <summary>Tell me more</summary>
   
   ###### What is the issue?
   Setting pointerEvents to 'none' on the wrapper div prevents ALL interactions 
with the markdown content, not just clicks. This includes text selection and 
link clicking.
   
   ###### Why this matters
   Users won't be able to select text or click on links in the markdown content 
when in preview mode, severely limiting the component's usability.
   
   ###### Suggested change ∙ *Feature Preview*
   Instead of blocking all pointer events, handle the click event specifically 
or adjust the CSS to only prevent specific interactions:
   
   ```jsx
   <div onClick={e => e.stopPropagation()}>
     <SafeMarkdown
       source={
         hasError
           ? MARKDOWN_ERROR_MESSAGE
           : this.state.markdownSource || MARKDOWN_PLACE_HOLDER
       }
       htmlSanitization={this.props.htmlSanitization}
       htmlSchemaOverrides={this.props.htmlSchemaOverrides}
     />
   </div>
   ```
   
   
   ###### Provide feedback to improve future suggestions
   [![Nice 
Catch](https://img.shields.io/badge/👍%20Nice%20Catch-71BC78)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/e2118e90-08c8-4f9e-b242-ccd5664dc4f2/upvote)
 
[![Incorrect](https://img.shields.io/badge/👎%20Incorrect-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/e2118e90-08c8-4f9e-b242-ccd5664dc4f2?what_not_true=true)
  [![Not in 
Scope](https://img.shields.io/badge/👎%20Out%20of%20PR%20scope-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/e2118e90-08c8-4f9e-b242-ccd5664dc4f2?what_out_of_scope=true)
 [![Not in coding 
standard](https://img.shields.io/badge/👎%20Not%20in%20our%20standards-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/e2118e90-08c8-4f9e-b242-ccd5664dc4f2?what_not_in_standard=true)
 
[![Other](https://img.shields.io/badge/👎%20Other-white)](https://app.korbit.ai/feedback/aa91ff46-6083-4491-9416-b83dd1994b51/e2118e90-08c8-4f9e-b242-ccd5664dc4f2)
   </details>
   
   <sub>
   
   💬 Looking for more details? Reply to this comment to chat with Korbit.
   </sub>
   
   <!--- korbi internal id:474b4bc0-f119-4367-913f-55cb6112e31b -->
   
   [](474b4bc0-f119-4367-913f-55cb6112e31b)



-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to