diff --git a/packages/app/src/Element/NoteCreator.tsx b/packages/app/src/Element/NoteCreator.tsx index a338c5a2..581259ac 100644 --- a/packages/app/src/Element/NoteCreator.tsx +++ b/packages/app/src/Element/NoteCreator.tsx @@ -27,6 +27,8 @@ import type { RootState } from "State/Store"; import { LNURL } from "LNURL"; import messages from "./messages"; +import { ClipboardEventHandler, useState } from "react"; +import Spinner from "Icons/Spinner"; interface NotePreviewProps { note: TaggedRawEvent; @@ -58,6 +60,7 @@ export function NoteCreator() { const zapForward = useSelector((s: RootState) => s.noteCreator.zapForward); const sensitive = useSelector((s: RootState) => s.noteCreator.sensitive); const pollOptions = useSelector((s: RootState) => s.noteCreator.pollOptions); + const [uploadInProgress, setUploadInProgress] = useState(false); const dispatch = useDispatch(); async function sendNote() { @@ -99,6 +102,19 @@ export function NoteCreator() { async function attachFile() { try { const file = await openFile(); + if (file) { + uploadFile(file); + } + } catch (error: unknown) { + if (error instanceof Error) { + dispatch(setError(error?.message)); + } + } + } + + async function uploadFile(file: File | Blob) { + setUploadInProgress(true); + try { if (file) { const rx = await uploader.upload(file, file.name); if (rx.url) { @@ -111,6 +127,8 @@ export function NoteCreator() { if (error instanceof Error) { dispatch(setError(error?.message)); } + } finally { + setUploadInProgress(false); } } @@ -205,6 +223,25 @@ export function NoteCreator() { } } + const handlePaste: ClipboardEventHandler = evt => { + if (evt.clipboardData) { + const clipboardItems = evt.clipboardData.items; + const items: DataTransferItem[] = Array.from(clipboardItems).filter(function (item: DataTransferItem) { + // Filter the image items only + return /^image\//.test(item.type); + }); + if (items.length === 0) { + return; + } + + const item = items[0]; + const blob = item.getAsFile(); + if (blob) { + uploadFile(blob); + } + } + }; + return ( <> {show && ( @@ -212,7 +249,9 @@ export function NoteCreator() { {replyTo && } {preview && getPreviewNote()} {!preview && ( -
+