diff --git a/apps/project-assistant/frontend/src/App.css b/apps/project-assistant/frontend/src/App.css index 057941b..a51297d 100644 --- a/apps/project-assistant/frontend/src/App.css +++ b/apps/project-assistant/frontend/src/App.css @@ -349,6 +349,11 @@ box-shadow: 0 0 0 3px rgba(0, 108, 250, 0.1); } +.entry-input.dragging .entry-input-wrapper { + border-color: var(--mongodb-green); + box-shadow: 0 0 0 3px rgba(0, 237, 100, 0.2); +} + .entry-input input { flex: 1; padding: 12px 0; diff --git a/apps/project-assistant/frontend/src/components/Entry.jsx b/apps/project-assistant/frontend/src/components/Entry.jsx index 37ed5e0..3a5cd40 100644 --- a/apps/project-assistant/frontend/src/components/Entry.jsx +++ b/apps/project-assistant/frontend/src/components/Entry.jsx @@ -8,6 +8,7 @@ function Entry({ messages, onSendMessage, hasActiveProject, activeProject, proje const [searchResults, setSearchResults] = useState(null) const [isSearching, setIsSearching] = useState(false) const [saveStatus, setSaveStatus] = useState(null) + const [isDragging, setIsDragging] = useState(false) const messagesEndRef = useRef(null) const fileInputRef = useRef(null) @@ -60,17 +61,37 @@ function Entry({ messages, onSendMessage, hasActiveProject, activeProject, proje const handleFileChange = (e) => { const files = Array.from(e.target.files || []) + addFiles(files) + e.target.value = '' + } + const addFiles = (files) => { files.forEach(file => { - setSelectedImages(prev => [...prev, { - file, - preview: URL.createObjectURL(file), - name: file.name - }]) + if (file.type.startsWith('image/')) { + setSelectedImages(prev => [...prev, { + file, + preview: URL.createObjectURL(file), + name: file.name + }]) + } }) + } - // Reset input so same file can be selected again - e.target.value = '' + const handleDrop = (e) => { + e.preventDefault() + setIsDragging(false) + if (!isV2) return + const files = Array.from(e.dataTransfer.files) + addFiles(files) + } + + const handleDragOver = (e) => { + e.preventDefault() + if (isV2) setIsDragging(true) + } + + const handleDragLeave = () => { + setIsDragging(false) } const removeImage = (index) => { @@ -214,7 +235,13 @@ function Entry({ messages, onSendMessage, hasActiveProject, activeProject, proje )} -