feat(frontend): redesign playlist pages with cover image support

Create and edit playlist modals now upload/preview a cover image
(reusing the presigned-upload flow already used for tracks) and share
identical layout and coloring. Adds a cover proxy route and wires
PlaylistArt to render a playlist's real cover before falling back to
the track mosaic/gradient.

Also reworks the playlist detail page: full-width borderless "Añadir
de tu biblioteca" table with listens count and click-to-play, drops
the empty-playlist placeholder message, and restyles the playlists
grid to match the rest of the app.
This commit is contained in:
2026-07-15 16:10:04 +02:00
parent e98798894e
commit d1cba7b846
6 changed files with 390 additions and 110 deletions
@@ -0,0 +1,25 @@
import type { RequestHandler } from './$types';
import { apiConfig } from '$lib/server/config';
const ALLOWED = new Set(['small', 'medium', 'large']);
export const GET: RequestHandler = async ({ params, url, fetch }) => {
const size = url.searchParams.get('size') ?? 'medium';
const safeSize = ALLOWED.has(size) ? size : 'medium';
const upstream = await fetch(
`${apiConfig.baseUrl}/playlists/${params.id}/cover?size=${safeSize}`
);
if (!upstream.ok) {
return new Response(null, { status: upstream.status });
}
return new Response(upstream.body, {
status: 200,
headers: {
'Content-Type': upstream.headers.get('content-type') ?? 'image/webp',
'Cache-Control': 'public, max-age=86400'
}
});
};