Skip to content

feat(video-to-bootanim): add drag and drop support to video dropzone - #2

Merged
Mr-Hasan-Hamid merged 1 commit into
Mr-Hasan-Hamid:mainfrom
19-AKA-HH:feat/video-dropzone-drag-drop
Sep 26, 2026
Merged

Mr-Hasan-Hamid merged 1 commit into
Mr-Hasan-Hamid:mainfrom
19-AKA-HH:feat/video-dropzone-drag-drop

Conversation

@19-AKA-HH

Copy link
Copy Markdown
Collaborator

Summary of changes

  • Adds drag-and-drop file support to the Video to Boot Animation importer (/video-to-bootanimation).
  • Users can now drag an .mp4 or .webm file directly into the drop zone area, in addition to clicking to browse files.
  • Provides visual active state feedback while dragging over the target area.
  • No other pages or logic were touched.

Co-authored with @Mr-Hasan-Hamid

Adds native drag-and-drop file ingestion to the video-to-bootanimation
dropzone with visual active state feedback.

Co-authored-by: Md Hasan Hamid <86195509+Mr-Hasan-Hamid@users.noreply.github.com>
@vercel

vercel Bot commented Sep 26, 2026

Copy link
Copy Markdown

Someone is attempting to deploy a commit to the rainyxwear-6506's projects Team on Vercel.

A member of the Team first needs to authorize it.

@vercel

vercel Bot commented Sep 26, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
bootanimdeck Ready Ready Preview Sep 26, 2026 5:45am UTC

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot review overview

🟡 Changes recommended

MIME validation and drag-leave handling need correction.

Review effort: Lite
Findings: 1 Medium severity · 1 Low severity

Open (2)
What changed in this PR

Adds drag-and-drop support for MP4/WebM video imports in the Video to Boot Animation workflow.

Changes:

  • Extracts shared file-processing logic.
  • Adds drop handling and active drag feedback.
  • Connects dropped files to the existing importer.
File Description
src/​app/​video-to-bootanimation/​page.tsx Wires dropped files into video processing.
src/​app/​video-to-bootanimation/​components/​VideoDropZone.tsx Implements drag/drop behavior, validation, and visual feedback.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

setIsDragging(false);

const droppedFile = e.dataTransfer.files?.[0];
if (droppedFile && (droppedFile.type.includes("video") || droppedFile.name.match(/\.(mp4|webm)$/i))) {
Comment on lines +26 to +30
const handleDragLeave = (e: React.DragEvent<HTMLDivElement>) => {
e.preventDefault();
e.stopPropagation();
setIsDragging(false);
};
@Mr-Hasan-Hamid
Mr-Hasan-Hamid merged commit 08cfcce into Mr-Hasan-Hamid:main Sep 26, 2026
3 checks passed

This branch was successfully deployed

1 active deployment
Preview — 08b14cfb Deployed Sep 26, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants