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

const defaultProps = {
  quote: 'This product is amazing.',
  name: 'Jane D.',
  role: 'Engineer',
  company: 'Acme AI',
  metric: 'Saved $1k/mo',
};

describe('TestimonialCard', () => {
  it('renders quote text', () => {
    const { getByText } = render(<TestimonialCard {...defaultProps} />);
    expect(getByText(/This product is amazing\./)).toBeTruthy();
  });

  it('renders name, role, and company', () => {
    const { getByText } = render(<TestimonialCard {...defaultProps} />);
    expect(getByText(/Jane D\./)).toBeTruthy();
    expect(getByText(/Engineer/)).toBeTruthy();
    expect(getByText(/Acme AI/)).toBeTruthy();
  });

  it('renders metric pill with emerald styling', () => {
    const { getByText } = render(<TestimonialCard {...defaultProps} />);
    const metricEl = getByText(defaultProps.metric);
    expect(metricEl).toBeTruthy();
    expect(metricEl.className).toContain('text-emerald-400');
  });

  it('applies GlowCard wrapper with glow-card class', () => {
    const { container } = render(<TestimonialCard {...defaultProps} />);
    expect((container.firstChild as HTMLElement).className).toContain('glow-card');
  });

  it('has violet left border', () => {
    const { container } = render(<TestimonialCard {...defaultProps} />);
    expect((container.firstChild as HTMLElement).className).toContain('border-l-2');
    expect((container.firstChild as HTMLElement).className).toContain('border-violet-500');
  });

  it('renders initials avatar', () => {
    const { getByText } = render(<TestimonialCard {...defaultProps} />);
    expect(getByText('JD')).toBeTruthy();
  });
});
