// __tests__/components/pois/AddPoiModalWindowWrapper.test.js

import React from "react";
import { render, screen, fireEvent } from "@testing-library/react";
import "@testing-library/jest-dom";
import AddPoiModalWindowWrapper from "../../../components/pois/AddPoiModalWindowWrapper";

// Mock the AddPoiModalWindow component to avoid testing its internal implementation here
jest.mock("../../../components/pois/AddPoiModalWindow", () => ({ onClose, onSubmit, latlng }) => (
  <div data-testid="add-poi-modal-window">
    <button onClick={onClose}>Mocked Close</button>
    <button onClick={onSubmit}>Mocked Submit</button>
    <div>
      Mocked Coordinates: {latlng.lat}, {latlng.lng}
    </div>
  </div>
));

describe("AddPoiModalWindowWrapper", () => {
  const onCloseMock = jest.fn();
  const handleAddStationMock = jest.fn();
  const latlngMock = { lat: 52.52, lng: 13.405 };

  beforeEach(() => {
    onCloseMock.mockClear();
    handleAddStationMock.mockClear();
  });

  test("renders the modal when 'show' is true", () => {
    render(<AddPoiModalWindowWrapper show={true} onClose={onCloseMock} handleAddStation={handleAddStationMock} latlng={latlngMock} />);

    // Check if the modal and its contents are in the document
    expect(screen.getByTestId("add-poi-modal-window")).toBeInTheDocument();
    expect(screen.getByText("Mocked Coordinates: 52.52, 13.405")).toBeInTheDocument();
  });

  test("does not render the modal when 'show' is false", () => {
    render(<AddPoiModalWindowWrapper show={false} onClose={onCloseMock} handleAddStation={handleAddStationMock} latlng={latlngMock} />);

    // Check if the modal is not in the document
    expect(screen.queryByTestId("add-poi-modal-window")).not.toBeInTheDocument();
  });

  test("calls onClose when the close button is clicked", () => {
    render(<AddPoiModalWindowWrapper show={true} onClose={onCloseMock} handleAddStation={handleAddStationMock} latlng={latlngMock} />);

    // Click the close button
    fireEvent.click(screen.getByRole("button", { name: "Close" }));
    expect(onCloseMock).toHaveBeenCalledTimes(1);
  });

  test("calls onClose when the background is clicked", () => {
    render(<AddPoiModalWindowWrapper show={true} onClose={onCloseMock} handleAddStation={handleAddStationMock} latlng={latlngMock} />);

    // Click the background overlay
    fireEvent.click(screen.getByTestId("modal-overlay"));
    expect(onCloseMock).toHaveBeenCalledTimes(1);
  });

  test("does not call onClose when the modal content is clicked", () => {
    render(<AddPoiModalWindowWrapper show={true} onClose={onCloseMock} handleAddStation={handleAddStationMock} latlng={latlngMock} />);

    // Click the modal content
    fireEvent.click(screen.getByRole("dialog"));
    expect(onCloseMock).toHaveBeenCalledTimes(0);
  });

  test("calls handleAddStation when the submit button is clicked", () => {
    render(<AddPoiModalWindowWrapper show={true} onClose={onCloseMock} handleAddStation={handleAddStationMock} latlng={latlngMock} />);

    // Click the submit button
    fireEvent.click(screen.getByText("Mocked Submit"));
    expect(handleAddStationMock).toHaveBeenCalledTimes(1);
  });
});