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();
  });
});