{#if isOverlayVisible}
= totalVisibleSections && totalVisibleSections > 0} style="left: {sidebarExpanded ? '280px' : '64px'}">
{$t('home.loading')}
{$t('home.loadingDescription')}
{/if}
{#if homeSettings.greeting.enabled}
{greetingText}
{:else}
{/if}
isSettingsModalOpen = true} title={$t('home.customizeHome')}>
{#if isInitializing && !isOverlayVisible}
{$t('home.loading')}
{$t('home.loadingDescription')}
{:else if error}
{$t('home.loadError')}
{error}
{:else if hasContent} {#each visibleSections as sectionId (sectionId)} {#if sectionId === 'newReleases' && newReleases.length > 0}
{#snippet children()} {#each newReleases 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}
{/snippet}
{/if} {#if sectionId === 'pressAwards' && pressAwards.length > 0}
{#snippet children()} {#each pressAwards 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}
{/snippet}
{/if} {#if sectionId === 'mostStreamed' && mostStreamed.length > 0}
{#snippet children()} {#each mostStreamed 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}
{/snippet}
{/if} {#if sectionId === 'qobuzissimes' && qobuzissimes.length > 0}
{#snippet children()} {#each qobuzissimes 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}
{/snippet}
{/if} {#if sectionId === 'editorPicks' && editorPicks.length > 0}
{#snippet children()} {#each editorPicks 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}
{/snippet}
{/if} {#if sectionId === 'recentAlbums' && recentAlbums.length > 0}
{#snippet children()} {#each recentAlbums 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}
{/snippet}
{/if} {#if sectionId === 'continueTracks' && continueTracks.length > 0}
{$t('home.continueListening')}
{#each continueTracks as track, index (`${track.id}-${downloadStateVersion}`)} {@const isActiveTrack = isPlaybackActive && activeTrackId === track.id} {@const cacheStatus = getTrackOfflineCacheStatus?.(track.id) ?? { status: 'none', progress: 0 }} {@const isTrackDownloaded = cacheStatus.status === 'ready'} {@const trackBlacklisted = track.artistId ? isArtistBlacklisted(track.artistId) : false}
onArtistClick(track.artistId!) : undefined} onAlbumClick={track.albumId && onAlbumClick ? () => onAlbumClick(track.albumId!) : undefined} onPlay={trackBlacklisted ? undefined : () => handleContinueTrackPlay(track, index)} menuActions={trackBlacklisted ? { // Only navigation actions for blacklisted tracks onGoToAlbum: track.albumId && onTrackGoToAlbum ? () => onTrackGoToAlbum(track.albumId!) : undefined, onGoToArtist: track.artistId && onTrackGoToArtist ? () => onTrackGoToArtist(track.artistId!) : undefined, onShowInfo: onTrackShowInfo ? () => onTrackShowInfo(track.id) : undefined } : { onPlayNow: () => handleContinueTrackPlay(track, index), onPlayNext: onTrackPlayNext ? () => onTrackPlayNext(track) : undefined, onPlayLater: onTrackPlayLater ? () => onTrackPlayLater(track) : undefined, onAddToPlaylist: onTrackAddToPlaylist ? () => onTrackAddToPlaylist(track.id) : undefined, onShareQobuz: onTrackShareQobuz ? () => onTrackShareQobuz(track.id) : undefined, onShareSonglink: onTrackShareSonglink ? () => onTrackShareSonglink(track) : undefined, onGoToAlbum: track.albumId && onTrackGoToAlbum ? () => onTrackGoToAlbum(track.albumId!) : undefined, onGoToArtist: track.artistId && onTrackGoToArtist ? () => onTrackGoToArtist(track.artistId!) : undefined, onShowInfo: onTrackShowInfo ? () => onTrackShowInfo(track.id) : undefined, onDownload: onTrackDownload ? () => onTrackDownload(track) : undefined, isTrackDownloaded, onReDownload: isTrackDownloaded && onTrackReDownload ? () => onTrackReDownload(track) : undefined, onRemoveDownload: isTrackDownloaded && onTrackRemoveDownload ? () => onTrackRemoveDownload(track.id) : undefined }} /> {/each}
{/if} {#if sectionId === 'topArtists' && topArtists.length > 0}
{#snippet children()} {#each topArtists as artist}
onArtistClick?.(artist.id)}> {#if failedArtistImages.has(artist.id) || !artist.image}
{:else}
handleArtistImageError(artist.id)} /> {/if}
{artist.name}
{#if artist.playCount}
{$t('home.artistPlays', { values: { count: artist.playCount } })}
{/if}
{/each}
{/snippet}
{/if} {#if sectionId === 'favoriteAlbums' && favoriteAlbums.length > 0}
{#snippet children()} {#each favoriteAlbums 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}
{/snippet}
{/if} {/each} {:else}
{$t('home.startListening')}
{$t('home.startListeningDescription')}
{/if}
isSettingsModalOpen = false} />