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

import React, { 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 AddTags from "./AddTags";
import vehiclesAPI from "../../../services/vehiclesAPI";

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

jest.mock('../../Controls/TextInputList', () => {
  const React = require('react');
  return () => <div data-testid="mock-text-input-list" />;
});

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

  it("makes request to update the config of multiple vehicles", async () => {
    useState.mockReturnValue([["myTag"], jest.fn()]);
    const api = jest.spyOn(vehiclesAPI, "addTags");
    const ref = React.createRef();

    render(
      <StatusProvider>
        <UserProvider>
          <AddTags
            ref={ref}
            ids={["TESTVIN123456789a"]}
            idCSV=""
          />
        </UserProvider>
      </StatusProvider>
    );

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