import * as React from "react";
import { renderHook, cleanup } from "@testing-library/react-hooks";
import configureStore from "redux-mock-store";
import { Provider } from "react-redux";

import { useComponentResolver } from "../useComponentResolver";

const mockStore = configureStore([]);

describe("componentResolver", () => {
  const TestComponent = () => null;
  const components = { TestComponent };

  const plugins = [
    {
      module: TestComponent,
      type: "ui_component",
      name: "Test Component",
      identifier: "test-component",
    },
  ];

  const store = mockStore({ components, plugins });

  // eslint-disable-next-line react/prop-types
  const wrapper = ({ children }) => (
    <Provider store={store}>{children}</Provider>
  );

  afterEach(() => {
    cleanup();
  });

  it("resolves import", () => {
    expect(useComponentResolver).toBeDefined();
  });

  it("returns correct component", () => {
    const componentType = "test_component";

    const { result } = renderHook(
      () => useComponentResolver({ componentType }),
      { wrapper }
    );

    expect(result.current).toBe(TestComponent);
  });
});