jest.mock("../../Contexts/UserContext");
jest.mock("../../Contexts/StatusContext");
jest.mock("../../../services/fleetsAPI");

import React, { useEffect, useState } from "react";
import {
  render,
  act,
} from "@testing-library/react";
import { UserProvider, setToken } from "../../Contexts/UserContext";
import { StatusProvider } from "../../Contexts/StatusContext";
import { TEST_AUTH_OBJECT_FISKER } from "../../../utils/testing";
import AddToFleet from "./AddToFleet";
import fleetsAPI from "../../../services/fleetsAPI";

jest.mock('react', () => ({
  ...jest.requireActual('react'),
  useState: jest.fn(),
}));

jest.mock('@material-ui/core/FormControl', () => {
  const React = require('react');
  return () => <div data-testid="mock-form-control" />;
});

describe("BulkActions/AddToFleet", () => {
  beforeAll(() => {
    setToken(TEST_AUTH_OBJECT_FISKER);
  });

  it("makes request to update the config of multiple vehicles", async () => {
    useState
      .mockReturnValueOnce(["Default-Test", jest.fn()])
      .mockReturnValueOnce([["Default-Test"], jest.fn()]);
    const api = jest.spyOn(fleetsAPI, "addFleetVehicles");
    const ref = React.createRef();

    render(
      <StatusProvider>
        <UserProvider>
          <AddToFleet
            ref={ref}
            vins={["TESTVIN1234567890"]}
            vinCSV=""
          />
        </UserProvider>
      </StatusProvider>
    );

    await act(async () => ref.current.submit());
    expect(api).toHaveBeenCalled();
  });
});