feat: TDR-Chart aktualisiert sich jetzt automatisch bei Datenänderung

- `fetchAllTDRChartThunk.ts`: Vergleich der aktuellen und neuen Daten mit `lodash.isEqual`, um unnötige Redux-Updates zu vermeiden.
- `TDRChart.tsx`: Nutzt `selectedSlot` aus `kueChartModeSlice.ts`, um nur den relevanten Slot im Chart anzuzeigen.
- `ChartSwitcher.tsx`: Ruft alle 10 Sekunden `fetchAllTDRChartData` auf, um Änderungen zu prüfen.
- `tdrChartSlice.ts`: Speichert nur neue Daten, wenn sie sich von den vorherigen unterscheiden.
- Fix: `activeMode` aus `kueChartModeSlice.ts` wird für die Auswahl zwischen TDR- und Schleifenmessung verwendet.
- Code Cleanup und Logging für bessere Debugging-Unterstützung.

🔥 Jetzt aktualisiert sich der TDR-Chart automatisch, wenn sich die Daten ändern, ohne dass ein Neuladen der Seite erforderlich ist.

components/main/kabelueberwachung/kue705FO/Charts/ChartSwitcher.tsx

@@ -1,6 +1,6 @@
 "use client"; // /components/modules/kue705FO/charts/ChartSwitcher.tsx
 
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import ReactModal from "react-modal";
 import LoopChartActionBar from "./LoopMeasurementChart/LoopChartActionBar";
 import TDRChartActionBar from "./TDRChart/TDRChartActionBar";
@@ -17,6 +17,7 @@ import {
   setSelectedChartType,
 } from "../../../../../redux/slices/tdrChartSlice";
 import { resetBrushRange } from "../../../../../redux/slices/brushSlice";
+import { fetchAllTDRChartData } from "../../../../../redux/thunks/fetchAllTDRChartThunk";
 
 interface ChartSwitcherProps {
   isOpen: boolean;
@@ -57,7 +58,18 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({
     dispatch(setSelectedSlot(slotIndex));
     dispatch(setSelectedChartType(chartType));
   };
+  //-------------------------------------
 
+  useEffect(() => {
+    dispatch(fetchAllTDRChartData()); // Erstes Laden
+
+    const interval = setInterval(() => {
+      dispatch(fetchAllTDRChartData());
+    }, 10000); // Alle 10 Sekunden neue Daten abrufen
+
+    return () => clearInterval(interval); // Cleanup, wenn Komponente entladen wird
+  }, [dispatch]);
+  //-------------------------------------
   return (
     <ReactModal
       isOpen={isOpen}

components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart.tsx

@@ -93,7 +93,7 @@ const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
         }
       }
     });
-  }, [tdrChartData, selectedSlot, selectedChartType]);
+  }, [JSON.stringify(tdrChartData), selectedSlot, selectedChartType]);
 
   return (
     <div style={{ width: "100%", height: isFullScreen ? "90%" : "28rem" }}>

config/webVersion.ts

@@ -6,5 +6,5 @@
 2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
 
 */
-const webVersion = "1.6.140";
+const webVersion = "1.6.141";
 export default webVersion;

package-lock.json

@@ -26,6 +26,7 @@
         "idb": "^8.0.0",
         "jsonwebtoken": "^9.0.2",
         "jwt-decode": "^4.0.0",
+        "lodash": "^4.17.21",
         "next": "^14.2.23",
         "react": "^18.3.1",
         "react-chartjs-2": "^5.3.0",
@@ -47,6 +48,7 @@
         "@types/crypto-js": "^4.2.2",
         "@types/cypress": "^1.1.6",
         "@types/jest": "^29.5.14",
+        "@types/lodash": "^4.17.16",
         "@types/node": "^22.10.10",
         "@types/react": "^18.3.18",
         "@types/react-dom": "^18.3.5",
@@ -1835,6 +1837,12 @@
         "parse5": "^7.0.0"
       }
     },
+    "node_modules/@types/lodash": {
+      "version": "4.17.16",
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.16.tgz",
+      "integrity": "sha512-HX7Em5NYQAXKW+1T+FiuG27NGwzJfCX3s1GjOa7ujxZa52kjJLOr4FUxT+giF6Tgxv1e+/czV/iTtBw27WTU9g==",
+      "dev": true
+    },
     "node_modules/@types/node": {
       "version": "22.10.10",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.10.tgz",

package.json

@@ -31,6 +31,7 @@
     "idb": "^8.0.0",
     "jsonwebtoken": "^9.0.2",
     "jwt-decode": "^4.0.0",
+    "lodash": "^4.17.21",
     "next": "^14.2.23",
     "react": "^18.3.1",
     "react-chartjs-2": "^5.3.0",
@@ -52,6 +53,7 @@
     "@types/crypto-js": "^4.2.2",
     "@types/cypress": "^1.1.6",
     "@types/jest": "^29.5.14",
+    "@types/lodash": "^4.17.16",
     "@types/node": "^22.10.10",
     "@types/react": "^18.3.18",
     "@types/react-dom": "^18.3.5",

redux/thunks/fetchAllTDRChartThunk.ts

@@ -1,6 +1,7 @@
 // /redux/thunks/fetchAllTDRChartThunk.ts
 import { createAsyncThunk } from "@reduxjs/toolkit";
 import { RootState } from "../store";
+import isEqual from "lodash/isEqual";
 
 const BASE_PATH = "/CPLmockData/LastTDR/jsonDatei";
 
@@ -34,11 +35,16 @@ export const fetchAllTDRChartData = createAsyncThunk(
     }
 
     if (
-      JSON.stringify(currentData) !== JSON.stringify(newData) ||
+      !isEqual(
+        JSON.parse(JSON.stringify(currentData)),
+        JSON.parse(JSON.stringify(newData))
+      ) ||
       currentData.length === 0
     ) {
+      console.log("🔥 Neue Daten erkannt – Redux wird aktualisiert.");
       return newData;
     } else {
+      console.log("⚠ Keine signifikanten Änderungen erkannt.");
       return rejectWithValue("Keine Änderungen in den Daten.");
     }
   }