Force MP3 download

server/reflector/views/transcripts.py

@@ -13,6 +13,7 @@ from fastapi import (
     WebSocket,
     WebSocketDisconnect,
 )
+from fastapi.responses import FileResponse
 from fastapi_pagination import Page, paginate
 from pydantic import BaseModel, Field
 from reflector.db import database, transcripts
@@ -21,7 +22,6 @@ from reflector.settings import settings
 from reflector.utils.audio_waveform import get_audio_waveform
 from starlette.concurrency import run_in_threadpool
 
-from ._range_requests_response import range_requests_response
 from .rtc_offer import PipelineEvent, RtcOffer, rtc_offer_base
 
 router = APIRouter()
@@ -356,10 +356,13 @@ async def transcript_get_audio_mp3(
     if not transcript.audio_mp3_filename.exists():
         raise HTTPException(status_code=404, detail="Audio not found")
 
-    return range_requests_response(
+    truncated_id = str(transcript.id).split("-")[0]
-        request,
+    filename = f"recording_{truncated_id}.mp3"
+
+    return FileResponse(
         transcript.audio_mp3_filename,
-        content_type="audio/mp3",
+        headers={"Content-Disposition": f"attachment; filename={filename}"},
+        media_type="audio/mpeg",
     )
 
 

www/app/transcripts/recorder.tsx

@@ -311,6 +311,9 @@ export default function Recorder(props: RecorderProps) {
             <a
               title="Download recording"
               className="text-center cursor-pointer text-blue-400 hover:text-blue-700 ml-2 md:ml:4 p-2 rounded-lg outline-blue-400"
+              download={`recording-${
+                props.transcriptId?.split("-")[0] || "0000"
+              }`}
               href={`${process.env.NEXT_PUBLIC_API_URL}/v1/transcripts/${props.transcriptId}/audio/mp3`}
             >
               <FontAwesomeIcon icon={faDownload} className="h-5 w-auto" />