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

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

  test('displays page header and stats', async ({ page }) => {
    // Check page title
    await expect(page.getByRole('heading', { name: /synor network/i })).toBeVisible();

    // Check stats cards are present
    await expect(page.getByText('Block Height')).toBeVisible();
    await expect(page.getByText('Hashrate')).toBeVisible();
    await expect(page.getByText('Difficulty')).toBeVisible();
  });

  test('displays recent blocks section', async ({ page }) => {
    await expect(page.getByRole('heading', { name: /recent blocks/i })).toBeVisible();

    // Should have block entries in the list
    const blockLinks = page.locator('a[href^="/block/"]');
    await expect(blockLinks.first()).toBeVisible();
  });

  test('displays circulating supply card', async ({ page }) => {
    await expect(page.getByText(/circulating supply/i)).toBeVisible();
    await expect(page.getByText(/max supply/i)).toBeVisible();
  });

  test('shows connection status indicator', async ({ page }) => {
    // Should show either Live or Offline status
    const connectionStatus = page.locator('button').filter({ hasText: /live|offline|connecting/i });
    await expect(connectionStatus).toBeVisible();
  });

  test('navigation links work correctly', async ({ page }) => {
    // Click on Blocks link
    await page.getByRole('link', { name: 'Blocks' }).click();
    await expect(page).toHaveURL(/\/blocks/);

    // Go back and click on DAG
    await page.goto('/');
    await page.getByRole('link', { name: 'DAG' }).click();
    await expect(page).toHaveURL(/\/dag/);
  });
});