diff --git a/src/components/Draft.tsx b/src/components/Draft.tsx index 1046805..2181521 100644 --- a/src/components/Draft.tsx +++ b/src/components/Draft.tsx @@ -184,6 +184,32 @@ export default function Draft({ replyToPostId, onReplySubmitted }: Props = {}) { [manager.maxSize], ); + const handlePaste = useCallback( + async (event: React.ClipboardEvent) => { + const clipboardData = event.clipboardData; + if (!clipboardData) return; + + // Check if clipboard contains image data + const items = clipboardData.items; + for (let i = 0; i < items.length; i++) { + const item = items[i]; + if (item.type.startsWith("image/")) { + event.preventDefault(); // Prevent default paste behavior for images + const file = item.getAsFile(); + if (file) { + try { + await onFileSelected(file); + } catch (error) { + console.error("Error processing pasted image:", error); + } + } + break; + } + } + }, + [onFileSelected], + ); + const onPixelIt = useCallback(async () => { const url = await pixelate(fileUrl); console.log("pixelate:" + url.length); @@ -218,6 +244,7 @@ export default function Draft({ replyToPostId, onReplySubmitted }: Props = {}) { ref={textareaRef} style={styled ? cardStyle : textareaStyle} placeholder={hint} + onPaste={handlePaste} > {isImage && } {isVideo && }