import React from "react";
import { render } from "@testing-library/react-native";

jest.useFakeTimers({ legacyFakeTimers: true });

let mockConnectionStatus = false;
const mockPreviousValue = null;

jest.mock("@applicaster/zapp-react-native-utils/reactHooks/connection", () => {
  return {
    useConnectionInfo: jest.fn(() => mockConnectionStatus),
  };
});

jest.mock("@applicaster/zapp-react-native-utils/reactHooks/utils", () => {
  return {
    usePrevious: jest.fn(() => mockPreviousValue),
  };
});

jest.mock("@applicaster/zapp-react-native-redux/hooks", () => ({
  ...jest.requireActual("@applicaster/zapp-react-native-redux/hooks"),
  usePickFromState: () => ({
    plugins: [
      {
        name: "offline experience",
        identifier: "offline-experience",
        type: "general",
        module: {
          useOfflineExperienceConfiguration: () => ({
            configurationFields: {},
            localizations: {
              offline_toast_message: "No internet connection",
              online_toast_message: "You are back online",
            },
          }),
        },
      },
    ],
  }),
}));

jest.mock("react-native-safe-area-context", () => ({
  useSafeAreaInsets: () => ({ top: 44 }),
}));

describe("OfflineHandler", () => {
  const { OfflineHandler, NotificationView } = require("../");

  it("renders", () => {
    const { toJSON } = render(<OfflineHandler />);
    expect(toJSON()).toMatchSnapshot();
  });

  it("renders Notification mode if component was rendered while online", () => {
    mockConnectionStatus = true;

    const { rerender, UNSAFE_getByType } = render(<OfflineHandler />);

    rerender(<OfflineHandler />);

    const notificationsView = UNSAFE_getByType(NotificationView);
    expect(notificationsView).toBeDefined();
  });
});