import React from 'react';
import renderer from 'react-test-renderer';
import { Button } from '../../Buttons/Button';

describe('Button', () => {
  it('renders correctly when type is primary', () => {
    const tree = renderer
      .create(<Button type="primary" onPress={() => {}} text="Test" />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly when type is secondary', () => {
    const tree = renderer
      .create(<Button type="secondary" onPress={() => {}} text="Test" />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly when size is small', () => {
    const tree = renderer
      .create(<Button type="primary" onPress={() => {}} text="Test" size="small" />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly when size is normal', () => {
    const tree = renderer
      .create(<Button type="primary" onPress={() => {}} text="Test" size="normal" />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly when size is medium', () => {
    const tree = renderer
      .create(<Button type="primary" onPress={() => {}} text="Test" size="medium" />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly when size is large', () => {
    const tree = renderer
      .create(<Button type="primary" onPress={() => {}} text="Test" size="large" />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly when disabled is true', () => {
    const tree = renderer
      .create(<Button type="primary" onPress={() => {}} text="Test" disabled />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly when plus is true', () => {
    const tree = renderer
      .create(<Button type="primary" onPress={() => {}} text="Test" plus />)
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly with custom button style', () => {
    const tree = renderer
      .create(
        <Button
          type="primary"
          onPress={() => {}}
          text="Test"
          buttonStyle={{ backgroundColor: 'red' }}
        />
      )
      .toJSON();
    expect(tree).toMatchSnapshot();
  });

  it('renders correctly with custom text style', () => {
    const tree = renderer
      .create(
        <Button
          type="primary"
          onPress={() => {}}
          text="Test"
          textStyle={{ color: 'blue' }}
        />
      )
      .toJSON();
    expect(tree).toMatchSnapshot();
  });
});