Feat: Add Upload Audio Feature with Stop Transcription Option

Issue Description

Implement an audio file upload feature that allows users to upload supported audio files for transcription. While transcription is running, show a Stop button so users can cancel the process immediately.

Problem Statement

Currently, users may not have a complete upload-based transcription workflow, and there is no clear way to stop transcription once processing starts. This can lead to long waits, accidental uploads, or unnecessary resource usage.

Expected Behavior

Upload Feature

Users should be able to:

• Click an upload button or drag-and-drop a file
• Select supported audio formats
• Start transcription using the existing ASR pipeline

Stop Feature

When transcription starts:

• Replace Transcribe/Start button with Stop
• Allow users to stop processing instantly
• Prevent more transcript text from appending after stop
• Return UI to ready state

Supported File Types

• MP3
• WAV
• M4A
• WebM
• MP4

Scope of Work

Upload Flow

• Add upload button / drag-drop area
• Validate file type
• Validate file size
• Read and decode audio
• Send audio to ASR worker/model

Stop Flow

• Add isTranscribing state
• Show Stop button during active transcription
• Cancel worker/model inference
• Reset loader/progress state

UI States

1. Default: Upload Audio

2. File Selected: Ready to Transcribe

3. Processing: Transcribing...

4. Active Button: Stop

5. Stopped: Ready Again

6. Error: Invalid file / Failed to process

Acceptance Criteria

• User can upload supported audio files
• Transcription starts successfully
• Stop button appears during processing
• Clicking Stop halts transcription immediately
• No further text appears after stopping
• Existing transcript remains visible
• UI resets correctly
• Existing microphone/VAD features remain unaffected

Technical Notes

Suggested logic:

if (isTranscribing) {
  showStopButton();
} else {
  showUploadAndTranscribe();
}

onStop() {
  worker.terminate();
  setIsTranscribing(false);
}

Priority

High

Labels

enhancement, frontend, upload, transcription, ux