feat(ui): enhance drag-and-drop upload feedback with animated icon an…#599
Open
NaitikVerma6776 wants to merge 2 commits into
Open
feat(ui): enhance drag-and-drop upload feedback with animated icon an…#599NaitikVerma6776 wants to merge 2 commits into
NaitikVerma6776 wants to merge 2 commits into
Conversation
…d aria-live announcement
Contributor
Author
|
Note: The "Run backend pytest suite with coverage" failure is pre-existing on I've opened a separate PR to fix this dependency issue #601. so kindly merge this issue and assign the upcoming issue to resolve unnecessary fails. |
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
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.
📋 PR Checklist
🔗 Related Issue
Closes #557
📝 What does this PR do?
The core drag-and-drop highlight feature was already implemented in
DocumentSidebar.tsxviareact-dropzone'sisDragActivestate(border highlight, background change, "Drop files here" message in 4 languages,
auto-reset on drag leave/drop).
This PR adds extra visual and accessibility polish on top of the existing feature:
Improvements:
UploadCloudicon during drag (vs staticUploadicon)aria-live="polite"so screen readers announce the drop message change🗂️ Type of Change
🧪 How was this tested?
npm run devinsidefrontend/)uvicorn app.main:app --reload)Verified
npm run lint(0 errors) andnpm run buildpass successfully.📸 Screenshots (if UI change)
N/A — toolbar UI improvement, visible when dragging a file over the upload area
onDrop, validation, or upload logic✅ Self-Review Checklist
dev, notmainmainbranch or any HuggingFace deployment config