feat(vscode): add drag and drop support for image uploads - #64
Merged
Conversation
Implement validateAndAddFiles method in useImageUpload hook and integrate it with ChatToolbar component to handle drag and drop image uploads
- Add onImageUpload prop to ChatInputForm and FormEditor components - Implement file handling with FileHandler extension for TipTap editor - Add drag and drop UI with visual feedback for file uploads - Support image file filtering and upload callback handling
Remove window-level drag handlers and consolidate drag state management Use Tiptap's built-in DOM event handlers for better integration Simplify drag overlay UI to only show when dragging over editor
…ogic - Remove console logs from file drop/paste handlers - Consolidate file handling into single callback - Clean up drag event handlers
…dlers - Standardize quote usage and arrow function parentheses - Reformat long lines for better readability - Update drag overlay styling classes to match tailwind conventions
Add new dependency to support file handling functionality in the editor
ZHallen122
marked this pull request as draft
August 25, 2025 02:51
wsxiaoys
marked this pull request as ready for review
August 25, 2025 02:55
…ge upload logic Directly call onImageUpload instead of using intermediate handler to simplify code
ZHallen122
marked this pull request as draft
August 25, 2025 03:03
ZHallen122
marked this pull request as ready for review
August 25, 2025 03:17
liangfung
reviewed
Aug 25, 2025
liangfung
left a comment
liangfung
left a comment
Member
There was a problem hiding this comment.
LG, two points to note
- It may be beneficial to apply the previous limits on the number for images and checks for image size
- Adding a tooltip to the 'upload image' button could help users learn that the can hold shift to drop in images
cc @wsxiaoys
Add console logs to track Enter key submission and file drop events
…irectly Simplify image upload handling by removing the FileHandler extension and implementing drop handling directly in the editor props. This provides more control over the file upload process and removes unnecessary dependencies.
Clean up unused code related to drag and drop image upload validation that was no longer needed
Implement handleImageUpload callback to process dropped files and log upload events
wsxiaoys
reviewed
Aug 26, 2025
wsxiaoys
reviewed
Aug 26, 2025
… button Add hover card component to provide users with upload instructions when hovering over the image button. The card explains click, drag-and-drop, and paste functionality for image uploads.
The prop name was changed to better reflect its actual functionality of handling dropped images rather than general uploads. This change improves code clarity and maintains consistent naming across components.
Move drag and drop image upload logic from chat toolbar to use-image-upload hook for better reusability
Member
|
fix #51 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Test plan
🤖 Generated with Pochi