tdrChartData und loopMeasurementCurveChartData in einem Redux Slice kabelueberwachung für bessere Struktur

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

@@ -9,8 +9,8 @@ const TDRChart: React.FC = () => {
   const chartInstance = useRef<Chart | null>(null);
 
   // TDR-Daten aus dem Redux Store selektieren
-  const loopMeasurementCurveChartData = useSelector(
-    (state: any) => state.tdrChartData.data
+  const tdrChartData = useSelector(
+    (state: any) => state.kabelueberwachungChart.tdrChartData
   );
 
   useEffect(() => {
@@ -18,7 +18,7 @@ const TDRChart: React.FC = () => {
     import("chartjs-plugin-zoom").then((zoomPlugin) => {
       Chart.register(...registerables, zoomPlugin.default);
 
-      if (chartRef.current && loopMeasurementCurveChartData.length > 0) {
+      if (chartRef.current && tdrChartData.length > 0) {
         if (chartInstance.current) {
           chartInstance.current.destroy();
         }
@@ -31,7 +31,7 @@ const TDRChart: React.FC = () => {
               datasets: [
                 {
                   label: "TDR Entfernung (km)",
-                  data: loopMeasurementCurveChartData,
+                  data: tdrChartData,
                   borderColor: "rgba(255, 99, 132, 1)",
                   backgroundColor: "rgba(255, 99, 132, 0.2)",
                   tension: 0.1,
@@ -82,7 +82,7 @@ const TDRChart: React.FC = () => {
         }
       }
     });
-  }, [loopMeasurementCurveChartData]);
+  }, [tdrChartData]);
 
   return (
     <div>

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

@@ -1,11 +1,7 @@
 // /components/modules/kue705FO/charts/TDRChart/TDRChartActionBar.tsx
 import React, { useState, useEffect, useRef } from "react";
-import DateRangePicker from "../DateRangePicker";
-import TDRChart from "../../../../kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart";
-import { setLoopMeasurementCurveChartData } from "../../../../../../redux/slices/chartDataSlice";
-import { parseISO } from "date-fns";
 import { useDispatch } from "react-redux";
-import { setTDRChartData } from "../../../../../../redux/slices/tdrChartDataSlice";
+import { setTDRChartData } from "../../../../../../redux/slices/kabelueberwachungChartSlice";
 
 const TDRChartActionBar: React.FC = () => {
   const dispatch = useDispatch();
@@ -101,8 +97,9 @@ const TDRChartActionBar: React.FC = () => {
   const chartRef = useRef<HTMLCanvasElement>(null);
 
   // Zustand für die Chart-Daten
-  const [loopMeasurementCurveChartData, setLoopMeasurementCurveChartData] =
-    useState<{ timestamp: string; tdr: number }[]>([]);
+  const [tdrChartData, settdrChartData] = useState<
+    { timestamp: string; tdr: number }[]
+  >([]);
 
   useEffect(() => {
     // Aktuelles Jahr und Monat ermitteln
@@ -126,7 +123,7 @@ const TDRChartActionBar: React.FC = () => {
       })
       .then((data) => {
         // Annahme: data ist ein Array von Objekten mit den Eigenschaften 'timestamp' und 'tdr'
-        setLoopMeasurementCurveChartData(data);
+        settdrChartData(data);
       })
       .catch((error) => {
         console.error("Fehler beim Abrufen der Daten:", error);