onCapturePaste: stop propagation in more scenarios
This commit is contained in:
parent
6c88c7c587
commit
5ccb3af040
2 changed files with 38 additions and 29 deletions
|
@ -35,6 +35,9 @@ export function ConversationView({
|
||||||
}: PropsType): JSX.Element {
|
}: PropsType): JSX.Element {
|
||||||
const onDrop = React.useCallback(
|
const onDrop = React.useCallback(
|
||||||
(event: React.DragEvent<HTMLDivElement>) => {
|
(event: React.DragEvent<HTMLDivElement>) => {
|
||||||
|
event.stopPropagation();
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
if (!event.dataTransfer) {
|
if (!event.dataTransfer) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -43,9 +46,6 @@ export function ConversationView({
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
event.stopPropagation();
|
|
||||||
event.preventDefault();
|
|
||||||
|
|
||||||
const { files } = event.dataTransfer;
|
const { files } = event.dataTransfer;
|
||||||
processAttachments({
|
processAttachments({
|
||||||
conversationId,
|
conversationId,
|
||||||
|
@ -57,35 +57,42 @@ export function ConversationView({
|
||||||
|
|
||||||
const onPaste = React.useCallback(
|
const onPaste = React.useCallback(
|
||||||
(event: React.ClipboardEvent<HTMLDivElement>) => {
|
(event: React.ClipboardEvent<HTMLDivElement>) => {
|
||||||
|
event.stopPropagation();
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
if (!event.clipboardData) {
|
if (!event.clipboardData) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const { items } = event.clipboardData;
|
const { items } = event.clipboardData;
|
||||||
|
|
||||||
const anyImages = [...items].some(
|
const allVisual = [...items].every(item => {
|
||||||
item => item.type.split('/')[0] === 'image'
|
const type = item.type.split('/')[0];
|
||||||
);
|
return type === 'image' || type === 'video';
|
||||||
if (!anyImages) {
|
});
|
||||||
return;
|
if (allVisual) {
|
||||||
}
|
|
||||||
|
|
||||||
event.stopPropagation();
|
|
||||||
event.preventDefault();
|
|
||||||
|
|
||||||
const files: Array<File> = [];
|
const files: Array<File> = [];
|
||||||
for (let i = 0; i < items.length; i += 1) {
|
for (let i = 0; i < items.length; i += 1) {
|
||||||
if (items[i].type.split('/')[0] === 'image') {
|
|
||||||
const file = items[i].getAsFile();
|
const file = items[i].getAsFile();
|
||||||
if (file) {
|
if (file) {
|
||||||
files.push(file);
|
files.push(file);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
processAttachments({
|
processAttachments({
|
||||||
conversationId,
|
conversationId,
|
||||||
files,
|
files,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const firstAttachment = items[0]?.getAsFile();
|
||||||
|
if (firstAttachment) {
|
||||||
|
processAttachments({
|
||||||
|
conversationId,
|
||||||
|
files: [firstAttachment],
|
||||||
|
});
|
||||||
|
}
|
||||||
},
|
},
|
||||||
[conversationId, processAttachments]
|
[conversationId, processAttachments]
|
||||||
);
|
);
|
||||||
|
|
|
@ -30,29 +30,31 @@ export class SignalClipboard {
|
||||||
|
|
||||||
onCapturePaste(event: ClipboardEvent): void {
|
onCapturePaste(event: ClipboardEvent): void {
|
||||||
if (event.clipboardData == null) {
|
if (event.clipboardData == null) {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const clipboard = this.quill.getModule('clipboard');
|
const clipboard = this.quill.getModule('clipboard');
|
||||||
const selection = this.quill.getSelection();
|
const selection = this.quill.getSelection();
|
||||||
|
|
||||||
if (selection == null) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const text = event.clipboardData.getData('text/plain');
|
const text = event.clipboardData.getData('text/plain');
|
||||||
const signal = event.clipboardData.getData('text/signal');
|
const signal = event.clipboardData.getData('text/signal');
|
||||||
|
|
||||||
if (!text && !signal) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const clipboardContainsFiles = event.clipboardData.files?.length > 0;
|
const clipboardContainsFiles = event.clipboardData.files?.length > 0;
|
||||||
if (!clipboardContainsFiles) {
|
if (!clipboardContainsFiles) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (selection == null) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!text && !signal) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const clipboardDelta = signal
|
const clipboardDelta = signal
|
||||||
? clipboard.convert(signal)
|
? clipboard.convert(signal)
|
||||||
: clipboard.convert(prepareText(text));
|
: clipboard.convert(prepareText(text));
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue