feat: add API availability checks and fallback for cover art in various components

This commit is contained in:
2025-06-22 21:10:15 -05:00
parent 6fcf58e7ba
commit b07685fe79
12 changed files with 78 additions and 38 deletions

View File

@@ -44,8 +44,12 @@ export default function PlaylistPage() {
fetchPlaylist();
}
}, [id, getPlaylist]);
const handlePlayClick = (song: Song) => {
if (!api) {
console.error('Navidrome API not available');
return;
}
const track = {
id: song.id,
name: song.title,
@@ -59,8 +63,12 @@ export default function PlaylistPage() {
};
playTrack(track);
};
const handleAddToQueue = (song: Song) => {
if (!api) {
console.error('Navidrome API not available');
return;
}
const track = {
id: song.id,
name: song.title,
@@ -74,9 +82,11 @@ export default function PlaylistPage() {
};
addToQueue(track);
};
const handlePlayPlaylist = () => {
if (tracklist.length === 0) return;
if (tracklist.length === 0 || !api) {
if (!api) console.error('Navidrome API not available');
return;
}
// Convert all songs to tracks
const tracks = tracklist.map(song => ({
@@ -125,9 +135,8 @@ export default function PlaylistPage() {
</div>
);
}
// Get playlist cover art URL with fallback
const playlistCoverUrl = playlist.coverArt
const playlistCoverUrl = playlist.coverArt && api
? api.getCoverArtUrl(playlist.coverArt, 300)
: '/default-user.jpg';
@@ -196,9 +205,8 @@ export default function PlaylistPage() {
</div>
{/* Album Art */}
<div className="w-12 h-12 mr-4 flex-shrink-0">
<Image
src={song.coverArt ? api.getCoverArtUrl(song.coverArt, 100) : '/default-user.jpg'}
<div className="w-12 h-12 mr-4 flex-shrink-0"> <Image
src={song.coverArt && api ? api.getCoverArtUrl(song.coverArt, 100) : '/default-user.jpg'}
alt={song.album}
width={48}
height={48}