import React from 'react';
import { render, screen, fireEvent } from '@testing-library/react';
import { Provider } from 'react-redux';
import { configureStore } from '@reduxjs/toolkit';
import EmptyState from './EmptyState';
import { clearSearch } from '../actions/searchActions';

const mockStore = configureStore({
  reducer: {
    search: {
      query: 'nonexistent-patient',
      results: [],
    },
  },
});

describe('EmptyState', () => {
  it('renders the no-results message and clear button', () => {
    render(
      <Provider store={mockStore}>
        <EmptyState />
      </Provider>
    );

    expect(screen.getByText('No results found')).toBeInTheDocument();
    expect(
      screen.getByText(/couldn't find any records matching/i)
    ).toBeInTheDocument();
    expect(screen.getByRole('button', { name: 'Clear search' })).toBeInTheDocument();
  });

  it('dispatches clearSearch when the button is clicked', () => {
    const mockDispatch = jest.fn();
    const { un