feat: add drag-and-drop document upload to Files page#7928
Open
yazeed1425 wants to merge 1 commit into
Open
Conversation
Adds drag-and-drop as an additional input method for the existing upload flow on the LibreSign Files page. Dropped files are routed through the same validation, envelope, and upload logic as the existing "Upload" button by extracting a shared RequestPicker.handleFilesSelected() entry point, so there are no separate rules for drag-and-drop vs. click-to-upload. - FilesList.vue gains dragenter/dragover/dragleave/drop handlers on the page content area, with a visual drop-target overlay, gated on the existing canRequestSign permission. - RequestPicker.vue's max-file-uploads and envelope-name-dialog logic is reused as-is; a new guard shows an error when multiple files are dropped while envelopes are disabled (previously unreachable via the single-select file picker, but reachable via drag-and-drop). Closes LibreSign#7926 Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
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.
Resolves: #7926
📝 Summary
Adds drag-and-drop as an additional input method for the existing upload flow on the LibreSign Files page. Dropped files are routed through the same validation, envelope, and upload logic as the existing "Upload" button by extracting a shared
RequestPicker.handleFilesSelected()entry point, so there are no separate rules for drag-and-drop vs. click-to-upload.FilesList.vuegains dragenter/dragover/dragleave/drop handlers on the page content area, with a visual drop-target overlay, gated on the existingcanRequestSignpermission.RequestPicker.vue's max-file-uploads and envelope-name-dialog logic is reused as-is; a new guard shows an error when multiple files are dropped while envelopes are disabled (previously unreachable via the single-select file picker, but reachable via drag-and-drop).🧪 How to test
Automated coverage:
src/tests/components/Request/RequestPicker.spec.tsandsrc/tests/views/FilesList/FilesList.spec.ts(both envelope-enabled and envelope-disabled scenarios).Note for reviewers: this was verified visually against the real Vue component tree using a temporary local harness with a mocked backend, in addition to the automated test suite. It has not yet been exercised against a live Nextcloud instance — please do a real end-to-end pass before merging.
🎨 UI / Front‑end changes
Added drag-and-drop upload support to the Files page, reusing the existing upload button's validation/envelope/upload logic.
Screenshots before/after (add images or links)
Tested in multiple browsers (Chrome, Firefox, Safari) – optional but appreciated
Components, Unit (with vitest) and/or e2e (with Playwright) tests added - Required
Accessibility verified (contrast, keyboard navigation, screen reader friendly) – if applicable
(Existing keyboard flows are untouched; the drop overlay is
aria-hidden+pointer-events: noneso it can't trap focus or interfere with tab order — but no actual screen-reader pass was done.)Design review approved – optional, link to feedback if available
Documentation updated (if applicable) – docs repository
✅ Checklist
🤖 AI (if applicable)