{data.greeting}

Sube lo tuyo, descubre lo nuevo y escúchalo todo en un solo sitio.

{#if spotlight} {/if}

{#await data.listeningStats then stats} {@const statsList = [ { value: stats.tracksThisWeek, label: 'Canciones nuevas escuchadas esta semana' }, { value: fmtDurationLong(Number(stats.secondsThisWeek)), label: 'Tiempo de escucha esta semana' }, { value: stats.streakDays, label: 'Días consecutivos escuchando' } ]}

{#each statsList as stat (stat.label)}

{stat.value}

{stat.label}

{/each}

{/await}

{#if continueItems.length > 0}

{#each continueItems as item, i (item.id)} {@const isCurrent = player.current.id === item.id} playContinue(i)} oncontextmenu={(e) => openContextMenu(e, trackFromQueueItem(item))} active={isCurrent} size="lg" variant="card" title={item.title} subtitle={item.artist} subtitleHref={item.ownerUserId} trackId={item.id} class="animate-enter" style="--i:{i}" /> {/each}

{:else} {@render noListeningHistory()} {/if}

{#if spotlight}

goto(`/playlists/${spotlight.id}`)} class="flex w-fit items-center gap-5 self-start sm:gap-6" >

Playlist destacada

{spotlight.name}

{spotlightMeta}

{spotlight.description || 'Tu colección, siempre a mano.'}

{#each spotlightRows as { track, seconds }, i (track.id)} playSpotlightTrack(i)} active={player.current.id === track.id} size="sm" title={track.title} subtitle={track.artist} subtitleHref={track.ownerUserId} > {#snippet leading()} {i + 1} {/snippet} {#snippet trailing()} {fmtTime(seconds)} {/snippet} {:else}

Esta playlist todavía no tiene canciones.

{/each}

{/if}

{#if mixes.length > 0}

{#each mixes as mix, i (mix.id)} item.trackId)} onPlay={(event) => playMix(mix, event)} index={i} /> {/each}

{:else} {/if}

{#if popularTracks.length > 0}

{#each popularTracks as track, i (track.id)} {@const isCurrent = player.current.id === track.id} playPopular(i)} oncontextmenu={(e) => openContextMenu(e, track)} active={isCurrent} size="sm" title={track.title} subtitle={track.artist} subtitleHref={track.ownerUserId} explicit={track.isExplicit} trackId={track.id} > {#snippet leading()} {#if isCurrent} {:else} {i + 1} {/if} {/snippet} {#snippet trailing()} {fmtPlays(track.listensCount)} {/snippet} {/each}

{:else} {@render noListeningHistory()} {/if}

{#if playlists.length > 0}

{#each playlists as playlist, i (playlist.id)} goto(`/playlists/${playlist.id}`)} size="lg" variant="card" title={playlist.name} subtitle={playlist.description} coverSrc="/api/playlists/{playlist.id}/cover?size=medium&v={encodeURIComponent( playlist.updatedAt )}" trackIds={playlist.coverTrackIds} style="--i:{i}" /> {/each}

{:else} {#snippet actions()} {/snippet} {/if}