fix: prohibit paste text/html content into email editor, allow paste …

[YugfeldID]

fix for #5445

What changed? Why was the change needed?

Blocks paste text/html content into the email editor (allow paste only text/plain). Problem: when the user copies text from the rich text editor (like the editor from the In-App channel) all styles will be copied, it leads to an inability to process variables and clear formatting.

Screenshots

Without fix pasted content can look like this (with the inability to change the font, clear background, remove list items, and bold formatting):

Special notes for your reviewer

If this approach is okay, I will add a test

[netlify]

👷 Deploy request for dev-web-novu pending review.

Visit the deploys page to approve it

Name	Link
🔨 Latest commit	689c162

[netlify]

✅ Deploy Preview for novu-design ready!

Name	Link
🔨 Latest commit	689c162
🔍 Latest deploy log	https://app.netlify.com/sites/novu-design/deploys/664b03e31238f60008b54426
😎 Deploy Preview	https://deploy-preview-5478--novu-design.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[LetItRock]

hello @YugfeldID! 👋 thanks for the contribution! 🤝

I think that this is the right approach for now, but I noticed some problems with the current implementation:

• variables are not recognized
• the undo (cmd + Z) works weird

My feelings is that the inserted text node is not recognized somehow as a text change that's why the weird behaviour with undo. The another solution is to use document.execCommand('insertText', false, pastedData); but its deprecated and not recommended.

[YugfeldID]

hello @YugfeldID! 👋 thanks for the contribution! 🤝

I think that this is the right approach for now, but I noticed some problems with the current implementation:

• variables are not recognized
• the undo (cmd + Z) works weird

My feelings is that the inserted text node is not recognized somehow as a text change that's why the weird behaviour with undo. The another solution is to use document.execCommand('insertText', false, pastedData); but its deprecated and not recommended.

Hello @LetItRock, thanks for feedback.

I pushed some changes:

• methods.setValue(``${stepFormPath}.template.content.${blockIndex}.content``, ref.current?.innerHTML ?? '') should trigger changes -> variables will be parsed and placeholder will be gone
• you are right, it seems like the only way to make undo works properly is using document.execCommand('insertText', false, pastedData);, because only it interacts with browser's undo manager

[github-actions]

This PR is being marked as stale due to inactivity.

[github-actions]

This PR is being closed due to inactivity. Please reopen if work is intended to be continued.