import * as React from "react";
import { Platform } from "react-native";
import { renderWithProviders } from "@applicaster/zapp-react-native-utils/testUtils";

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

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", () => {
  beforeEach(() => {
    Platform.OS = "ios"; // Reset to default
  });

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

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

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

  it("renders correctly", () => {
    const CellRenderer = DefaultCellRenderer(configuration);
    const result = renderWithProviders(<CellRenderer store={null} />);
    expect(result).toBeTruthy();
  });

  it("renders correctly for LG TVs", () => {
    Platform.OS = "lg_tv";
    const CellRenderer = DefaultCellRenderer(configuration);
    const result = renderWithProviders(<CellRenderer store={null} />);
    expect(result).toBeTruthy();
  });

  it("renders correctly for Samsung TVs", () => {
    Platform.OS = "samsung_tv";
    const CellRenderer = DefaultCellRenderer(configuration);
    const result = renderWithProviders(<CellRenderer store={null} />);
    expect(result).toBeTruthy();
  });
});