feat(validation): support drag-and-drop PDF upload on the Validation page

[SAY-5]

Resolves: #7923

📝 Summary

The Validation page only accepted a PDF through the Upload button. Users often expect the upload area to also accept a dragged file, and during testing a dropped PDF did nothing. This adds drag-and-drop over the upload area, reusing the existing validate flow. The Upload and From UUID buttons keep working as before.

🧪 How to test

1. Open the LibreSign app and select Validation from the left sidebar.
2. Drag a PDF from your device over the upload area and drop it. The area highlights while the file is dragged over it.
3. Confirm the document goes through the same validation flow as clicking Upload and selecting the same file.
4. Drop a non-PDF file and confirm it is rejected with an error, matching the PDF-only upload button.
5. Confirm the Upload and From UUID buttons still work.

🎨 UI / Front‑end changes

• Added a drop zone around the upload actions with visible dragover feedback; dropping a PDF reuses the existing validate endpoint
• Screenshots before/after (add images or links)

🏚️ Before	🏡 After
Screenshot before	Screenshot after

• 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
• Design review approved – optional, link to feedback if available
• Documentation updated (if applicable) – docs repository

🚧 Tasks

• ...

✅ Checklist

• I have read and followed the contribution guide.
• Drag-and-drop reuses the existing upload/validate path rather than adding a separate flow
• Existing click-to-upload and keyboard access preserved

🤖 AI (if applicable)

• The content of this PR was partially or fully generated using AI

[vitormattos]

Could you also provide screenshot or demo video?

[codecov-commenter]

⚠️ Please install the to ensure uploads and comments are reliably processed by Codecov.

Codecov Report

❌ Patch coverage is 68.00000% with 8 lines in your changes missing coverage. Please review.

Files with missing lines	Patch %	Lines
src/views/Validation.vue	68.00%	7 Missing and 1 partial ⚠️
❗ Your organization needs to install the Codecov GitHub app to enable full functionality.

Files with missing lines	Coverage Δ
src/views/Validation.vue	58.91% <68.00%> (+3.53%)	⬆️

... and 172 files with indirect coverage changes

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[vitormattos]

Congratulations on the initiative and your contribution to the project. How did you find out about LibreSign?

[SAY-5]

Added the TRANSLATORS hints for the drop-zone text and the Upload button, and kept the existing UUID note as-is (matches your suggestion). Pushed in 4e06d33.

On the demo: the drag-and-drop area sits above the existing "From UUID"/"Upload" buttons on the Validation page. Dragging a PDF over it highlights the zone (upload-dropzone--dragover), and dropping runs the same validation flow as the Upload button; non-PDF drops are ignored. I'll try to attach a short screen capture, but let me know if a static screenshot of the highlighted zone is enough.

Found LibreSign while looking for a self-hosted Nextcloud-based signing app.

[SAY-5]

Thanks for taking a look. I came across LibreSign while looking for a self-hostable, open-source document-signing option that integrates with Nextcloud, and the Validation page stood out as a place where drag-and-drop would smooth out the upload flow.

On the demo: the change lets you drop a PDF anywhere on the Validation drop zone (in addition to the existing file picker). The drop zone shows an active/hover state while a file is dragged over it, rejects non-PDF files with the same validation the picker uses, and then runs the same validation request as a picker upload. I'll add a short screen recording of the drag-and-drop flow to the PR shortly.

[YvesCesar]

Thanks @SAY-5 !

Sounds great to me:

Screencast.From.2026-07-21.15-16-11.mp4

---

I don't have any suggestions for improving the code. From what I've read, only one implementation of the code suggestion is still pending.

[vitormattos]

/backport to stable34

[vitormattos]

/backport to stable33

[vitormattos]

/backport to stable32

[backportbot-libresign]

The backport to stable32 failed. Please do this backport manually.

# Switch to the target branch and update it
git checkout stable32
git pull origin stable32

# Create the new backport branch
git checkout -b backport/7924/stable32

# Cherry pick the change from the commit sha1 of the change against the default branch
# This might cause conflicts, resolve them
git cherry-pick 7adf8704 4e06d339 5e87b3db 93c9e7a5 8cbbefd8

# Push the cherry pick commit to the remote repository and open a pull request
git push origin backport/7924/stable32

Error: Failed to push branch backport/7924/stable32: remote: Invalid username or token. Password authentication is not supported for Git operations.
fatal: Authentication failed for 'https://github.com/LibreSign/libresign.git/'

---

Learn more about backports at https://docs.nextcloud.com/server/stable/go.php?to=developer-backports.

[vitormattos]

/backport to stable32