import { describe, expect, it } from 'vitest';
import { render, screen } from '@testing-library/react';
import { SimulationStatusBadge } from '@/components/SimulationStatusBadge';
import type { SimulationStatus } from '@/api/types';

const CASES: { status: SimulationStatus; label: string }[] = [
  { status: 'pending', label: 'Pending' },
  { status: 'in_progress', label: 'In progress' },
  { status: 'review_required', label: 'Review required' },
  { status: 'done', label: 'Done' },
];

describe('SimulationStatusBadge', () => {
  it.each(CASES)('renders $status with correct label and data attr', ({ status, label }) => {
    render(<SimulationStatusBadge status={status} />);
    const badge = screen.getByTestId('simulation-status-badge');
    expect(badge).toHaveAttribute('data-status', status);
    expect(badge.textContent).toBe(label);
  });

  it('applies fog surface for pending', () => {
    render(<SimulationStatusBadge status="pending" />);
    const badge = screen.getByTestId('simulation-status-badge');
    expect(badge.className).toContain('bg-fog');
  });

  it('applies primary-soft surface for in_progress', () => {
    render(<SimulationStatusBadge status="in_progress" />);
    const badge = screen.getByTestId('simulation-status-badge');
    expect(badge.className).toContain('bg-primary-soft');
  });

  it('applies bloom-coral surface for review_required', () => {
    render(<SimulationStatusBadge status="review_required" />);
    const badge = screen.getByTestId('simulation-status-badge');
    expect(badge.className).toContain('bg-bloom-coral');
  });

  it('applies storm-deep surface for done', () => {
    render(<SimulationStatusBadge status="done" />);
    const badge = screen.getByTestId('simulation-status-badge');
    expect(badge.className).toContain('bg-storm-deep');
  });
});