feat: Redux-Integration für TDR-Daten verbessert

- TDR-Daten werden jetzt beim Laden der Kabelüberwachungsseite automatisch abgerufen.
- Fehler im Thunk behoben: Initial leere `tdrChart.data` wird nun korrekt aktualisiert.
- Überprüfung, ob neue Daten vorhanden sind, verbessert (keine unnötige Ablehnung bei Erstabruf).
- Korrekte JSON-Datei-Pfade (`slot0.json` bis `slot31.json`) in Fetch-Requests implementiert.
- Redux-Error-Handling optimiert: Falls keine gültigen Daten geladen werden, wird eine Meldung angezeigt.
- Logging für geladene Daten hinzugefügt, um die Debugging-Möglichkeiten zu verbessern.
- `fetchAllTDRChartData.ts` als überflüssige Datei entfernt (Thunks übernehmen jetzt den Abruf).
- `kabelueberwachung.tsx` so angepasst, dass der Chart sofort mit geladenen Daten arbeitet.

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

@@ -123,7 +123,10 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({ isOpen, onClose }) => {
         ) : (
           <>
             <h3 className="text-lg font-semibold">TDR-Messung</h3>
-            <TDRChartActionBar />
+            {/* TDR-Chart-Action-Bar */}
+            {/*  <TDRChartActionBar /> */}
+
+            {/* TDR-Chart */}
             <div style={{ flex: 1, height: "90%" }}>
               <TDRChart />
             </div>

pages/kabelueberwachung.tsx

@@ -3,6 +3,7 @@ import React, { useState, useEffect } from "react";
 import { useRouter, useSearchParams } from "next/navigation";
 import Kue705FO from "../components/main/kabelueberwachung/kue705FO/Kue705FO";
 import { useDispatch, useSelector } from "react-redux";
+import { fetchAllTDRChartData } from "../redux/thunks/fetchAllTDRChartThunk";
 
 function Kabelueberwachung() {
   const router = useRouter();
@@ -25,6 +26,21 @@ function Kabelueberwachung() {
     kueGroundFault,
   } = useSelector((state) => state.variables);
 
+  //----------------------------------------------------------------
+  // 🚀 **TDR-Daten bereits in Redux abrufen**
+  // Redux-Variablen abrufen
+  const tdrData = useSelector((state) => state.tdrChart.data);
+  const loading = useSelector((state) => state.tdrChart.loading);
+  const error = useSelector((state) => state.tdrChart.error);
+
+  // Beim Laden der Seite TDR-Daten abrufen
+  useEffect(() => {
+    if (!tdrData || tdrData.length === 0) {
+      console.log("TDR-Daten abrufen...");
+      dispatch(fetchAllTDRChartData());
+    }
+  }, [dispatch, tdrData]);
+  //----------------------------------------------------------------
   // Alarmstatus basierend auf Redux-Variablen berechnen
   const updateAlarmStatus = () => {
     const updatedAlarmStatus = kueIso.map((_, index) => {

redux/slices/tdrChartSlice.ts

@@ -1,40 +1,41 @@
+// /redux/slices/tdrChartSlice.ts
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import { fetchAllTDRChartData } from "../thunks/fetchAllTDRChartThunk";
 
-// 🔹 State-Interface
 interface TDRChartState {
-  dateiListe: string[];
+  data: any[];
-  sortAscending: boolean;
+  loading: boolean;
-  tdrChartData: { t: number; m: number }[];
+  error: string | null;
 }
 
-// 🔹 Anfangsstate
 const initialState: TDRChartState = {
-  dateiListe: [],
+  data: [],
-  sortAscending: true,
+  loading: false,
-  tdrChartData: [],
+  error: null,
 };
 
-// 🔹 Redux Slice
 const tdrChartSlice = createSlice({
   name: "tdrChart",
   initialState,
-  reducers: {
+  reducers: {},
-    setDateiListe: (state, action: PayloadAction<string[]>) => {
+  extraReducers: (builder) => {
-      state.dateiListe = action.payload;
+    builder
-    },
+      .addCase(fetchAllTDRChartData.pending, (state) => {
-    toggleSortOrder: (state) => {
+        state.loading = true;
-      state.sortAscending = !state.sortAscending;
+        state.error = null;
-      state.dateiListe.reverse(); // 🔄 Reihenfolge umkehren
+      })
-    },
+      .addCase(
-    setTDRChartData: (
+        fetchAllTDRChartData.fulfilled,
-      state,
+        (state, action: PayloadAction<any[]>) => {
-      action: PayloadAction<{ t: number; m: number }[]>
+          state.loading = false;
-    ) => {
+          state.data = action.payload; // Speichere die neuen Daten in Redux
-      state.tdrChartData = action.payload;
+        }
-    },
+      )
+      .addCase(fetchAllTDRChartData.rejected, (state, action) => {
+        state.loading = false;
+        state.error = action.payload as string | null;
+      });
   },
 });
 
-export const { setDateiListe, toggleSortOrder, setTDRChartData } =
-  tdrChartSlice.actions;
 export default tdrChartSlice.reducer;

redux/thunks/fetchAllTDRChartThunk.ts

@@ -0,0 +1,45 @@
+// /redux/thunks/fetchAllTDRChartThunk.ts
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import { RootState } from "../store";
+
+const BASE_PATH = "/CPLmockData/LastTDR/jsonDatei";
+
+export const fetchAllTDRChartData = createAsyncThunk(
+  "tdrChart/fetchAllTDRChartData",
+  async (_, { getState, rejectWithValue }) => {
+    const state: RootState = getState() as RootState;
+    const currentData = state.tdrChart.data; // Aktuelle Redux-Daten
+
+    const fileNames = Array.from({ length: 32 }, (_, i) => `slot${i}.json`);
+    const fetchPromises = fileNames.map(async (fileName) => {
+      try {
+        const response = await fetch(`${BASE_PATH}/${fileName}`);
+        if (!response.ok)
+          throw new Error(`Fehler bei ${fileName}: ${response.statusText}`);
+        return await response.json();
+      } catch (error) {
+        console.error(`Fehler beim Laden von ${fileName}:`, error);
+        return null;
+      }
+    });
+
+    const newData = await Promise.all(fetchPromises);
+
+    console.log("Geladene Daten:", newData);
+
+    // Falls die Daten leer oder identisch sind, aber initial leer waren, trotzdem speichern
+    if (newData.every((d) => d === null || d === undefined)) {
+      console.warn("⚠ Keine gültigen Daten empfangen.");
+      return rejectWithValue("Keine gültigen Daten empfangen.");
+    }
+
+    if (
+      JSON.stringify(currentData) !== JSON.stringify(newData) ||
+      currentData.length === 0
+    ) {
+      return newData;
+    } else {
+      return rejectWithValue("Keine Änderungen in den Daten.");
+    }
+  }
+);

services/fetchAllTDRChartData.ts

@@ -0,0 +1,34 @@
+// /services/fetchAllTDRChartData.ts
+import { Dispatch } from "@reduxjs/toolkit";
+import { setTDRData, selectTDRData } from "../redux/slices/tdrChartSlice";
+import { RootState } from "../redux/store";
+
+const BASE_PATH = "/CPLmockData/LastTDR/jsonDatei";
+
+export const fetchAllTDRChartData = async (
+  dispatch: Dispatch,
+  getState: () => RootState
+) => {
+  const state = getState();
+  const currentData = selectTDRData(state);
+
+  const fileNames = Array.from({ length: 32 }, (_, i) => `json${i}`);
+  const fetchPromises = fileNames.map(async (fileName) => {
+    try {
+      const response = await fetch(`${BASE_PATH}/${fileName}.json`);
+      if (!response.ok)
+        throw new Error(`Fehler bei ${fileName}: ${response.statusText}`);
+      return await response.json();
+    } catch (error) {
+      console.error(`Fehler beim Laden von ${fileName}:`, error);
+      return null;
+    }
+  });
+
+  const newData = await Promise.all(fetchPromises);
+
+  // Nur aktualisieren, wenn sich die Daten geändert haben
+  if (JSON.stringify(currentData) !== JSON.stringify(newData)) {
+    dispatch(setTDRData(newData));
+  }
+};

services/fetchTDRChartData.ts

@@ -0,0 +1,33 @@
+// /services/fetchTDRChartData.ts
+
+export const fetchTDRChartData = async (
+  selectedFileName: string | null
+): Promise<any | null> => {
+  if (!selectedFileName) {
+    console.error("Kein Dateiname in Redux gespeichert.");
+    return null;
+  }
+
+  const yearFolder = `Year_${new Date().getFullYear().toString().slice(-2)}`;
+  const monthFolder = `Month_${(new Date().getMonth() + 1)
+    .toString()
+    .padStart(2, "0")}`;
+
+  // const filePath = `/CPLmockData/LastTDR/kue_01/${yearFolder}/${monthFolder}/${selectedFileName}`;
+  const filePath = `/CPLmockData/LastTDR/jsonDatei/${selectedFileName}`;
+
+  try {
+    const response = await fetch(filePath);
+    if (!response.ok) {
+      throw new Error(
+        `Fehler beim Laden der TDR-Daten: ${response.statusText}`
+      );
+    }
+    const data = await response.json();
+    console.log("Geladene TDR-Daten:", data);
+    return data;
+  } catch (error) {
+    console.error("Fehler beim Laden der TDR-Daten:", error);
+    return null;
+  }
+};

utils/loadTDRChartData.ts

@@ -1,3 +1,4 @@
+// /utils/loadTDRChartData.ts
 import { createTDRChart } from "./chartUtils";
 
 export const loadTDRChartData = (
@@ -14,7 +15,8 @@ export const loadTDRChartData = (
     .toString()
     .padStart(2, "0")}`;
 
-  const filePath = `/CPLmockData/LastTDR/kue_01/${yearFolder}/${monthFolder}/${selectedFileName}`;
+  //const filePath = `/CPLmockData/LastTDR/kue_01/${yearFolder}/${monthFolder}/${selectedFileName}`;
+  const filePath = `/CPLmockData/LastTDR/jsonDatei/${selectedFileName}`;
 
   fetch(filePath)
     .then((response) => response.json())