// /components/useMapContextMenu.js
import { toast } from "react-toastify";
import { zoomIn, zoomOut, centerHere } from "../utils/zoomAndCenterUtils"; // Assuming these are imported correctly

const zoomInCallback = (e, map) => {
  zoomIn(e, map);
};

const zoomOutCallback = (map) => {
  zoomOut(map);
};

const centerHereCallback = (e, map) => {
  centerHere(e, map);
};
// Funktion zum Anzeigen der Koordinaten
const showCoordinates = (e) => {
  alert("Breitengrad: " + e.latlng.lat.toFixed(5) + "\nLängengrad: " + e.latlng.lng.toFixed(5));
};
// Kontextmenü Callback für "POI hinzufügen"
const addStationCallback = (event, hasRights, setShowPopup, setPopupCoordinates) => {
  const editMode = localStorage.getItem("editMode") === "true";
  hasRights = editMode ? hasRights : undefined;
  if (hasRights) {
    setPopupCoordinates(event.latlng);
    setShowPopup(true);
  } else {
    toast.error("Benutzer hat keine Berechtigung zum Hinzufügen.", {
      position: "top-center",
      autoClose: 5000,
      hideProgressBar: false,
      closeOnClick: true,
      pauseOnHover: true,
      draggable: true,
      progress: undefined,
    });
  }
};

export const addItemsToMapContextMenu = (map, menuItemAdded, setMenuItemAdded, hasRights, setShowPopup, setPopupCoordinates) => {
  // Überprüfe den Bearbeitungsmodus in localStorage
  const editMode = localStorage.getItem("editMode") === "true";
  hasRights = editMode ? hasRights : undefined;

  if (!menuItemAdded && map && map.contextmenu) {
    map.contextmenu.addItem({
      text: "Koordinaten anzeigen",
      icon: "img/not_listed_location.png",
      callback: showCoordinates,
    });

    map.contextmenu.addItem({ separator: true });

    map.contextmenu.addItem({
      text: "Reinzoomen",
      icon: "img/zoom_in.png",
      callback: (e) => zoomInCallback(e, map),
    });

    map.contextmenu.addItem({
      text: "Rauszoomen",
      icon: "img/zoom_out.png",
      callback: () => zoomOutCallback(map),
    });

    map.contextmenu.addItem({
      text: "Hier zentrieren",
      icon: "img/center_focus.png",
      callback: (e) => centerHereCallback(e, map),
    });

    // wenn localStorage Variable editMode true ist, dann wird der Button "POI hinzufügen" angezeigt
    if (editMode) {
      map.contextmenu.addItem({ separator: true });
      map.contextmenu.addItem({
        text: "POI hinzufügen",
        icon: "img/add_station.png",
        className: "background-red",
        callback: (event) => addStationCallback(event, hasRights, setShowPopup, setPopupCoordinates),
      });
    }

    setMenuItemAdded(true);
  }
};