/**
 * Tests for AddTestCustomerButton Component
 *
 * The parent (index.js) only renders this button when channel is EMAIL/SMS and value is valid.
 * This component always renders the button when mounted; visibility is the parent's responsibility.
 */

import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import { IntlProvider } from 'react-intl';
import AddTestCustomerButton from '../AddTestCustomer';

const mockMessages = {
  'app.v2Components.TestAndPreviewSlidebox.addTestCustomerWithValue': 'Add {searchValue} as Test Customer',
};

const TestWrapper = ({ children }) => (
  <IntlProvider locale="en" messages={mockMessages}>
    {children}
  </IntlProvider>
);

describe('AddTestCustomerButton', () => {
  const defaultProps = {
    searchValue: 'user@example.com',
    handleAddTestCustomer: jest.fn(),
  };

  beforeEach(() => {
    jest.clearAllMocks();
  });

  it('should render button with searchValue in message', () => {
    render(
      <TestWrapper>
        <AddTestCustomerButton {...defaultProps} />
      </TestWrapper>
    );
    const button = screen.getByRole('button', { name: /add.*test customer/i });
    expect(button).toBeTruthy();
  });

  it('should show searchValue in button text', () => {
    render(
      <TestWrapper>
        <AddTestCustomerButton {...defaultProps} searchValue="user@example.com" />
      </TestWrapper>
    );
    expect(screen.getByRole('button', { name: /user@example.com/i })).toBeTruthy();
  });

  it('should call handleAddTestCustomer when button is clicked', () => {
    const handleAddTestCustomer = jest.fn();
    render(
      <TestWrapper>
        <AddTestCustomerButton
          searchValue="user@example.com"
          handleAddTestCustomer={handleAddTestCustomer}
        />
      </TestWrapper>
    );
    const button = screen.getByRole('button', { name: /add.*test customer/i });
    fireEvent.click(button);
    expect(handleAddTestCustomer).toHaveBeenCalledTimes(1);
  });
});
