import { render, fireEvent } from '@testing-library/react';
import { describe, it, expect, vi } from 'vitest';
import { PricingToggle } from '../PricingToggle';

describe('PricingToggle', () => {
  it('renders monthly and annual options', () => {
    const { getByText } = render(
      <PricingToggle value="monthly" onChange={vi.fn()} />
    );
    expect(getByText('Monthly')).toBeTruthy();
    expect(getByText('Annual')).toBeTruthy();
  });

  it('shows savings badge on annual option', () => {
    const { getByText } = render(
      <PricingToggle value="monthly" onChange={vi.fn()} />
    );
    expect(getByText(/Save/i)).toBeTruthy();
  });

  it('calls onChange with "annual" when annual clicked', () => {
    const onChange = vi.fn();
    const { getByText } = render(
      <PricingToggle value="monthly" onChange={onChange} />
    );
    fireEvent.click(getByText('Annual'));
    expect(onChange).toHaveBeenCalledWith('annual');
  });

  it('calls onChange with "monthly" when monthly clicked', () => {
    const onChange = vi.fn();
    const { getByText } = render(
      <PricingToggle value="annual" onChange={onChange} />
    );
    fireEvent.click(getByText('Monthly'));
    expect(onChange).toHaveBeenCalledWith('monthly');
  });
});
