nodeMap/hooks/useLineData.js

// /hooks/useLineData.js
import { useEffect, useState } from "react";
import { SERVER_URL } from "../config/urls";
import { useDispatch, useSelector } from "react-redux";
import { connectWebSocket, disconnectWebSocket } from "../redux/actions";

const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
  const dispatch = useDispatch();
  const messages = useSelector((state) => state.messages);
  const [lineColors, setLineColors] = useState({});
  const [tooltipContents, setTooltipContents] = useState({});

  useEffect(() => {
    const fetchData = async () => {
      try {
        console.log("Daten werden abgerufen...");
        const response1 = await fetch(webserviceGisLinesStatusUrl); // original
        //const response1 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/gisLines/webserviceGisLinesStatusUrlMock`); //von original kopiert
        const data1 = await response1.json();
        console.log("Daten empfangen data1:", data1);
        const response2 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/gisLines/readGisLines`);
        //const response2 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/gisLines/readGisLinesMock`);
        const data2 = await response2.json();
        console.log("Daten empfangen data2:", data2);
        const response3 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/device/getAllStationsNames`);
        //const response3 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/device/getAllStationsNamesMock`);
        const namesData = await response3.json();
        console.log("Daten empfangen namesData:", 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) => {
          const key = `${statis.IdLD}-${statis.Modul}`;
          if (!valueMap[key]) {
            valueMap[key] = {
              messages: [],
              messwert: undefined,
              schleifenwert: undefined,
            };
          }

          // Sammle Messwert und Schleifenwert
          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;
          }
          if (statis.Message && statis.Message !== "?") {
            valueMap[key].messages.push(statis.Message);
          }
        });

        // Jetzt durch alle Prioritätslevel gehen und die Farben sowie Meldungen korrekt setzen
        filteredStatis.forEach((statis) => {
          const key = `${statis.IdLD}-${statis.Modul}`;
          const matchingLine = data2.find((item) => item.idLD === statis.IdLD && item.idModul === statis.Modul);

          if (matchingLine) {
            const prioColor = statis.PrioColor === "#ffffff" ? "green" : statis.PrioColor;
            const values = valueMap[key];

            if (!values) {
              console.error(`Keine Werte gefunden für Key: ${key}`);
              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;
            // Überprüfe, ob ModulTyp den Text "705-FO" enthält
            if (statis.ModulTyp && statis.ModulTyp.includes("705-FO")) {
              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>
                  <br>
                  <span class="text-md font-bold text-gray-800">${statis.ModulTyp || "N/A"}</span>
                  <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>
                  <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>
                      ${messageDisplay}
                  </div>
                  <span class="text-gray-800" style="color: ${prioColor || "#000000"};">${prioNameDisplay}</span>
                  <br>
                  ${values.messwert ? `<span class="inline-block text-gray-800">Messwert: ${values.messwert}</span><br>` : ""}
                  ${values.schleifenwert ? `<span class="inline-block text-gray-800">Schleifenwert: ${values.schleifenwert}</span>` : ""}
              </div>
            `;
            } else {
              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>
                  <br>
                  <span class="text-md font-bold text-gray-800">${statis.ModulTyp || "N/A"}</span>
                  <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>
                  <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>
                      ${messageDisplay}
                  </div>
                  <span class="text-gray-800" style="color: ${prioColor || "#000000"};">${prioNameDisplay}</span>
                  <br>
        
              </div>
            `;
            }
          }
        });

        // Setze die Farben und Tooltip-Inhalte
        setLineColors(colorsByModule);
        setTooltipContents(newTooltipContents);
        setLineStatusData(data1.Statis);
      } catch (error) {
        console.error("Fehler beim Abrufen der Daten:", error);
      }
    };

    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;

    if (!acc[IdLD]) {
      acc[IdLD] = {};
    }

    if (!acc[IdLD][Modul]) {
      acc[IdLD][Modul] = {
        ModulName: ModulName || "Unknown",
        ModulTyp: ModulTyp || "N/A",
        TotalLevel: Level,
        PrioColors: new Set(),
        PrioNames: new Set(),
        Messages: [],
        Messwert: undefined,
        Schleifenwert: undefined,
      };
    }

    acc[IdLD][Modul].PrioColors.add(PrioColor);
    acc[IdLD][Modul].PrioNames.add(PrioName);
    if (Message && Message !== "?") {
      acc[IdLD][Modul].Messages.push(Message);
    }

    if (DpName.endsWith("_Messwert") && !acc[IdLD][Modul].Messwert) {
      acc[IdLD][Modul].Messwert = Value;
    }

    if (DpName.endsWith("_Schleifenwert") && !acc[IdLD][Modul].Schleifenwert) {
      acc[IdLD][Modul].Schleifenwert = Value;
    }

    return acc;
  }, {});

  const formattedData = {};
  Object.entries(grouped).forEach(([stationId, modules]) => {
    const filteredModules = Object.entries(modules)
      .filter(([modulId, data]) => data.ModulName !== "?")
      .map(([modulId, data]) => ({
        Modul: modulId,
        ModulName: data.ModulName,
        ModulTyp: data.ModulTyp,
        TotalLevel: data.TotalLevel,
        PrioColors: Array.from(data.PrioColors).join(", "),
        PrioNames: Array.from(data.PrioNames).join(", "),
        Messages: data.Messages.join(" | "),
        Messwert: data.Messwert,
        Schleifenwert: data.Schleifenwert,
      }));

    if (filteredModules.length > 0) {
      formattedData[stationId] = filteredModules;
    }
  });

  console.log("Aggregierte und gruppierte Daten (gefiltert):", formattedData);
}

export default useLineData;