import Enzyme from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import { ConsoleMock } from 'app/testUtils/consoleMock';
import ReactTestRenderer from 'react-test-renderer';
import { DashboardChart } from 'app/modules/dashboard/components/dashboardChart';
import React from 'react';

jest.mock('react-redux', () => ({
  useSelector: jest.fn(selector => selector()),
  useDispatch: jest.fn(),
}));

jest.mock('app/modules/dashboard/store/dashboard.selectors', () => ({
  getDashboardChartData: jest.fn(() => {
    // eslint-disable-next-line @typescript-eslint/no-var-requires
    const mocks = require('app/testUtils/mocks/dashboard.mock');
    return {
      maxValue: mocks.dashboardSeriesMaxValueMock,
      selectedId: 1,
      barSeries: mocks.dashboardSeriesMock,
    };
  }),
}));

jest.mock('app/shared/store/ui/uiSelectors', () => ({
  getScreenWidth: jest.fn(() => 1200),
}));

describe('Dashboard Chart', () => {
  Enzyme.configure({ adapter: new Adapter() });

  it('renders correctly', () => {
    const consoleMock = new ConsoleMock();

    const tree = ReactTestRenderer
      .create(<DashboardChart
        width={300}
        height={400}
      />)
      .toJSON();

    expect(console.error).not.toBeCalled();
    expect(console.log).not.toBeCalled();
    expect(tree).toMatchSnapshot();

    consoleMock.destroy();
  });
});
