import { describe, it, expect } from 'vitest';
import { screen, waitFor } from '@testing-library/react';
import { HttpResponse, http } from 'msw';
import { renderRoute } from './render';
import { server } from './mocks/server';

describe('Documents page', () => {
  it('renders page title', async () => {
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByRole('heading', { name: 'Documents' })).toBeInTheDocument();
    });
  });

  it('renders document list with title', async () => {
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByText('Apple Q4 Earnings Beat')).toBeInTheDocument();
    });
  });

  it('shows document type and source type', async () => {
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByText('Apple Q4 Earnings Beat')).toBeInTheDocument();
    });
    const row = screen.getByText('Apple Q4 Earnings Beat').closest('tr')!;
    expect(row).toHaveTextContent('news');
    expect(row).toHaveTextContent('news_api');
  });

  it('shows parse confidence badge', async () => {
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByText('high')).toBeInTheDocument();
    });
  });

  it('shows status badge', async () => {
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByText('Apple Q4 Earnings Beat')).toBeInTheDocument();
    });
    const row = screen.getByText('Apple Q4 Earnings Beat').closest('tr')!;
    expect(row).toHaveTextContent('extracted');
  });

  it('renders status filter dropdown', async () => {
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByLabelText('Filter by status')).toBeInTheDocument();
    });
    expect(screen.getByText('All statuses')).toBeInTheDocument();
  });

  it('renders ticker filter', async () => {
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByPlaceholderText('Ticker…')).toBeInTheDocument();
    });
  });

  it('shows empty state when no documents', async () => {
    server.use(
      http.get('/api/documents', () => HttpResponse.json([])),
    );
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByText('No data')).toBeInTheDocument();
    });
  });

  it('renders multiple documents', async () => {
    server.use(
      http.get('/api/documents', () => HttpResponse.json([
        { id: 'd1', document_type: 'news', source_type: 'news_api', publisher: 'Reuters', url: null, title: 'Apple Q4 Earnings Beat', published_at: '2026-04-10T12:00:00Z', retrieved_at: '2026-04-10T12:05:00Z', language: 'en', content_hash: 'abc123', parse_quality_score: 0.92, parse_confidence: 'high', status: 'extracted', created_at: '2026-04-10T12:05:00Z' },
        { id: 'd2', document_type: 'filing', source_type: 'sec_api', publisher: 'SEC', url: null, title: 'MSFT 10-K Annual Report', published_at: '2026-04-09T08:00:00Z', retrieved_at: '2026-04-09T08:05:00Z', language: 'en', content_hash: 'def456', parse_quality_score: 0.88, parse_confidence: 'medium', status: 'parsed', created_at: '2026-04-09T08:05:00Z' },
      ])),
    );
    renderRoute('/documents');
    await waitFor(() => {
      expect(screen.getByText('Apple Q4 Earnings Beat')).toBeInTheDocument();
    });
    expect(screen.getByText('MSFT 10-K Annual Report')).toBeInTheDocument();
    expect(screen.getByText('filing')).toBeInTheDocument();
  });

  it('navigates to document detail on row click', async () => {
    renderRoute('/documents/d1');
    await waitFor(() => {
      expect(screen.getByText('Apple Q4 Earnings Beat')).toBeInTheDocument();
    });
  });
});
