chore: monorepo

apps/desktop/src/routes/new/components/articleCoverUploader.tsx

@@ -0,0 +1,86 @@
+import { ImageIcon, LoaderIcon } from "@lume/icons";
+import { message, open } from "@tauri-apps/plugin-dialog";
+import { readBinaryFile } from "@tauri-apps/plugin-fs";
+import { useState } from "react";
+
+export function ArticleCoverUploader({ setCover }) {
+	const [loading, setLoading] = useState(false);
+
+	const uploadToNostrBuild = async () => {
+		try {
+			// start loading
+			setLoading(true);
+
+			const selected = await open({
+				multiple: false,
+				filters: [
+					{
+						name: "Media",
+						extensions: [
+							"png",
+							"jpeg",
+							"jpg",
+							"gif",
+							"mp4",
+							"mp3",
+							"webm",
+							"mkv",
+							"avi",
+							"mov",
+						],
+					},
+				],
+			});
+
+			if (!selected) {
+				setLoading(false);
+				return;
+			}
+
+			const file = await readBinaryFile(selected.path);
+			const blob = new Blob([file]);
+
+			const data = new FormData();
+			data.append("fileToUpload", blob);
+			data.append("submit", "Upload Image");
+
+			const res = await fetch("https://nostr.build/api/v2/upload/files", {
+				method: "POST",
+				body: data,
+			});
+
+			if (res.ok) {
+				const json = await res.json();
+				const content = json.data[0];
+				setCover(content.url);
+
+				// stop loading
+				setLoading(false);
+			}
+		} catch (e) {
+			// stop loading
+			setLoading(false);
+			await message(`Upload failed, error: ${e}`, {
+				title: "Lume",
+				type: "error",
+			});
+		}
+	};
+
+	return (
+		<button
+			type="button"
+			onClick={uploadToNostrBuild}
+			className="inline-flex h-9 w-max items-center justify-center gap-2 rounded-lg bg-neutral-100 px-2.5 text-sm font-medium hover:bg-neutral-200 dark:bg-neutral-800 dark:hover:bg-neutral-800"
+		>
+			{loading ? (
+				<LoaderIcon className="h-4 w-4 animate-spin" />
+			) : (
+				<>
+					<ImageIcon className="h-4 w-4" />
+					Add cover
+				</>
+			)}
+		</button>
+	);
+}