feat(web): drop hero row + compact Rediscover tiles
test-web / test (push) Successful in 33s

Operator UI review on the merged build:

- Hero row felt 'odd' — operator chose remove-entirely on the
  AskUserQuestion options. The Playlists row already leads with
  For-You and Recently Added leads with the newest album, so the
  hero duplicated both anchors. Pulled HomeHeroCard.svelte + all
  page-level wiring (systemShuffle/getPlaylist imports + playForYou/
  playLatestAlbum handlers) and reverted the within() test scoping
  added in 682d7a5e.

- Rediscover tiles step down to w-32 (albums) / w-28 (artists),
  matching the Most Played CompactTrackCard visual weight on web.
  Reinforces the page hierarchy: fresh content gets real estate,
  throwbacks recede.
This commit is contained in:
2026-06-01 20:34:21 -04:00
parent 682d7a5ec4
commit d43719516e
3 changed files with 10 additions and 171 deletions
+3 -11
View File
@@ -1,5 +1,5 @@
import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest';
import { render, screen, within } from '@testing-library/svelte';
import { render, screen } from '@testing-library/svelte';
import { readable } from 'svelte/store';
import { emptyLikesMock } from '../test-utils/mocks/likes';
import type { Playlist } from '$lib/api/types';
@@ -103,11 +103,7 @@ describe('home Playlists section', () => {
: readable({ data: emptyPlaylistsResponse, isPending: false, isError: false })
);
render(Page);
// For-You renders twice: once in the new hero card at the top of
// Home and once in the Playlists carousel. Scope the assertion
// to the Playlists section to avoid the hero collision.
const playlistsSection = screen.getByLabelText('Playlists');
expect(within(playlistsSection).getByText('For You')).toBeInTheDocument();
expect(screen.getByText('For You')).toBeInTheDocument();
const placeholders = screen.queryAllByTestId('playlist-placeholder-card');
// 1 Discover + 3 Songs-like slots = 4 placeholders alongside the
// real For-You tile.
@@ -147,11 +143,7 @@ describe('home Playlists section', () => {
: readable({ data: emptyPlaylistsResponse, isPending: false, isError: false })
);
render(Page);
// For-You also renders in the hero card; scope to the Playlists
// section. The secondary kinds aren't featured in the hero, so
// their getByText assertions can stay document-scoped.
const playlistsSection = screen.getByLabelText('Playlists');
expect(within(playlistsSection).getByText('For You')).toBeInTheDocument();
expect(screen.getByText('For You')).toBeInTheDocument();
expect(screen.getByText('Deep cuts')).toBeInTheDocument();
expect(screen.getByText('New for you')).toBeInTheDocument();
});