diff --git a/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx b/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx index c496d86b0a..3d0c1d3049 100644 --- a/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx +++ b/src/core/ui/forms/MarkdownInput/MarkdownInput.tsx @@ -108,75 +108,94 @@ export const MarkdownInput = memo( }, }); + const isImageOrHtmlWithImage = (item: DataTransferItem, clipboardData: DataTransfer | null) => { + if (item.kind === 'file' && item.type.startsWith('image/')) { + return true; // Image + } + + if (item.kind === 'string' && item.type === 'text/html') { + const htmlContent = clipboardData?.getData('text/html'); + return htmlContent?.includes(' = useMemo( () => ({ extensions: [StarterKit, ImageExtension, Link, Highlight, Iframe], editorProps: { - handlePaste: (_view: EditorView, event: ClipboardEvent) => { + /** + * Handles the paste event in the editor. + * + * @param _view - The editor view instance. + * @param event - The clipboard event triggered by pasting. + * @returns {boolean} - Returns true if the paste event is handled, otherwise false - continue execution of the default. + */ + handlePaste: (_view: EditorView, event: ClipboardEvent): boolean => { const clipboardData = event.clipboardData; const items = clipboardData?.items; if (!items) { - return false; // Allow default behavior if no items are found. + return false; } const storageBucketId = storageConfig?.storageBucketId; if (!storageBucketId) { - return false; // Stop custom handling if storageBucketId is missing. + return false; } let imageProcessed = false; for (const item of items) { - // Handle images first - if (!imageProcessed && item.kind === 'file' && item.type.startsWith('image/')) { - const file = item.getAsFile(); - - if (file) { - const reader = new FileReader(); - - reader.onload = () => { - uploadFile({ - variables: { - file, - uploadData: { - storageBucketId, - temporaryLocation, - }, - }, - }); - }; + const isImage = isImageOrHtmlWithImage(item, clipboardData); - reader.readAsDataURL(file); - imageProcessed = true; - } + if (hideImageOptions && isImage) { + event.preventDefault(); + + return true; // Block paste of images or HTML with images } - // Check for HTML content containing tags - if (!imageProcessed && item.kind === 'string' && item.type === 'text/html') { - const htmlContent = clipboardData.getData('text/html'); + if (!imageProcessed && isImage) { + if (item.kind === 'file' && item.type.startsWith('image/')) { + const file = item.getAsFile(); - if (htmlContent.includes(' { + uploadFile({ + variables: { + file, + uploadData: { storageBucketId, temporaryLocation }, + }, + }); + }; + + reader.readAsDataURL(file); + imageProcessed = true; + } + } else if (item.kind === 'string' && item.type === 'text/html') { + imageProcessed = true; // HTML with images } } - // Break the loop once an image or relevant HTML is handled. if (imageProcessed) { + // Stop if we have already processed an image break; } } - // Prevent default behavior only if we processed an image or relevant HTML. if (imageProcessed) { event.preventDefault(); - return true; // Block default behavior in the editor. + + return true; // Block default behavior for images } - return false; // Allow default behavior for non-image content. + return false; // Allow default behavior for text }, }, }), diff --git a/src/domain/community/contributor/organization/OrganizationVerifiedStatus.tsx b/src/domain/community/contributor/organization/OrganizationVerifiedStatus.tsx index f489ef5ded..d5708a658a 100644 --- a/src/domain/community/contributor/organization/OrganizationVerifiedStatus.tsx +++ b/src/domain/community/contributor/organization/OrganizationVerifiedStatus.tsx @@ -13,7 +13,7 @@ export const OrganizationVerifiedStatus = ({ verified, helpText }: VerifiedStatu const { t } = useTranslation(); return ( - + {helpText && verified && (