import * as React from "react";
import { Platform } from "react-native";
import { shallow } from "enzyme";
import { shallowToJson } from "enzyme-to-json";

jest.mock("@applicaster/zapp-react-native-utils/reactHooks/navigation", () => ({
  useRoute: jest.fn(() => ({ screenData: { id: "test" } })),
}));

jest.mock("@applicaster/zapp-react-native-utils/screenState", () => ({
  useScreenState: jest.fn(() => ({
    get: jest.fn(() => ({})),
    setSelectedEntry: jest.fn(),
  })),
}));

const { default: DefaultCellRenderer } = require("../index");

const component = {
  component_type: "grid",
} as const;

const styles: Record<string, any> = {};
const cell_styles = "style";

const configuration = { component, styles, cell_styles } as const;

describe("DefaultCellRenderer", () => {
  it("is a function", () => {
    expect(DefaultCellRenderer).toBeFunction();
  });

  it("returns an error if component is missing in configuration", () => {
    expect(() => DefaultCellRenderer({})).toThrow(
      "Missing component or component type"
    );
  });

  it("returns a react component and it renders correctly", () => {
    const CellRenderer = DefaultCellRenderer(configuration);
    const wrapper = shallow(<CellRenderer store={null} />);

    expect(shallowToJson(wrapper)).toMatchSnapshot();
  });

  it("returns a react component for LG TVs", () => {
    Platform.OS = "lg_tv";

    const CellRenderer = DefaultCellRenderer(configuration);
    const wrapper = shallow(<CellRenderer store={null} />);

    expect(shallowToJson(wrapper)).toMatchSnapshot();
  });

  it("returns a react component for Samsung TVs", () => {
    Platform.OS = "samsung_tv";

    const CellRenderer = DefaultCellRenderer(configuration);
    const wrapper = shallow(<CellRenderer store={null} />);

    expect(shallowToJson(wrapper)).toMatchSnapshot();
  });
});