From f7f7ef5b2f087d2eb068f9724bbfab2b203d84b6 Mon Sep 17 00:00:00 2001
From: Anzlc <107500985+Anzlc@users.noreply.github.com>
Date: Fri, 22 May 2026 15:48:38 +0200
Subject: [PATCH] feat: added support for pasting images from clipboard

---
 .../src/components/demo/RemoveBackground.jsx  | 46 +++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/apps/web/frontend/src/components/demo/RemoveBackground.jsx b/apps/web/frontend/src/components/demo/RemoveBackground.jsx
index 59fcb8a..c191acf 100644
--- a/apps/web/frontend/src/components/demo/RemoveBackground.jsx
+++ b/apps/web/frontend/src/components/demo/RemoveBackground.jsx
@@ -158,6 +158,50 @@ export const RemoveBackground = () => {
         void fetchStarCount()
     }, [])
 
+    // Handles pasting the images to remove their background
+    useEffect(() => {
+        const handlePaste = (event) => {
+            const clipboardItems = event.clipboardData?.items
+            if (!clipboardItems) return
+
+            const imageFiles = []
+
+            for (const item of clipboardItems) {
+                if (item.type.startsWith('image/')) {
+                    const file = item.getAsFile()
+                    if (file) imageFiles.push(file)
+                }
+            }
+
+            if (imageFiles.length === 0) return
+
+            setInputMode("upload")
+            let items = imageFiles.map((image,i) => {
+                const id = `paste-${Date.now()}-${image.name}-${i}`
+                const name = image.name;
+
+                const item = {
+                    id,
+                    file: image,
+                    preview: URL.createObjectURL(image), 
+                    name,
+                    status: 'pending',
+                    resultUrl: null,
+                    error: null,
+                    sourceType: 'file'
+                }
+                
+                return item
+            });
+
+            uploadsRef.current = [...uploadsRef.current, ...items]
+            setUploads(prev => [...prev, ...items])
+        }
+
+        document.addEventListener('paste', handlePaste)
+        return () => document.removeEventListener('paste', handlePaste)
+    }, [])
+
     const onDrop = useCallback((acceptedFiles) => {
         setError(null)
         const imageFiles = acceptedFiles.filter(file => file.type.startsWith('image/'))
@@ -221,6 +265,8 @@ export const RemoveBackground = () => {
         setUploads([item])
     }, [apiKey, processingType, revokeObjectUrls])
 
+    
+
     const { getRootProps, getInputProps, isDragActive } = useDropzone({
         onDrop,
         accept: { 'image/*': ['.png', '.jpg', '.jpeg', '.webp'] },