feat: Add Clear Button to Reset Video Editor State

[CodeSrushti-3105]

Description

Problem

Currently, after uploading a video in the editor, users only have the option to change the selected video file. There is no way to completely remove the uploaded video and reset the editor state without refreshing the page manually.

This creates a poor user experience because users cannot easily:

• Remove an uploaded video
• Reset editing settings
• Clear export results/errors
• Start fresh with a clean editor state

---

Current Behavior

• Users can upload a video
• Users can change the uploaded video
• No option exists to fully clear/reset the editor
• Users may need to refresh the page manually to reset everything

---

Expected Behavior

Users should be able to completely clear the uploaded video and reset the editor state using a dedicated "Clear" button.

The reset action should:

• Remove the uploaded video
• Reset editor settings to default
• Clear export results/errors
• Restore the editor to its initial state

---

Proposed Solution

Enhance the upload section UI by adding a "Clear" button next to the existing "Change" button.

Implementation should include:

• Passing the existing reset() function to the upload component
• Adding a clear/reset button in the upload UI
• Providing visual distinction for the destructive action
• Adding proper accessibility labels

---

Files to Modify

• FileUpload.tsx
  • Add Clear button UI
  • Accept onClear prop
• VideoEditor.tsx
  • Pass reset() function to FileUpload

---

Acceptance Criteria

• Users can remove uploaded videos without refreshing the page
• Editor state resets completely after clicking Clear
• Clear button is visually distinguishable
• Existing upload/change functionality continues working
• UI remains responsive and accessible

[github-actions]

👋 Thanks for opening an issue, @CodeSrushti-3105!

Our maintainers will review this shortly 🚀

Before you start working

• 📖 Read the CONTRIBUTING.md guide
• 💬 Wait for a maintainer to assign you the issue before starting work
• 🔍 Search for existing issues to avoid duplicates

For GSSoC'26 contributors

If you're contributing under GirlScript Summer of Code 2026, please mention it in your comment when requesting assignment:

"I'd like to work on this — contributing under GSSoC'26"

Architecture notes

Reframe is a static Next.js app with output: "export". Key points:

• All video processing uses FFmpeg.wasm (client-side, no server)
• headers() in next.config.ts won't work — use vercel.json instead
• not-found.tsx requires public/404.html + vercel.json routes config

Happy contributing! ⭐ Star the repo if you find it useful!

[CodeSrushti-3105]

Hi,
I would like to work on this issue under GSSOC'26. Please assign it to me.

[Charan-Mugada]

/assign

[github-actions]

Hey @Charan-Mugada, this issue has been assigned to you! 🎉 Please make progress within 5 days or it will be automatically unassigned due to inactivity.

[SRV-KILLER09]

Hii @Charan-Mugada @CodeSrushti-3105, I guess we already have "Reset All Settings" Feature in the website, so I don't think there's any need of this PR.