From e24f064042e811aa0545eb1957774801cfbd0023 Mon Sep 17 00:00:00 2001
From: Ray Dumasia <worldofray@googlemail.com>
Date: Sat, 15 Nov 2025 23:32:33 +0000
Subject: [PATCH] Add CTRL-V support as suggested by @p-xiexin

---
 frontend/src/App.jsx                    |  5 ++-
 frontend/src/components/ImageUpload.jsx | 42 +++++++++++++++++++++++--
 2 files changed, 44 insertions(+), 3 deletions(-)

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 891f5dd..6fe19cb 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -346,11 +346,14 @@ function App() {
 
       {/* Footer */}
       <footer className="mt-20 border-t border-white/10 glass">
-        <div className="max-w-7xl mx-auto px-6 py-8 text-center">
+        <div className="max-w-7xl mx-auto px-6 py-8 text-center space-y-2">
           <p className="text-sm text-gray-400">
             Powered by <span className="gradient-text font-semibold">DeepSeek-OCR</span> • 
             Built with <span className="text-pink-400">♥</span> using React + FastAPI
           </p>
+          <p className="text-xs text-gray-500">
+            Thanks to <a href="https://github.com/p-xiexin" target="_blank" rel="noopener noreferrer" className="text-purple-400 hover:text-purple-300 transition-colors">@p-xiexin</a> for the clipboard paste idea!
+          </p>
         </div>
       </footer>
     </div>
diff --git a/frontend/src/components/ImageUpload.jsx b/frontend/src/components/ImageUpload.jsx
index fdf6918..73f4805 100644
--- a/frontend/src/components/ImageUpload.jsx
+++ b/frontend/src/components/ImageUpload.jsx
@@ -1,7 +1,7 @@
-import { useCallback } from 'react'
+import { useCallback, useEffect } from 'react'
 import { motion } from 'framer-motion'
 import { useDropzone } from 'react-dropzone'
-import { Upload, Image as ImageIcon, X, FileText } from 'lucide-react'
+import { Upload, Image as ImageIcon, X, FileText, Clipboard } from 'lucide-react'
 
 export default function ImageUpload({ onImageSelect, preview, fileType = 'image' }) {
   const onDrop = useCallback((acceptedFiles) => {
@@ -12,6 +12,38 @@ export default function ImageUpload({ onImageSelect, preview, fileType = 'image'
 
   const isPDF = fileType === 'pdf'
 
+  // Handle clipboard paste
+  useEffect(() => {
+    // Only enable paste for images, not PDFs
+    if (isPDF) return
+
+    const handlePaste = async (e) => {
+      const items = e.clipboardData?.items
+      if (!items) return
+
+      for (let i = 0; i < items.length; i++) {
+        const item = items[i]
+        
+        if (item.type.indexOf('image') !== -1) {
+          e.preventDefault()
+          const blob = item.getAsFile()
+          
+          if (blob) {
+            // Create a File object with a proper name
+            const file = new File([blob], `pasted-image-${Date.now()}.png`, {
+              type: blob.type,
+            })
+            onImageSelect(file)
+          }
+          break
+        }
+      }
+    }
+
+    document.addEventListener('paste', handlePaste)
+    return () => document.removeEventListener('paste', handlePaste)
+  }, [onImageSelect, isPDF])
+
   const { getRootProps, getInputProps, isDragActive } = useDropzone({
     onDrop,
     accept: isPDF ? {
@@ -82,6 +114,12 @@ export default function ImageUpload({ onImageSelect, preview, fileType = 'image'
                   : 'or click to browse • PNG, JPG, WEBP up to 10MB'
                 }
               </p>
+              {!isPDF && (
+                <p className="text-xs text-purple-400 mt-2 flex items-center justify-center gap-1.5">
+                  <Clipboard className="w-3.5 h-3.5" />
+                  <span>Press Ctrl+V to paste from clipboard</span>
+                </p>
+              )}
             </div>
           </div>
         </motion.div>