feat: lade Linienstatusdaten vollständig aus Redux Store

- Entferne direkte Verwendung von `webserviceGisLinesStatusUrl` aus config.js
- Nutze `useLineData()` mit Redux-Toolkit Store
- Baue URL intern in fetchGisLinesStatusService.js dynamisch auf
- Optimiere Tooltip-Generierung aus Webservice-Daten

CHANGELOG.md

@@ -4,6 +4,24 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie
 
 ---
 
+## [1.1.148] - 2025-05-22
+
+### Hinzugefügt
+
+- Tooltips für Linien vollständig über Redux (`gisLinesStatusFromWebservice`) implementiert.
+- Linienstatusdaten jetzt über `useLineData()` aus dem Redux-Toolkit Store geladen.
+
+### Entfernt
+
+- `webserviceGisLinesStatusUrl` aus `config.js` entfernt – URL wird zentral in `fetchGisLinesStatusService.js` aufgebaut.
+
+### Geändert
+
+- `useLineData.js` angepasst, um Redux Store zu nutzen statt URL-Parameter.
+- `MapComponent.js` entsprechend refaktoriert.
+
+---
+
 ## [1.1.147] - 2025-05-22
 
 ### Hinzugefügt

components/mainComponent/MapComponent.js

@@ -133,7 +133,6 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
 
   // Konstanten für die URLs
 
-  const webserviceGisLinesStatusUrl = config.webserviceGisLinesStatusUrl;
   //console.log("priorityConfig in MapComponent1: ", priorityConfig);
   //-----------------------------------------
   const [gmaMarkers, setGmaMarkers] = useState([]); //--------------------station.System === 11 alle sind untetschiedlich Nummern
@@ -155,7 +154,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
   //--------------------------------------------
 
   const [linePositions, setLinePositions] = useState([]);
-  const { lineColors, tooltipContents } = useLineData(webserviceGisLinesStatusUrl);
+  const { lineColors, tooltipContents } = useLineData();
   const [polylines, setPolylines] = useState([]);
   const [markers, setMarkers] = useState([]);
   const [newPoint, setNewPoint] = useState(null);
@@ -372,7 +371,7 @@ const MapComponent = ({ locations, onLocationUpdate, lineCoordinates }) => {
 
     newPolylines.forEach((polyline, index) => {
       //console.log("polyline: ", polyline);
-      const tooltipContent = tooltipContents[`${linePositions[index].idLD}-${linePositions[index].idModul}`] || "Standard-Tooltip-Inhalt";
+      const tooltipContent = tooltipContents[`${linePositions[index].idLD}-${linePositions[index].idModul}`] || "Die Linie ist noch nicht in Webservice vorhanden oder bekommt keine Daten";
 
       polyline.bindTooltip(tooltipContent, {
         permanent: false,

config/appVersion.js

@@ -1,2 +1,2 @@
 // /config/appVersion
-export const APP_VERSION = "1.1.148";
+export const APP_VERSION = "1.1.149";

config/config.js

@@ -25,7 +25,6 @@ if (typeof window !== "undefined") {
 
 // Initialisieren von Variablen, die später im Browserkontext gesetzt werden
 let windowHeight, url_string, url, idMap, idUser;
-let webserviceGisLinesStatusUrl;
 
 // URL-Setup - dynamisch abhängig von Mock oder Echtbetrieb
 if (typeof window !== "undefined") {
@@ -38,17 +37,7 @@ if (typeof window !== "undefined") {
   idUser = url.searchParams.get("u");
   console.log(`4- Parameter 'idMap' : ${idMap}`);
   console.log(`5- Parameter 'idUser': ${idUser}`);
-
-  if (isMockMode()) {
-    // Mock-Daten jetzt über API-Endpunkte aus pages/api/mockData/webService/
-    webserviceGisLinesStatusUrl = "/api/mockData/webService/GisLinesStatusMock";
-    console.log("📡 Mock-Mode aktiv: Daten werden aus /api/mockData/webService geladen.");
-  } else {
-    // Echte URLs zur Webservice-API
-    webserviceGisLinesStatusUrl = `${serverURL}${BASE_URL}/ClientData/WebServiceMap.asmx/GisLinesStatus?idMap=${idMap}`;
-    console.log("🌐 Echt-Mode aktiv: Daten werden von der API geholt.");
-  }
 }
 
 // Export der Variablen und URLs
-export { serverURL, windowHeight, url_string, url, idMap, idUser, webserviceGisLinesStatusUrl, isMockMode };
+export { serverURL, windowHeight, url_string, url, idMap, idUser, isMockMode };

hooks/useLineData.js

@@ -1,49 +1,34 @@
 // hooks/useLineData.js //fix v1.0.8.1
 import { useEffect, useState } from "react";
-import { toast } from "react-toastify";
-import { SERVER_URL } from "../config/urls";
-import { useDispatch, useSelector } from "react-redux";
+import { useSelector, useDispatch } from "react-redux";
+import { selectGisLinesStatusFromWebservice } from "../redux/slices/webservice/gisLinesStatusSlice";
+import { fetchGisLinesThunk } from "../redux/thunks/database/fetchGisLinesThunk";
+import { fetchGisLinesStatusThunk } from "../redux/thunks/webservice/fetchGisLinesStatusThunk";
 
-const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
+const useLineData = () => {
   const dispatch = useDispatch();
-  const messages = useSelector((state) => state.messages);
+
+  const { data: statisData } = useSelector(selectGisLinesStatusFromWebservice);
+  const linesData = useSelector((state) => state.gisLinesFromDatabase.data);
   const [lineColors, setLineColors] = useState({});
   const [tooltipContents, setTooltipContents] = useState({});
 
   useEffect(() => {
-    let isCancelled = false;
+    dispatch(fetchGisLinesThunk());
+    dispatch(fetchGisLinesStatusThunk());
+  }, [dispatch]);
 
-    const fetchData = async () => {
-      try {
-        const response1 = await fetch(webserviceGisLinesStatusUrl);
-        if (!response1.ok) throw new Error("Fehler bei GIS-Linienstatus");
-
-        const data1 = await response1.json();
-        const response2 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/gisLines/readGisLines`);
-        if (!response2.ok) throw new Error("Fehler beim Abrufen der GIS-Linien");
-
-        const data2 = await response2.json();
-        const response3 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/device/getAllStationsNames`);
-        if (!response3.ok) throw new Error("Fehler beim Abrufen der Stationsnamen");
-
-        const namesData = await response3.json();
-
-        if (!isCancelled) {
-          if (!data1.Statis || data1.Statis.length === 0) {
-            toast.warn("Keine Linienstatus-Daten verfügbar!", { position: "top-center", autoClose: 5000 });
-            setLineStatusData([]);
-            return;
-          }
+  useEffect(() => {
+    if (!statisData || !Array.isArray(statisData)) return;
 
     const colorsByModule = {};
     const newTooltipContents = {};
     const valueMap = {};
 
-          const sortedStatis = [...data1.Statis].sort((a, b) => a.Level - b.Level);
+    const sortedStatis = [...statisData].sort((a, b) => a.Level - b.Level);
 
     sortedStatis.forEach((statis) => {
       const key = `${statis.IdLD}-${statis.Modul}`;
-
       if (!valueMap[key]) {
         valueMap[key] = {
           messages: [],
@@ -55,6 +40,7 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
       if (statis.DpName.endsWith("_Messwert") && statis.Value !== "True" && !valueMap[key].messwert) {
         valueMap[key].messwert = statis.Value;
       }
+
       if (statis.DpName.endsWith("_Schleifenwert") && !valueMap[key].schleifenwert) {
         valueMap[key].schleifenwert = statis.Value;
       }
@@ -69,11 +55,10 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
 
     sortedStatis.forEach((statis) => {
       const key = `${statis.IdLD}-${statis.Modul}`;
-            const matchingLine = data2.find((item) => item.idLD === statis.IdLD && item.idModul === statis.Modul);
+      const matchingLine = linesData.find((item) => item.idLD === statis.IdLD && item.idModul === statis.Modul);
 
       if (matchingLine) {
         const values = valueMap[key];
-
         const messageDisplay = values.messages.map((msg) => `<span class="inline-block text-gray-800"><span class="inline-block w-2 h-2 rounded-full mr-2" style="background-color: ${msg.prioColor};"></span>${msg.message}</span><br>`).join("");
 
         colorsByModule[key] = values.messages.length > 0 ? values.messages[0].prioColor : "green";
@@ -86,7 +71,7 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
             <br>
             <span class="text-md font-bold text-gray-800">Slot: ${statis.Modul || "N/A"}</span>
             <br>
-                  <span class="text-md font-bold text-gray-800">Station: ${namesData[matchingLine.idLD] || "N/A"}</span>
+            <span class="text-md font-bold text-gray-800">Station: ${matchingLine.name || "N/A"}</span>
             <br>
             <div style="max-width: 100%; overflow-wrap: break-word; word-break: break-word; white-space: normal;">
               ${messageDisplay}
@@ -101,30 +86,7 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
 
     setLineColors(colorsByModule);
     setTooltipContents(newTooltipContents);
-          setLineStatusData(data1.Statis);
-        }
-      } catch (error) {
-        //console.error("Fehler beim Abrufen der Daten in useLineData.js:", error);
-        // toast.error("Fehler beim Abrufen der Linienstatus-Daten!", { position: "top-center", autoClose: 5000 });
-        console.warn("Fehler beim Abrufen der Linienstatus-Daten in useLineData.js ");
-      }
-    };
-
-    const scheduleNextFetch = () => {
-      if (!isCancelled) {
-        fetchData();
-        setTimeout(scheduleNextFetch, 30000);
-      }
-    };
-
-    fetchData();
-    scheduleNextFetch();
-
-    return () => {
-      isCancelled = true;
-      localStorage.removeItem("contextMenuExpired");
-    };
-  }, [webserviceGisLinesStatusUrl, setLineStatusData]);
+  }, [statisData, linesData]);
 
   return { lineColors, tooltipContents };
 };