refactor: TDR-Daten in neuen tdrSingleChartSlice ausgelagert und nur pro Slot geladen

- Globalen fetchAllTDRChartData entfernt
- Neuen Slice und Thunk pro Slot erstellt
- TDRChart liest initiale Daten aus neuem Slice

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

@@ -19,6 +19,8 @@ import {
 } from "../../../../../redux/slices/tdrChartSlice";
 import { resetBrushRange } from "../../../../../redux/slices/brushSlice";
 import { fetchAllTDRChartData } from "../../../../../redux/thunks/fetchAllTDRChartThunk";
+import { fetchTDMDataBySlotThunk } from "../../../../../redux/thunks/fetchTDMDataBySlotThunk";
+import { fetchTDRChartDataBySlotThunk } from "../../../../../redux/thunks/fetchTDRChartDataBySlotThunk";
 
 interface ChartSwitcherProps {
   isOpen: boolean;
@@ -71,6 +73,19 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({
     return () => clearInterval(interval); // Cleanup, wenn Komponente entladen wird
   }, [dispatch]);
   //-------------------------------------
+  useEffect(() => {
+    if (slotIndex !== null) {
+      dispatch(fetchTDMDataBySlotThunk(slotIndex));
+    }
+  }, [slotIndex]);
+
+  //-------------------------------------
+  useEffect(() => {
+    if (slotIndex !== null) {
+      dispatch(fetchTDRChartDataBySlotThunk(slotIndex));
+    }
+  }, [slotIndex]);
+  //-------------------------------------
   return (
     <ReactModal
       isOpen={isOpen}

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

@@ -9,16 +9,12 @@ import { Chart, registerables } from "chart.js";
 import "chartjs-adapter-date-fns";
 import { getColor } from "../../../../../../utils/colors";
 import TDRChartActionBar from "./TDRChartActionBar";
-import { fetchAllTDRChartData } from "../../../../../../redux/thunks/fetchAllTDRChartThunk";
+
 import { fetchAllTDRReferenceChartThunk } from "../../../../../../redux/thunks/fetchAllTDRReferenceChartThunk";
 
 const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
   const dispatch = useDispatch<AppDispatch>();
 
-  useEffect(() => {
-    dispatch(fetchAllTDRChartData());
-    dispatch(fetchAllTDRReferenceChartThunk());
-  }, [dispatch]);
   //---------------------------------
   const chartRef = useRef<HTMLCanvasElement>(null);
   const chartInstance = useRef<Chart | null>(null);
@@ -36,10 +32,13 @@ const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
   const tdrDataById = useSelector(
     (state: RootState) => state.tdrDataById.dataById
   );
-  const tdrInitialData = useSelector((state: RootState) =>
-    selectedSlot !== null ? state.tdrChart.data[selectedSlot] || [] : []
+  //--------------------------------
+  const tdrDataBySlot = useSelector(
+    (state: RootState) => state.tdrSingleChart.data
   );
-
+  const tdrInitialData =
+    selectedSlot !== null ? tdrDataBySlot[selectedSlot] ?? [] : [];
+  //--------------------------------
   // Kombinierte Logik: ID hat Vorrang, sonst Initial-Daten für Slot
   const tdrChartData = useMemo(() => {
     if (selectedId !== null && tdrDataById[selectedId]) {
@@ -190,7 +189,6 @@ const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
     });
   }, [JSON.stringify(tdrChartData), selectedSlot, selectedChartType]);
 
-  
   return (
     <div style={{ width: "100%", height: isFullScreen ? "90%" : "28rem" }}>
       <TDRChartActionBar />

config/webVersion.ts

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

redux/slices/tdrSingleChartSlice.ts

@@ -0,0 +1,53 @@
+// redux/slices/tdrSingleChartSlice.ts
+
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import { fetchTDRChartDataBySlotThunk } from "../thunks/fetchTDRChartDataBySlotThunk";
+
+interface TDRSlotData {
+  [slot: number]: { d: number; p: number }[];
+}
+
+interface TdrSingleChartState {
+  data: TDRSlotData;
+  loading: boolean;
+  error: string | null;
+}
+
+const initialState: TdrSingleChartState = {
+  data: {},
+  loading: false,
+  error: null,
+};
+
+const tdrSingleChartSlice = createSlice({
+  name: "tdrSingleChart",
+  initialState,
+  reducers: {},
+  extraReducers: (builder) => {
+    builder
+      .addCase(fetchTDRChartDataBySlotThunk.pending, (state) => {
+        state.loading = true;
+        state.error = null;
+      })
+      .addCase(
+        fetchTDRChartDataBySlotThunk.fulfilled,
+        (
+          state,
+          action: PayloadAction<{
+            slot: number;
+            data: { d: number; p: number }[];
+          }>
+        ) => {
+          const { slot, data } = action.payload;
+          state.data[slot] = data;
+          state.loading = false;
+        }
+      )
+      .addCase(fetchTDRChartDataBySlotThunk.rejected, (state, action) => {
+        state.loading = false;
+        state.error = action.error.message ?? "Fehler beim Laden";
+      });
+  },
+});
+
+export default tdrSingleChartSlice.reducer;

redux/store.ts

@@ -19,6 +19,7 @@ import tdmChartReducer from "./slices/tdmChartSlice";
 import tdrDataByIdReducer from "./slices/tdrDataByIdSlice";
 import kueDataReducer from "./slices/kueDataSlice";
 import selectedChartDataReducer from "./slices/selectedChartDataSlice";
+import tdrSingleChartReducer from "./slices/tdrSingleChartSlice";
 
 const store = configureStore({
   reducer: {
@@ -40,6 +41,7 @@ const store = configureStore({
     tdrDataById: tdrDataByIdReducer,
     kueData: kueDataReducer,
     selectedChartData: selectedChartDataReducer,
+    tdrSingleChart: tdrSingleChartReducer,
   },
 });
 

redux/thunks/fetchTDMDataBySlotThunk.ts

@@ -0,0 +1,15 @@
+// /redux/thunks/fetchTDMDataBySlotThunk.ts
+
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import { fetchTDMDataBySlot } from "../../services/fetchSingleTDMData";
+import { setLoopMeasurementCurveChartData } from "../slices/kabelueberwachungChartSlice";
+
+export const fetchTDMDataBySlotThunk = createAsyncThunk(
+  "tdmChart/fetchSlotData",
+  async (slot: number, { dispatch }) => {
+    const data = await fetchTDMDataBySlot(slot);
+    if (data) {
+      dispatch(setLoopMeasurementCurveChartData(data));
+    }
+  }
+);

redux/thunks/fetchTDRChartDataBySlotThunk.ts

@@ -0,0 +1,13 @@
+// /redux/thunks/fetchTDRChartDataBySlotThunk.ts
+
+import { createAsyncThunk } from "@reduxjs/toolkit";
+import { fetchTDRChartDataBySlot } from "../../services/fetchSingleTDRChartData";
+
+export const fetchTDRChartDataBySlotThunk = createAsyncThunk(
+  "tdrChart/fetchSlotData",
+  async (slot: number) => {
+    const data = await fetchTDRChartDataBySlot(slot);
+    if (!data) throw new Error(`Daten für Slot ${slot} nicht gefunden`);
+    return { slot, data };
+  }
+);

services/fetchSingleTDMData.ts

@@ -0,0 +1,20 @@
+// /services/fetchSingleTDMData.ts
+
+export const fetchTDMDataBySlot = async (slot: number): Promise<any> => {
+  if (typeof window === "undefined") return null;
+
+  const isDev = process.env.NEXT_PUBLIC_NODE_ENV === "development";
+
+  const url = isDev
+    ? `/CPLmockData/TDM/slot${slot}.json`
+    : `${window.location.origin}/CPL?Service/empty.acp&TDM=${slot}`;
+
+  try {
+    const res = await fetch(url);
+    if (!res.ok) throw new Error(`HTTP ${res.status}`);
+    return await res.json();
+  } catch (error) {
+    console.error(`❌ Fehler beim Laden von Slot ${slot}:`, error);
+    return null;
+  }
+};

services/fetchSingleTDRChartData.ts

@@ -0,0 +1,20 @@
+// /services/fetchSingleTDRChartData.ts
+
+export const fetchTDRChartDataBySlot = async (
+  slot: number
+): Promise<any[] | null> => {
+  const isDev = process.env.NEXT_PUBLIC_NODE_ENV === "development";
+
+  const url = isDev
+    ? `/CPLmockData/LastTDR/jsonDatei/slot${slot}.json`
+    : `${window.location.origin}/CPL?/CPL/LastTDR/slot${slot}.json`;
+
+  try {
+    const response = await fetch(url);
+    if (!response.ok) throw new Error(`HTTP ${response.status}`);
+    return await response.json();
+  } catch (error) {
+    console.error(`❌ Fehler beim Laden von slot${slot}:`, error);
+    return null;
+  }
+};