From 5ccb3af040533adb64487af2c7eeba24fa6addcf Mon Sep 17 00:00:00 2001 From: Scott Nonnenberg Date: Wed, 18 Oct 2023 14:35:06 -0700 Subject: [PATCH] onCapturePaste: stop propagation in more scenarios --- .../conversation/ConversationView.tsx | 47 +++++++++++-------- ts/quill/signal-clipboard/index.ts | 20 ++++---- 2 files changed, 38 insertions(+), 29 deletions(-) diff --git a/ts/components/conversation/ConversationView.tsx b/ts/components/conversation/ConversationView.tsx index a71eb1e154c6..f1f5da8e3a3c 100644 --- a/ts/components/conversation/ConversationView.tsx +++ b/ts/components/conversation/ConversationView.tsx @@ -35,6 +35,9 @@ export function ConversationView({ }: PropsType): JSX.Element { const onDrop = React.useCallback( (event: React.DragEvent) => { + event.stopPropagation(); + event.preventDefault(); + if (!event.dataTransfer) { return; } @@ -43,9 +46,6 @@ export function ConversationView({ return; } - event.stopPropagation(); - event.preventDefault(); - const { files } = event.dataTransfer; processAttachments({ conversationId, @@ -57,35 +57,42 @@ export function ConversationView({ const onPaste = React.useCallback( (event: React.ClipboardEvent) => { + event.stopPropagation(); + event.preventDefault(); + if (!event.clipboardData) { return; } const { items } = event.clipboardData; - const anyImages = [...items].some( - item => item.type.split('/')[0] === 'image' - ); - if (!anyImages) { - return; - } - - event.stopPropagation(); - event.preventDefault(); - - const files: Array = []; - for (let i = 0; i < items.length; i += 1) { - if (items[i].type.split('/')[0] === 'image') { + const allVisual = [...items].every(item => { + const type = item.type.split('/')[0]; + return type === 'image' || type === 'video'; + }); + if (allVisual) { + const files: Array = []; + for (let i = 0; i < items.length; i += 1) { const file = items[i].getAsFile(); if (file) { files.push(file); } } + + processAttachments({ + conversationId, + files, + }); + + return; } - processAttachments({ - conversationId, - files, - }); + const firstAttachment = items[0]?.getAsFile(); + if (firstAttachment) { + processAttachments({ + conversationId, + files: [firstAttachment], + }); + } }, [conversationId, processAttachments] ); diff --git a/ts/quill/signal-clipboard/index.ts b/ts/quill/signal-clipboard/index.ts index a8a39b252840..6684203098ed 100644 --- a/ts/quill/signal-clipboard/index.ts +++ b/ts/quill/signal-clipboard/index.ts @@ -30,29 +30,31 @@ export class SignalClipboard { onCapturePaste(event: ClipboardEvent): void { if (event.clipboardData == null) { + event.preventDefault(); + event.stopPropagation(); + return; } const clipboard = this.quill.getModule('clipboard'); const selection = this.quill.getSelection(); - - if (selection == null) { - return; - } - const text = event.clipboardData.getData('text/plain'); const signal = event.clipboardData.getData('text/signal'); - if (!text && !signal) { - return; - } - const clipboardContainsFiles = event.clipboardData.files?.length > 0; if (!clipboardContainsFiles) { event.preventDefault(); event.stopPropagation(); } + if (selection == null) { + return; + } + + if (!text && !signal) { + return; + } + const clipboardDelta = signal ? clipboard.convert(signal) : clipboard.convert(prepareText(text));