import { test, expect } from '@playwright/test';

test.describe('Home Page', () => {
  test.beforeEach(async ({ page }) => {
    await page.goto('/');
  });

  test('loads home page', async ({ page }) => {
    await expect(page).toHaveTitle(/Music App/);
  });

  test('shows navigation hub with feature tabs', async ({ page }) => {
    await expect(page.getByText('Music')).toBeVisible();
    await expect(page.getByText('New Music')).toBeVisible();
    await expect(page.getByText('Mood')).toBeVisible();
    await expect(page.getByText('LoFi')).toBeVisible();
  });

  test('shows quick access cards', async ({ page }) => {
    await expect(page.getByText('My Music')).toBeVisible();
    await expect(page.getByText('New Releases')).toBeVisible();
  });

  test('shows mood radio section', async ({ page }) => {
    await expect(page.getByText('Mood Radio')).toBeVisible();
    await expect(page.getByText('Sad')).toBeVisible();
    await expect(page.getByText('Happy')).toBeVisible();
    await expect(page.getByText('Energetic')).toBeVisible();
  });

  test('profile link navigates to account', async ({ page }) => {
    await page.getByRole('link', { name: /person/ }).first().click();
    // Should navigate to /account
    await expect(page).toHaveURL(/\/account/);
  });

  test('Music tab navigates to library', async ({ page }) => {
    await page.getByRole('link', { name: 'Music' }).first().click();
    await expect(page).toHaveURL(/\/library/);
  });

  test('New Music tab navigates to releases', async ({ page }) => {
    await page.getByRole('link', { name: 'New Music' }).first().click();
    await expect(page).toHaveURL(/\/releases/);
  });

  test('Mood tab navigates to mood radio', async ({ page }) => {
    await page.getByRole('link', { name: 'Mood' }).first().click();
    await expect(page).toHaveURL(/\/mood/);
  });

  test('LoFi tab navigates to lofi channels', async ({ page }) => {
    await page.getByRole('link', { name: 'LoFi' }).first().click();
    await expect(page).toHaveURL(/\/lofi/);
  });
});