convert video > wav to video > m4a AAC

[someoneidoknow]

title
good for the storage of the server!!! (i only barely tested this on my client)

Greptile Summary

• Converts audio extraction functionality from WAV to M4A/AAC format for improved storage efficiency on the server
• Implements complex WebCodecs-based AAC encoding with M4A/MP4 container building and audio buffer normalization
• Updates MediaCardDock.tsx to handle M4A files instead of WAV files for audio splitting functionality

Important Files Changed

Filename	Overview
lib/audioExtraction.ts	Complete rewrite adding ~570 lines of WebCodecs AAC encoding and M4A container building; introduces browser compatibility concerns
app/components/MediaCardDock.tsx	Updates file extension from "_audio.wav" to "_audio.m4a" and MIME type to "audio/mp4"

Confidence score: 3/5

• This PR has moderate risk due to complex codec implementation and browser compatibility concerns
• Score reflects the addition of substantial new encoding logic using WebCodecs API which is not universally supported across browsers, plus minimal testing as noted by the developer
• Pay close attention to lib/audioExtraction.ts for potential runtime failures on unsupported browsers and the WebCodecs fallback logic

Sequence Diagram

sequenceDiagram
    participant User
    participant MediaCardDock
    participant MediaStore
    participant AudioExtraction
    participant WebCodecs
    participant UploadAPI
    participant Database
    participant WebSocket

    User->>MediaCardDock: "Select video file with audio"
    MediaCardDock->>AudioExtraction: "videoHasAudio(file)"
    AudioExtraction->>WebCodecs: "decodeAudioData(arrayBuffer)"
    WebCodecs-->>AudioExtraction: "audioBuffer"
    AudioExtraction-->>MediaCardDock: "true"
    
    MediaCardDock->>MediaStore: "addItem(videoMediaItem)"
    MediaCardDock->>UploadAPI: "upload video file"
    UploadAPI-->>MediaCardDock: "video url and fileId"
    MediaCardDock->>Database: "saveMediaToDatabase(video)"
    Database-->>MediaCardDock: "video dbId"
    MediaCardDock->>WebSocket: "broadcastMediaUploaded(video)"
    
    MediaCardDock->>User: "Show split option toast"
    User->>MediaCardDock: "Click Split button"
    MediaCardDock->>AudioExtraction: "extractAudioFromVideo(file)"
    AudioExtraction->>WebCodecs: "decodeAudioData(arrayBuffer)"
    AudioExtraction->>AudioExtraction: "audioBufferToWav(audioBuffer)"
    AudioExtraction->>WebCodecs: "AudioEncoder.encode(audioData)"
    WebCodecs-->>AudioExtraction: "AAC encoded chunks"
    AudioExtraction->>AudioExtraction: "buildM4aFile(chunks)"
    AudioExtraction-->>MediaCardDock: "m4aBlob"
    
    MediaCardDock->>MediaStore: "addItem(audioMediaItem)"
    MediaCardDock->>UploadAPI: "upload M4A audio file"
    UploadAPI-->>MediaCardDock: "audio url and fileId"
    MediaCardDock->>Database: "saveMediaToDatabase(audio)"
    Database-->>MediaCardDock: "audio dbId"
    MediaCardDock->>WebSocket: "broadcastMediaUploaded(audio)"

Loading

[greptile-apps]

Additional Comments (2)

1. lib/audioExtraction.ts, line 28-31 (link)

   style: Redundant conversion from AudioBuffer to WAV and back to AudioBuffer - the original audioBuffer could be used directly for M4A encoding

   _{Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!}

2. lib/audioExtraction.ts, line 494-495 (link)

   logic: Accessing sampleDurations[0] without checking if array is empty could throw an error

_{2 files reviewed, 2 comments}

_{Edit Code Review Agent Settings | Greptile}

[someoneidoknow]

@face-hh wake up