ohne contextmenu Fehler in useLineData

hooks/useLineData.js

@@ -1,3 +1,4 @@
+// /hooks/useLineData.js
 import { useEffect, useState } from "react";
 import { SERVER_URL } from "../config/urls";
 
@@ -11,43 +12,23 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
         console.log("Daten werden abgerufen...");
         const response1 = await fetch(webserviceGisLinesStatusUrl);
         const data1 = await response1.json();
+        console.log("Daten vom Webservice:", data1);
         const response2 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/gisLines/readGisLines`);
         const data2 = await response2.json();
+        console.log("GIS Linien Daten:", data2);
+
+        // Abrufen der Namen basierend auf idLD
         const response3 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/station/getAllStationsNames`);
         const namesData = await response3.json();
+        console.log("Namen der Linien:", namesData);
 
         const colorsByModule = {};
         const newTooltipContents = {};
         const valueMap = {};
 
-        // Logik zur Gruppierung der Daten
         logGroupedData(data1.Statis);
 
-        // Sortiere die Meldungen nach Level, damit die höchste Priorität (kleinster Level) zuerst kommt
-        const sortedStatis = [...data1.Statis].sort((a, b) => a.Level - b.Level);
-        console.log("Sortierte Daten:", sortedStatis);
-
-        // Filtere Objekte mit gleichem IdLD und Modul, und Level > 0, und entferne die Objekte mit dem höchsten Level
-        const filteredStatis = [];
-        const seenKeys = new Set();
-
-        sortedStatis.forEach((statis) => {
-          const key = `${statis.IdLD}-${statis.Modul}`;
-
-          if (statis.Level > 0) {
-            if (!seenKeys.has(key)) {
-              seenKeys.add(key);
-              filteredStatis.push(statis); // Behalte das Objekt mit dem niedrigsten Level (höchste Priorität)
-            }
-          } else {
-            // Für Level -1 oder nicht relevante Meldungen einfach hinzufügen
-            filteredStatis.push(statis);
-          }
-        });
-
-        console.log("Gefilterte Daten (Objekte mit höchstem Level entfernt):", filteredStatis);
-
-        filteredStatis.forEach((statis) => {
+        data1.Statis.forEach((statis) => {
           const key = `${statis.IdLD}-${statis.Modul}`;
           if (!valueMap[key]) {
             valueMap[key] = {
@@ -56,8 +37,6 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
               schleifenwert: undefined,
             };
           }
-
-          // Sammle Messwert und Schleifenwert
           if (statis.DpName.endsWith("_Messwert") && statis.Value !== "True" && !valueMap[key].messwert) {
             valueMap[key].messwert = statis.Value;
           }
@@ -69,26 +48,22 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
           }
         });
 
-        // Jetzt durch alle Prioritätslevel gehen und die Farben sowie Meldungen korrekt setzen
-        filteredStatis.forEach((statis) => {
-          const key = `${statis.IdLD}-${statis.Modul}`;
+        data1.Statis.reverse().forEach((statis) => {
           const matchingLine = data2.find((item) => item.idLD === statis.IdLD && item.idModul === statis.Modul);
-
           if (matchingLine) {
             const prioColor = statis.PrioColor === "#ffffff" ? "green" : statis.PrioColor;
+            const key = `${matchingLine.idLD}-${matchingLine.idModul}`; // Sicherstellen, dass der Key eindeutig ist
             const values = valueMap[key];
 
             if (!values) {
-              console.error(`Keine Werte gefunden für Key: ${key}`);
+              console.error(`No values found for key: ${key}`); // Debug: Überprüfe, ob Werte existieren
               return;
             }
 
-            // Nachrichtenanzeige
             const messageDisplay = values.messages.map((msg) => (msg ? `<span class="inline-block text-gray-800">${msg}</span><br>` : "")).join("");
             const prioNameDisplay = statis.PrioName && statis.PrioName !== "?" ? `(${statis.PrioName})` : "";
 
-            // Setze die Farbe und Tooltip für jede Linie (für alle Prioritätslevel)
-            colorsByModule[key] = prioColor;
+            colorsByModule[key] = prioColor; // Stelle sicher, dass der Key richtig verwendet wird
             newTooltipContents[key] = `
               <div class="bg-white rounded-lg m-0 p-2 w-[210px]">
                   <span class="text-lg font-semibold text-gray-900">${statis.ModulName || "Unknown"}</span>
@@ -97,7 +72,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: ${namesData[matchingLine.idLD] || "N/A"}</span> <!-- Zeige den Namen -->
                   <br>
                   <div style="max-width: 100%; overflow-wrap: break-word; word-break: break-word; white-space: normal;">
                       <span class="inline-block w-2 h-2 rounded-full mr-2" style="background-color: ${prioColor || "#000000"};"></span>
@@ -112,7 +87,6 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
           }
         });
 
-        // Setze die Farben und Tooltip-Inhalte
         setLineColors(colorsByModule);
         setTooltipContents(newTooltipContents);
         setLineStatusData(data1.Statis);
@@ -122,18 +96,11 @@ const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
     };
 
     fetchData();
-
-    // Setze ein Intervall, um die Daten alle 20 Sekunden erneut abzurufen
-    const intervalId = setInterval(fetchData, 20000);
-
-    // Räumt das Intervall auf, wenn die Komponente entladen wird
-    return () => clearInterval(intervalId);
   }, [webserviceGisLinesStatusUrl, setLineStatusData]);
 
   return { lineColors, tooltipContents };
 };
 
-// Funktion zur Gruppierung der Daten
 function logGroupedData(statisList) {
   const grouped = statisList.reduce((acc, item) => {
     const { IdLD, Modul, Level, PrioColor, PrioName, ModulName, ModulTyp, Message, DpName, Value } = item;