From b07685fe791c33328447020c69e42bc12bb85cbb Mon Sep 17 00:00:00 2001 From: sillyangel Date: Sun, 22 Jun 2025 21:10:15 -0500 Subject: [PATCH] feat: add API availability checks and fallback for cover art in various components --- app/album/[id]/page.tsx | 9 ++++++--- app/artist/[artist]/page.tsx | 3 +-- app/browse/page.tsx | 6 +++++- app/components/album-artwork.tsx | 3 +-- app/components/artist-icon.tsx | 3 +-- app/library/playlists/page.tsx | 5 ++--- app/library/songs/page.tsx | 17 ++++++++++++----- app/playlist/[id]/page.tsx | 26 +++++++++++++++++--------- app/radio/page.tsx | 17 +++++++++++------ app/search/page.tsx | 17 ++++++++++++----- package.json | 1 + pnpm-lock.yaml | 9 +++++++++ 12 files changed, 78 insertions(+), 38 deletions(-) diff --git a/app/album/[id]/page.tsx b/app/album/[id]/page.tsx index 238ff00..9a30334 100644 --- a/app/album/[id]/page.tsx +++ b/app/album/[id]/page.tsx @@ -80,8 +80,12 @@ export default function AlbumPage() { console.error('Failed to play album from track:', error); } }; - const handleAddToQueue = (song: Song) => { + if (!api) { + console.error('Navidrome API not available'); + return; + } + const track = { id: song.id, name: song.title, @@ -106,9 +110,8 @@ export default function AlbumPage() { const seconds = duration % 60; return `${minutes}:${seconds.toString().padStart(2, '0')}`; }; - // Get cover art URL with proper fallback - const coverArtUrl = album.coverArt + const coverArtUrl = album.coverArt && api ? api.getCoverArtUrl(album.coverArt, 300) : '/default-user.jpg'; diff --git a/app/artist/[artist]/page.tsx b/app/artist/[artist]/page.tsx index c475db9..eaa771b 100644 --- a/app/artist/[artist]/page.tsx +++ b/app/artist/[artist]/page.tsx @@ -89,9 +89,8 @@ export default function ArtistPage() { ); } - // Get artist image URL with proper fallback - const artistImageUrl = artist.coverArt + const artistImageUrl = artist.coverArt && api ? api.getCoverArtUrl(artist.coverArt, 300) : '/default-user.jpg'; diff --git a/app/browse/page.tsx b/app/browse/page.tsx index 5ccbebb..3f26460 100644 --- a/app/browse/page.tsx +++ b/app/browse/page.tsx @@ -24,8 +24,12 @@ export default function BrowsePage() { const albumsPerPage = 84; const api = getNavidromeAPI(); - const loadAlbums = async (page: number, append: boolean = false) => { + if (!api) { + console.error('Navidrome API not available'); + return; + } + try { setIsLoadingAlbums(true); const offset = page * albumsPerPage; diff --git a/app/components/album-artwork.tsx b/app/components/album-artwork.tsx index 51ab653..8b3e2d4 100644 --- a/app/components/album-artwork.tsx +++ b/app/components/album-artwork.tsx @@ -57,9 +57,8 @@ export function AlbumArtwork({ starItem(album.id, 'album'); } }; - // Get cover art URL with proper fallback - const coverArtUrl = album.coverArt + const coverArtUrl = album.coverArt && api ? api.getCoverArtUrl(album.coverArt, 300) : '/default-user.jpg'; diff --git a/app/components/artist-icon.tsx b/app/components/artist-icon.tsx index 04370a1..c9431ef 100644 --- a/app/components/artist-icon.tsx +++ b/app/components/artist-icon.tsx @@ -52,9 +52,8 @@ export function ArtistIcon({ starItem(artist.id, 'artist'); } }; - // Get cover art URL with proper fallback - const artistImageUrl = artist.coverArt + const artistImageUrl = artist.coverArt && api ? api.getCoverArtUrl(artist.coverArt, 200) : '/default-user.jpg'; diff --git a/app/library/playlists/page.tsx b/app/library/playlists/page.tsx index 6d3e0cf..2308bac 100644 --- a/app/library/playlists/page.tsx +++ b/app/library/playlists/page.tsx @@ -51,9 +51,8 @@ const PlaylistsPage: React.FC = () => {
-
- {playlists.map((playlist) => { - const playlistCoverUrl = playlist.coverArt +
{playlists.map((playlist) => { + const playlistCoverUrl = playlist.coverArt && api ? api.getCoverArtUrl(playlist.coverArt, 200) : '/default-user.jpg'; diff --git a/app/library/songs/page.tsx b/app/library/songs/page.tsx index 4449648..981f3a0 100644 --- a/app/library/songs/page.tsx +++ b/app/library/songs/page.tsx @@ -101,8 +101,12 @@ export default function SongsPage() { setFilteredSongs(filtered); }, [songs, searchQuery, sortBy, sortDirection]); - const handlePlaySong = (song: Song) => { + if (!api) { + console.error('Navidrome API not available'); + return; + } + const track = { id: song.id, name: song.title, @@ -117,8 +121,12 @@ export default function SongsPage() { playTrack(track); }; - const handleAddToQueue = (song: Song) => { + if (!api) { + console.error('Navidrome API not available'); + return; + } + const track = { id: song.id, name: song.title, @@ -229,9 +237,8 @@ export default function SongsPage() {
{/* Album Art */} -
- {song.album} { + 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() {
); } - // 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() {
{/* Album Art */} -
- {song.album} { }); const { toast } = useToast(); const { playTrack } = useAudioPlayer(); - const loadRadioStations = useCallback(async () => { setIsLoading(true); try { const api = getNavidromeAPI(); + if (!api) { + throw new Error('Navidrome API not available'); + } const stationList = await api.getInternetRadioStations(); setStations(stationList); } catch (error) { @@ -53,10 +55,11 @@ const RadioStationsPage = () => { variant: "destructive" }); return; - } - - try { + } try { const api = getNavidromeAPI(); + if (!api) { + throw new Error('Navidrome API not available'); + } await api.createInternetRadioStation( newStation.name, newStation.streamUrl, @@ -81,9 +84,11 @@ const RadioStationsPage = () => { } }; - const deleteRadioStation = async (stationId: string) => { - try { + const deleteRadioStation = async (stationId: string) => { try { const api = getNavidromeAPI(); + if (!api) { + throw new Error('Navidrome API not available'); + } await api.deleteInternetRadioStation(stationId); toast({ diff --git a/app/search/page.tsx b/app/search/page.tsx index c918c6f..76f6809 100644 --- a/app/search/page.tsx +++ b/app/search/page.tsx @@ -51,8 +51,12 @@ export default function SearchPage() { return () => clearTimeout(timeoutId); // eslint-disable-next-line react-hooks/exhaustive-deps }, [searchQuery]); - const handlePlaySong = (song: Song) => { + if (!api) { + console.error('Navidrome API not available'); + return; + } + const track = { id: song.id, name: song.title, @@ -67,8 +71,12 @@ export default function SearchPage() { playTrack(track); }; - const handleAddToQueue = (song: Song) => { + if (!api) { + console.error('Navidrome API not available'); + return; + } + const track = { id: song.id, name: song.title, @@ -182,9 +190,8 @@ export default function SearchPage() {
{/* Song Cover */} -
- {song.album}=20'} + preact@10.26.9: resolution: {integrity: sha512-SSjF9vcnF27mJK1XyFMNJzFd5u3pQiATFqoaDy03XuN00u4ziveVVEGt5RKJrDR8MHE/wJo9Nnad56RLzS2RMA==} @@ -4391,6 +4398,8 @@ snapshots: preact: 10.26.9 web-vitals: 4.2.4 + posthog-node@5.1.1: {} + preact@10.26.9: {} prelude-ls@1.2.1: {}