Fix audio playback for newly uploaded files by using dynamic API route

app/api/admin/daily-puzzles/route.ts

@@ -38,7 +38,7 @@ export async function GET() {
                 title: puzzle.song.title,
                 artist: puzzle.song.artist,
                 filename: puzzle.song.filename,
-                audioUrl: `/uploads/${puzzle.song.filename}`
+                audioUrl: `/api/audio/${puzzle.song.filename}`
             }
         }));
 

app/api/audio/[filename]/route.ts

@@ -0,0 +1,35 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { readFile, stat } from 'fs/promises';
+import path from 'path';
+
+export async function GET(
+    request: NextRequest,
+    { params }: { params: Promise<{ filename: string }> }
+) {
+    try {
+        const { filename } = await params;
+        const filePath = path.join(process.cwd(), 'public/uploads', filename);
+
+        // Check if file exists
+        try {
+            await stat(filePath);
+        } catch {
+            return new NextResponse('File not found', { status: 404 });
+        }
+
+        // Read file
+        const fileBuffer = await readFile(filePath);
+
+        // Return with proper headers
+        return new NextResponse(fileBuffer, {
+            headers: {
+                'Content-Type': 'audio/mpeg',
+                'Accept-Ranges': 'bytes',
+                'Cache-Control': 'public, max-age=3600, must-revalidate',
+            },
+        });
+    } catch (error) {
+        console.error('Error serving audio file:', error);
+        return new NextResponse('Internal Server Error', { status: 500 });
+    }
+}