refactor: Polyline-Tooltip in usePolylineTooltipLayer Hook ausgelagert

components/MapComponent.js

@@ -480,69 +480,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
     fetchData();
   }, []);
   //--------------------------------------------
-  //Tooltip an mouse position anzeigen für die Linien
-/*   useEffect(() => {
-    if (!map) return;
-
-    // Entferne alte Marker und Polylinien
-    markers.forEach((marker) => marker.remove());
-    polylines.forEach((polyline) => polyline.remove());
-
-    // Setze neue Marker und Polylinien mit den aktuellen Daten
-    const { markers: newMarkers, polylines: newPolylines } = setupPolylines(
-      map,
-      linePositions,
-      lineColors,
-      tooltipContents,
-      setNewCoords,
-      tempMarker,
-      polylineVisible // polylineVisible wird jetzt korrekt übergeben
-    );
-
-    newPolylines.forEach((polyline, index) => {
-      const tooltipContent = tooltipContents[`${linePositions[index].idLD}-${linePositions[index].idModul}`] || "Standard-Tooltip-Inhalt";
-
-      polyline.bindTooltip(tooltipContent, {
-        permanent: false,
-        direction: "auto",
-        sticky: true,
-        offset: [20, 0],
-        pane: "tooltipPane",
-      });
-
-      polyline.on("mouseover", (e) => {
-        const tooltip = polyline.getTooltip();
-        if (tooltip) {
-          const mousePos = e.containerPoint;
-          const mapSize = map.getSize();
-
-          let direction = "right";
-
-          if (mousePos.x > mapSize.x - 100) {
-            direction = "left";
-          } else if (mousePos.x < 100) {
-            direction = "right";
-          }
-
-          if (mousePos.y > mapSize.y - 100) {
-            direction = "top";
-          } else if (mousePos.y < 100) {
-            direction = "bottom";
-          }
-
-          tooltip.options.direction = direction;
-          polyline.openTooltip(e.latlng);
-        }
-      });
-
-      polyline.on("mouseout", () => {
-        polyline.closeTooltip();
-      });
-    });
-
-    setMarkers(newMarkers);
-    setPolylines(newPolylines);
-  }, [map, linePositions, lineColors, tooltipContents, newPoint, newCoords, tempMarker, polylineVisible]); */
 
   usePolylineTooltipLayer(  
     map,

hooks/usePolylineTooltipLayer.js

@@ -3,7 +3,7 @@ import { useEffect } from "react";
 import L from "leaflet";
 import { setupPolylines } from "../utils/setupPolylines";
 
-
+  //Tooltip an mouse position anzeigen für die Linien
 export const usePolylineTooltipLayer = (
     map,
     markers,