import { render, screen, fireEvent } from '@testing-library/react';
import { ThemeProvider } from '../../theme';

jest.mock('next-intl', () => ({ useLocale: () => 'en' }));

import AdminPager from './AdminPager';

describe('<AdminPager/>', () => {
  const wrap = (ui: React.ReactNode) => render(<ThemeProvider>{ui}</ThemeProvider>);
  const base = { prevLabel: 'Prev', nextLabel: 'Next', indicator: 'Page 2' };

  it('renders nothing when there is a single page', () => {
    const { container } = wrap(
      <AdminPager page={1} pageCount={1} onPrev={jest.fn()} onNext={jest.fn()} {...base} />,
    );
    expect(container).toBeEmptyDOMElement();
  });

  it('fires onPrev/onNext and disables at the ends', () => {
    const onPrev = jest.fn();
    const onNext = jest.fn();
    wrap(<AdminPager page={2} pageCount={3} onPrev={onPrev} onNext={onNext} {...base} />);
    fireEvent.click(screen.getByRole('button', { name: 'Prev' }));
    fireEvent.click(screen.getByRole('button', { name: 'Next' }));
    expect(onPrev).toHaveBeenCalledTimes(1);
    expect(onNext).toHaveBeenCalledTimes(1);
    expect(screen.getByText('Page 2')).toBeInTheDocument();
  });

  it('disables prev on the first page', () => {
    wrap(<AdminPager page={1} pageCount={3} onPrev={jest.fn()} onNext={jest.fn()} {...base} />);
    expect(screen.getByRole('button', { name: 'Prev' })).toBeDisabled();
  });
});
