Back
{#if imageError || !artist.image}
{:else}
{/if}
{artist.name}
{#if bioText}
{@html bioText}
{#if isBioTruncated || bioExpanded}
bioExpanded = !bioExpanded}> {#if bioExpanded}
Show less
{:else}
Read more
{/if}
{/if} {#if artist.biography?.source}
Source: {artist.biography.source}
{/if}
{/if} {#if similarArtistsLoading}
Loading similar artists...
{:else if similarArtists.length > 0}
SIMILAR ARTISTS
{#each similarArtists as similar, index} {#if index > 0}
•
{/if}
onTrackGoToArtist?.(similar.id)} title={similar.name} > {similar.name}
{/each}
{/if}
{#if isFavorite}
{:else}
{/if}
{#if isRadioLoading && radioLoadingMessage} {#key radioLoadingMessage}
{radioLoadingMessage}
{/key} {/if}
{#if showJumpNav}
Jump to
{#each jumpSections as section}
scrollToSection(section.el, section.id)} > {section.label}
{/each}
{#if searchOpen}
{ if (e.key === 'Escape') toggleSearch(); else if (e.key === 'Enter') { e.preventDefault(); if (e.shiftKey) prevResult(); else nextResult(); } }} />
{#if searchQuery}
{#if totalFilteredResults === 0} 0/0 {:else} {currentSearchIndex + 1}/{totalFilteredResults} {/if}
{/if}
{:else}
{/if}
{/if} {#if topTracks.length > 0 || tracksLoading}
Popular Tracks
{#if topTracks.length > 0}
showTracksContextMenu = !showTracksContextMenu} title="More options" >
{#if showTracksContextMenu}
showTracksContextMenu = false} role="presentation">
{ handlePlayAllTracksNext(); showTracksContextMenu = false; }}> Play Next
{ handlePlayAllTracksLater(); showTracksContextMenu = false; }}> Play Later
{ handleShuffleAllTracks(); showTracksContextMenu = false; }}> Shuffle
{ handleAddAllTracksToPlaylist(); showTracksContextMenu = false; }}> Add to Playlist
{/if}
{/if}
{#if tracksLoading}
Loading tracks...
{:else}
{#each visibleTracks as track, index} {@const isActiveTrack = isPlaybackActive && activeTrackId === track.id}
handleTrackPlay(track, index)} onkeydown={(e) => e.key === 'Enter' && handleTrackPlay(track, index)} >
{index + 1}
{#if track.album?.image?.thumbnail || track.album?.image?.small}
{/if}
{ if (isActiveTrack) { handlePausePlayback(event); } else { event.stopPropagation(); handleTrackPlay(track, index); } }} aria-label={isActiveTrack ? 'Pause track' : 'Play track'} >
{track.title}
{#if track.album?.id && onTrackGoToAlbum}
{ event.stopPropagation(); onTrackGoToAlbum?.(track.album!.id); }} > {track.album?.title || ''}
{:else}
{track.album?.title || ''}
{/if}
{formatDuration(track.duration)}
handleTrackPlay(track, index)} onPlayNext={onTrackPlayNext ? () => onTrackPlayNext(track) : undefined} onPlayLater={onTrackPlayLater ? () => onTrackPlayLater(track) : undefined} onCreateRadio={() => createTrackRadio(track)} onAddFavorite={onTrackAddFavorite ? () => onTrackAddFavorite(track.id) : undefined} onAddToPlaylist={onTrackAddToPlaylist ? () => onTrackAddToPlaylist(track.id) : undefined} onShareQobuz={onTrackShareQobuz ? () => onTrackShareQobuz(track.id) : undefined} onShareSonglink={onTrackShareSonglink ? () => onTrackShareSonglink(track) : undefined} onGoToAlbum={track.album?.id && onTrackGoToAlbum ? () => onTrackGoToAlbum(track.album!.id) : undefined} />
{/each}
{#if canLoadMoreTracks}
Load More
{/if} {/if}
{/if}
Discography
{#if artist.albums.length > 0}
{artist.albums.length}
{/if}
(showAlbumSortMenu = !showAlbumSortMenu)}>
{#if albumSortMode === 'default'}Sort: Default {:else if albumSortMode === 'newest'}Sort: Newest {:else if albumSortMode === 'oldest'}Sort: Oldest {:else if albumSortMode === 'title-asc'}Sort: A-Z {:else if albumSortMode === 'title-desc'}Sort: Z-A {/if}
{#if showAlbumSortMenu}
{ albumSortMode = 'default'; showAlbumSortMenu = false; }} > Default
{ albumSortMode = 'newest'; showAlbumSortMenu = false; }} > Newest First
{ albumSortMode = 'oldest'; showAlbumSortMenu = false; }} > Oldest First
{ albumSortMode = 'title-asc'; showAlbumSortMenu = false; }} > Title (A-Z)
{ albumSortMode = 'title-desc'; showAlbumSortMenu = false; }} > Title (Z-A)
{/if}
{#if artist.albums.length === 0}
No albums found
{:else}
{#each filteredAlbums as album}
onAlbumPlay(album.id) : undefined} onPlayNext={onAlbumPlayNext ? () => onAlbumPlayNext(album.id) : undefined} onPlayLater={onAlbumPlayLater ? () => onAlbumPlayLater(album.id) : undefined} onAddAlbumToPlaylist={onAddAlbumToPlaylist ? () => onAddAlbumToPlaylist(album.id) : undefined} onShareQobuz={onAlbumShareQobuz ? () => onAlbumShareQobuz(album.id) : undefined} onShareSonglink={onAlbumShareSonglink ? () => onAlbumShareSonglink(album.id) : undefined} onDownload={onAlbumDownload ? () => onAlbumDownload(album.id) : undefined} isAlbumFullyDownloaded={isAlbumDownloaded(album.id)} onOpenContainingFolder={onOpenAlbumFolder ? () => onOpenAlbumFolder(album.id) : undefined} onReDownloadAlbum={onReDownloadAlbum ? () => onReDownloadAlbum(album.id) : undefined} {downloadStateVersion} onclick={() => { onAlbumClick?.(album.id); loadAlbumDownloadStatus(album.id); }} /> {/each}
{/if}
{#if artist.epsSingles.length > 0}
EPs & Singles
{artist.epsSingles.length}
(showEpsSinglesSortMenu = !showEpsSinglesSortMenu)}>
{#if epsSinglesSortMode === 'default'}Sort: Default {:else if epsSinglesSortMode === 'newest'}Sort: Newest {:else if epsSinglesSortMode === 'oldest'}Sort: Oldest {:else if epsSinglesSortMode === 'title-asc'}Sort: A-Z {:else if epsSinglesSortMode === 'title-desc'}Sort: Z-A {/if}
{#if showEpsSinglesSortMenu}
{ epsSinglesSortMode = 'default'; showEpsSinglesSortMenu = false; }}>Default
{ epsSinglesSortMode = 'newest'; showEpsSinglesSortMenu = false; }}>Newest First
{ epsSinglesSortMode = 'oldest'; showEpsSinglesSortMenu = false; }}>Oldest First
{ epsSinglesSortMode = 'title-asc'; showEpsSinglesSortMenu = false; }}>Title (A-Z)
{ epsSinglesSortMode = 'title-desc'; showEpsSinglesSortMenu = false; }}>Title (Z-A)
{/if}
{#each filteredEpsSingles as album}
onAlbumPlay(album.id) : undefined} onPlayNext={onAlbumPlayNext ? () => onAlbumPlayNext(album.id) : undefined} onPlayLater={onAlbumPlayLater ? () => onAlbumPlayLater(album.id) : undefined} onAddAlbumToPlaylist={onAddAlbumToPlaylist ? () => onAddAlbumToPlaylist(album.id) : undefined} onShareQobuz={onAlbumShareQobuz ? () => onAlbumShareQobuz(album.id) : undefined} onShareSonglink={onAlbumShareSonglink ? () => onAlbumShareSonglink(album.id) : undefined} onDownload={onAlbumDownload ? () => onAlbumDownload(album.id) : undefined} isAlbumFullyDownloaded={isAlbumDownloaded(album.id)} onOpenContainingFolder={onOpenAlbumFolder ? () => onOpenAlbumFolder(album.id) : undefined} onReDownloadAlbum={onReDownloadAlbum ? () => onReDownloadAlbum(album.id) : undefined} {downloadStateVersion} onclick={() => { onAlbumClick?.(album.id); loadAlbumDownloadStatus(album.id); }} /> {/each}
{/if} {#if artist.liveAlbums.length > 0}
Live Albums
{artist.liveAlbums.length}
(showLiveAlbumsSortMenu = !showLiveAlbumsSortMenu)}>
{#if liveAlbumsSortMode === 'default'}Sort: Default {:else if liveAlbumsSortMode === 'newest'}Sort: Newest {:else if liveAlbumsSortMode === 'oldest'}Sort: Oldest {:else if liveAlbumsSortMode === 'title-asc'}Sort: A-Z {:else if liveAlbumsSortMode === 'title-desc'}Sort: Z-A {/if}
{#if showLiveAlbumsSortMenu}
{ liveAlbumsSortMode = 'default'; showLiveAlbumsSortMenu = false; }}>Default
{ liveAlbumsSortMode = 'newest'; showLiveAlbumsSortMenu = false; }}>Newest First
{ liveAlbumsSortMode = 'oldest'; showLiveAlbumsSortMenu = false; }}>Oldest First
{ liveAlbumsSortMode = 'title-asc'; showLiveAlbumsSortMenu = false; }}>Title (A-Z)
{ liveAlbumsSortMode = 'title-desc'; showLiveAlbumsSortMenu = false; }}>Title (Z-A)
{/if}
{#each filteredLiveAlbums as album}
onAlbumPlay(album.id) : undefined} onPlayNext={onAlbumPlayNext ? () => onAlbumPlayNext(album.id) : undefined} onPlayLater={onAlbumPlayLater ? () => onAlbumPlayLater(album.id) : undefined} onAddAlbumToPlaylist={onAddAlbumToPlaylist ? () => onAddAlbumToPlaylist(album.id) : undefined} onShareQobuz={onAlbumShareQobuz ? () => onAlbumShareQobuz(album.id) : undefined} onShareSonglink={onAlbumShareSonglink ? () => onAlbumShareSonglink(album.id) : undefined} onDownload={onAlbumDownload ? () => onAlbumDownload(album.id) : undefined} isAlbumFullyDownloaded={isAlbumDownloaded(album.id)} onOpenContainingFolder={onOpenAlbumFolder ? () => onOpenAlbumFolder(album.id) : undefined} onReDownloadAlbum={onReDownloadAlbum ? () => onReDownloadAlbum(album.id) : undefined} {downloadStateVersion} onclick={() => { onAlbumClick?.(album.id); loadAlbumDownloadStatus(album.id); }} /> {/each}
{/if} {#if artist.compilations.length > 0}
Compilations
{artist.compilations.length}
(showCompilationsSortMenu = !showCompilationsSortMenu)}>
{#if compilationsSortMode === 'default'}Sort: Default {:else if compilationsSortMode === 'newest'}Sort: Newest {:else if compilationsSortMode === 'oldest'}Sort: Oldest {:else if compilationsSortMode === 'title-asc'}Sort: A-Z {:else if compilationsSortMode === 'title-desc'}Sort: Z-A {/if}
{#if showCompilationsSortMenu}
{ compilationsSortMode = 'default'; showCompilationsSortMenu = false; }}>Default
{ compilationsSortMode = 'newest'; showCompilationsSortMenu = false; }}>Newest First
{ compilationsSortMode = 'oldest'; showCompilationsSortMenu = false; }}>Oldest First
{ compilationsSortMode = 'title-asc'; showCompilationsSortMenu = false; }}>Title (A-Z)
{ compilationsSortMode = 'title-desc'; showCompilationsSortMenu = false; }}>Title (Z-A)
{/if}
{#each filteredCompilations as album}
onAlbumPlay(album.id) : undefined} onPlayNext={onAlbumPlayNext ? () => onAlbumPlayNext(album.id) : undefined} onPlayLater={onAlbumPlayLater ? () => onAlbumPlayLater(album.id) : undefined} onAddAlbumToPlaylist={onAddAlbumToPlaylist ? () => onAddAlbumToPlaylist(album.id) : undefined} onShareQobuz={onAlbumShareQobuz ? () => onAlbumShareQobuz(album.id) : undefined} onShareSonglink={onAlbumShareSonglink ? () => onAlbumShareSonglink(album.id) : undefined} onDownload={onAlbumDownload ? () => onAlbumDownload(album.id) : undefined} isAlbumFullyDownloaded={isAlbumDownloaded(album.id)} onOpenContainingFolder={onOpenAlbumFolder ? () => onOpenAlbumFolder(album.id) : undefined} onReDownloadAlbum={onReDownloadAlbum ? () => onReDownloadAlbum(album.id) : undefined} {downloadStateVersion} onclick={() => { onAlbumClick?.(album.id); loadAlbumDownloadStatus(album.id); }} /> {/each}
{/if} {#if artist.others.length > 0}
Others
{artist.others.length}
(showOthersSortMenu = !showOthersSortMenu)}>
{#if othersSortMode === 'default'}Sort: Default {:else if othersSortMode === 'newest'}Sort: Newest {:else if othersSortMode === 'oldest'}Sort: Oldest {:else if othersSortMode === 'title-asc'}Sort: A-Z {:else if othersSortMode === 'title-desc'}Sort: Z-A {/if}
{#if showOthersSortMenu}
{ othersSortMode = 'default'; showOthersSortMenu = false; }}>Default
{ othersSortMode = 'newest'; showOthersSortMenu = false; }}>Newest First
{ othersSortMode = 'oldest'; showOthersSortMenu = false; }}>Oldest First
{ othersSortMode = 'title-asc'; showOthersSortMenu = false; }}>Title (A-Z)
{ othersSortMode = 'title-desc'; showOthersSortMenu = false; }}>Title (Z-A)
{/if}
{#each filteredOthers as album}
onAlbumPlay(album.id) : undefined} onPlayNext={onAlbumPlayNext ? () => onAlbumPlayNext(album.id) : undefined} onPlayLater={onAlbumPlayLater ? () => onAlbumPlayLater(album.id) : undefined} onAddAlbumToPlaylist={onAddAlbumToPlaylist ? () => onAddAlbumToPlaylist(album.id) : undefined} onShareQobuz={onAlbumShareQobuz ? () => onAlbumShareQobuz(album.id) : undefined} onShareSonglink={onAlbumShareSonglink ? () => onAlbumShareSonglink(album.id) : undefined} onDownload={onAlbumDownload ? () => onAlbumDownload(album.id) : undefined} isAlbumFullyDownloaded={isAlbumDownloaded(album.id)} onOpenContainingFolder={onOpenAlbumFolder ? () => onOpenAlbumFolder(album.id) : undefined} onReDownloadAlbum={onReDownloadAlbum ? () => onReDownloadAlbum(album.id) : undefined} {downloadStateVersion} onclick={() => { onAlbumClick?.(album.id); loadAlbumDownloadStatus(album.id); }} /> {/each}
{/if} {#if artist.playlists.length > 0}
Playlists
{artist.playlists.length}
{#each filteredPlaylists as playlist}
onPlaylistClick?.(playlist.id)} disabled={!onPlaylistClick} >
{#if playlist.artwork}
{/if}
{playlist.title}
{#if playlist.trackCount} {playlist.trackCount} tracks {:else} Playlist {/if} {#if playlist.owner} · {playlist.owner} {/if}
{/each}
{/if} {#if artist.tributes.length > 0}
Tributes & Covers
{artist.tributes.length}
(tributesExpanded = !tributesExpanded)} title={tributesExpanded ? 'Collapse' : 'Expand'}> {#if tributesExpanded}
{:else}
{/if}
{#if tributesExpanded}
(showTributesSortMenu = !showTributesSortMenu)}>
{#if tributesSortMode === 'default'}Sort: Default {:else if tributesSortMode === 'newest'}Sort: Newest {:else if tributesSortMode === 'oldest'}Sort: Oldest {:else if tributesSortMode === 'title-asc'}Sort: A-Z {:else if tributesSortMode === 'title-desc'}Sort: Z-A {/if}
{#if showTributesSortMenu}
{ tributesSortMode = 'default'; showTributesSortMenu = false; }}>Default
{ tributesSortMode = 'newest'; showTributesSortMenu = false; }}>Newest First
{ tributesSortMode = 'oldest'; showTributesSortMenu = false; }}>Oldest First
{ tributesSortMode = 'title-asc'; showTributesSortMenu = false; }}>Title (A-Z)
{ tributesSortMode = 'title-desc'; showTributesSortMenu = false; }}>Title (Z-A)
{/if}
{/if}
{#if tributesExpanded}
{#each visibleTributes as album}
onAlbumPlay(album.id) : undefined} onPlayNext={onAlbumPlayNext ? () => onAlbumPlayNext(album.id) : undefined} onPlayLater={onAlbumPlayLater ? () => onAlbumPlayLater(album.id) : undefined} onAddAlbumToPlaylist={onAddAlbumToPlaylist ? () => onAddAlbumToPlaylist(album.id) : undefined} onShareQobuz={onAlbumShareQobuz ? () => onAlbumShareQobuz(album.id) : undefined} onShareSonglink={onAlbumShareSonglink ? () => onAlbumShareSonglink(album.id) : undefined} onDownload={onAlbumDownload ? () => onAlbumDownload(album.id) : undefined} isAlbumFullyDownloaded={isAlbumDownloaded(album.id)} onOpenContainingFolder={onOpenAlbumFolder ? () => onOpenAlbumFolder(album.id) : undefined} onReDownloadAlbum={onReDownloadAlbum ? () => onReDownloadAlbum(album.id) : undefined} {downloadStateVersion} onclick={() => { onAlbumClick?.(album.id); loadAlbumDownloadStatus(album.id); }} /> {/each}
{#if canLoadMoreTributes}
(tributesVisibleCount += 20)}> Load More ({filteredTributes.length - tributesVisibleCount} remaining)
{/if} {/if}
{/if}