feat(web): update nav (Home/Artists/Albums); retire ArtistRow

Add Artists and Albums nav entries, rename root label from Library to
Home. Migrate all three ArtistRow call sites (search, search/artists,
library/liked) to ArtistCard with grid wrapper; delete ArtistRow
component and its test.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web/src/lib/components/ArtistRow.svelte

@@ -1,29 +0,0 @@
-<script lang="ts">
-  import type { ArtistRef } from '$lib/api/types';
-  import LikeButton from './LikeButton.svelte';
-
-  let { artist }: { artist: ArtistRef } = $props();
-
-  const initial = $derived(artist.name ? artist.name.charAt(0).toUpperCase() : '');
-  const countLabel = $derived(artist.album_count === 1 ? '1 album' : `${artist.album_count} albums`);
-</script>
-
-<div class="relative flex items-center gap-3 border-b border-border px-3 py-3 hover:bg-surface-hover">
-  <a
-    href={`/artists/${artist.id}`}
-    class="absolute inset-0 focus-visible:ring-2 focus-visible:ring-accent"
-    aria-label={artist.name}
-  ></a>
-  <span
-    class="flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-surface font-semibold relative"
-    aria-hidden="true"
-  >
-    {initial}
-  </span>
-  <span class="flex-1 truncate relative">{artist.name}</span>
-  <span class="text-sm text-text-secondary relative">{countLabel}</span>
-  <span class="relative">
-    <LikeButton entityType="artist" entityId={artist.id} />
-  </span>
-  <span class="text-text-secondary relative" aria-hidden="true">›</span>
-</div>

web/src/lib/components/ArtistRow.test.ts

@@ -1,45 +0,0 @@
-import { describe, expect, test, vi } from 'vitest';
-import { render, screen } from '@testing-library/svelte';
-import { readable } from 'svelte/store';
-import ArtistRow from './ArtistRow.svelte';
-import type { ArtistRef } from '$lib/api/types';
-
-vi.mock('$lib/api/likes', () => ({
-  createLikedIdsQuery: () => readable({
-    data: { track_ids: [], album_ids: [], artist_ids: [] },
-    isPending: false,
-    isError: false
-  }),
-  likeEntity: vi.fn(),
-  unlikeEntity: vi.fn()
-}));
-
-vi.mock('@tanstack/svelte-query', async (orig) => {
-  const actual = (await orig()) as Record<string, unknown>;
-  return { ...actual, useQueryClient: () => ({}) };
-});
-
-const artist: ArtistRef = { id: 'abc', name: 'alice', sort_name: 'alice', album_count: 12, cover_url: '' };
-
-describe('ArtistRow', () => {
-  test('renders initial, name, album count inside a link to /artists/:id', () => {
-    render(ArtistRow, { props: { artist } });
-
-    const link = screen.getByRole('link');
-    expect(link).toHaveAttribute('href', '/artists/abc');
-    expect(screen.getByText('alice')).toBeInTheDocument();
-    expect(screen.getByText('12 albums')).toBeInTheDocument();
-    expect(screen.getByText('A')).toBeInTheDocument();
-  });
-
-  test('singular "1 album" when album_count is 1', () => {
-    render(ArtistRow, { props: { artist: { ...artist, album_count: 1 } } });
-    expect(screen.getByText('1 album')).toBeInTheDocument();
-  });
-
-  test('empty name still renders a safe initial', () => {
-    render(ArtistRow, { props: { artist: { ...artist, name: '' } } });
-    // No crash; initial container present but empty or a placeholder char.
-    expect(screen.getByRole('link')).toBeInTheDocument();
-  });
-});

web/src/lib/components/Shell.svelte

@@ -22,7 +22,9 @@
   }
 
   const navItems = [
-    { href: '/',                label: 'Library' },
+    { href: '/',                label: 'Home' },
+    { href: '/library/artists', label: 'Artists' },
+    { href: '/library/albums',  label: 'Albums' },
     { href: '/library/liked',   label: 'Liked' },
     { href: '/library/hidden',  label: 'Hidden' },
     { href: '/search',          label: 'Search' },

web/src/lib/components/Shell.test.ts

@@ -39,9 +39,16 @@ describe('Shell', () => {
     expect(screen.getByText('alice')).toBeInTheDocument();
   });
 
-  test('renders nav items including Discover and Requests between Search and Playlists', () => {
+  test('renders nav items in expected order', () => {
     render(Shell);
-    expect(screen.getByRole('link', { name: 'Library' })).toHaveAttribute('href', '/');
+    const labels = ['Home', 'Artists', 'Albums', 'Liked', 'Hidden', 'Search',
+                    'Discover', 'Requests', 'Playlists', 'Settings'];
+    for (const label of labels) {
+      expect(screen.getByRole('link', { name: label })).toBeInTheDocument();
+    }
+    expect(screen.getByRole('link', { name: 'Home' })).toHaveAttribute('href', '/');
+    expect(screen.getByRole('link', { name: 'Artists' })).toHaveAttribute('href', '/library/artists');
+    expect(screen.getByRole('link', { name: 'Albums' })).toHaveAttribute('href', '/library/albums');
     expect(screen.getByRole('link', { name: 'Search' })).toHaveAttribute('href', '/search');
     expect(screen.getByRole('link', { name: 'Discover' })).toHaveAttribute('href', '/discover');
     expect(screen.getByRole('link', { name: 'Requests' })).toHaveAttribute('href', '/requests');