diff --git a/src/core/ui/forms/MarkdownInput/FormikMarkdownField.tsx b/src/core/ui/forms/MarkdownInput/FormikMarkdownField.tsx
index f039d8990c..70518c0086 100644
--- a/src/core/ui/forms/MarkdownInput/FormikMarkdownField.tsx
+++ b/src/core/ui/forms/MarkdownInput/FormikMarkdownField.tsx
@@ -105,7 +105,7 @@ export const FormikMarkdownField = ({
editor?.commands.setImage({ src: data.uploadFileOnStorageBucket, alt: 'pasted-image' });
},
onError: error => {
- logError(error);
+ console.error(error.message);
},
});
@@ -141,17 +141,18 @@ export const FormikMarkdownField = ({
const handleOnPaste = useCallback(
(event: ClipboardEvent) => {
const clipboardData = event.clipboardData;
- const items = clipboardData.items;
+ const items = clipboardData?.items;
if (!items) return;
const storageBucketId = storageConfig?.storageBucketId;
if (storageBucketId) {
- let hasImage = false;
+ let imageProcessed = false;
for (const item of items) {
- if (item.type.startsWith('image/')) {
+ // Process `image/png` first
+ if (item.kind === 'file' && item.type.startsWith('image/')) {
const file = item.getAsFile();
if (file) {
const reader = new FileReader();
@@ -168,14 +169,25 @@ export const FormikMarkdownField = ({
});
};
- reader.readAsDataURL(file); // Read to trigger onLoad.
- hasImage = true;
+ reader.readAsDataURL(file); // Read the file to trigger onLoad.
+ imageProcessed = true;
+ break; // Stop after processing the image.
+ }
+ }
+
+ // Process `text/html` only if there is no image
+ if (!imageProcessed && item.kind === 'string' && item.type === 'text/html') {
+ const htmlContent = clipboardData.getData('text/html');
+ if (htmlContent.includes('`, ignore it to avoid duplication.
+ imageProcessed = true;
+ break;
}
}
}
- if (hasImage) {
- event.preventDefault(); // Prevent default only if there's an image.
+ if (imageProcessed) {
+ event.preventDefault();
}
}
},
@@ -206,7 +218,7 @@ export const FormikMarkdownField = ({
(props: PropsWithChildren) => (
),
- [handleImagePaste]
+ [handleImagePaste, handleOnPaste]
);
const labelOffset = inputElement?.getLabelOffset();
diff --git a/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx b/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx
index 480ace9c9c..a04ee298b4 100644
--- a/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx
+++ b/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx
@@ -58,6 +58,10 @@ const proseMirrorStyles = {
const editorOptions: Partial = {
extensions: [StarterKit, ImageExtension, Link, Highlight, Iframe],
+ editorProps: {
+ // Prevents automatic pasting
+ handlePaste: () => true, // Returns true to stop the default handling
+ },
};
export const MarkdownInput = memo(