feat: Verbesserung der Slot-Auswahl und Chart-Steuerung

- `selectedSlot` in `kueChartModeSlice.ts` hinzugefügt, um den aktiven Slot zu speichern.
- `handleButtonClick.ts` aktualisiert, damit `selectedSlot` in Redux gesetzt wird.
- `handleOpenChartModal.ts` angepasst, sodass `selectedSlot` beim Öffnen des Modals gesetzt wird.
- `Kue705FO.tsx` nutzt jetzt Redux für die Slot- und Modus-Steuerung (`selectedSlot`, `activeMode`).
- Redux-Logik optimiert: `selectedSlot` wird nun konsistent zwischen `TDRChart.tsx` und `ChartSwitcher.tsx` genutzt.
- Verbesserung der Benutzererfahrung: Nur `onClick` verwendet, `onMouseOver` wegen Performance-Problemen vermieden.

✅ Jetzt wird der richtige Slot in Redux gespeichert, wenn ein Button oder das Chart-Modal geöffnet wird.
✅ `TDRChart.tsx` zeigt nur das gewählte Modul an, kein unnötiges Neuladen von Daten.
✅ Stabile und optimierte Chart-Steuerung ohne ungewollte Änderungen durch Mausbewegungen.

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

@@ -1,4 +1,6 @@
 // components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart.tsx
+"use client";
+
 import React, { useEffect, useRef } from "react";
 import { RootState } from "../../../../../../redux/store";
 import { useSelector } from "react-redux";
@@ -6,26 +8,22 @@ import { Chart, registerables } from "chart.js";
 import "chartjs-adapter-date-fns";
 import { getColor } from "../../../../../../utils/colors";
 
-// 🟢 **Prop-Typ für isFullScreen hinzufügen**
-interface TDRChartProps {
-  isFullScreen: boolean;
-}
-
-const TDRChart: React.FC = () => {
-  const isFullScreen = useSelector(
-    (state: RootState) => state.kabelueberwachungChart.isFullScreen
-  );
-
+const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
   const chartRef = useRef<HTMLCanvasElement>(null);
   const chartInstance = useRef<Chart | null>(null);
 
-  // TDR-Daten aus dem Redux Store selektieren
-  const tdrChartData = useSelector(
-    (state: any) => state.kabelueberwachungChart.tdrChartData
+  // 🟢 **Hole den ausgewählten Slot und Messkurve aus Redux**
+  const selectedSlot = useSelector(
+    (state: RootState) => state.tdrChart.selectedSlot
+  );
+  const selectedChartType = useSelector(
+    (state: RootState) => state.kueChartMode.activeMode
+  );
+  const tdrChartData = useSelector((state: RootState) =>
+    selectedSlot !== null ? state.tdrChart.data[selectedSlot] || [] : []
   );
 
   useEffect(() => {
-    // Importiere und registriere das Zoom-Plugin innerhalb des useEffect-Hooks
     import("chartjs-plugin-zoom").then((zoomPlugin) => {
       Chart.register(...registerables, zoomPlugin.default);
 
@@ -41,15 +39,16 @@ const TDRChart: React.FC = () => {
             data: {
               datasets: [
                 {
-                  label: "TDR Entfernung (km)",
+                  label: `Modul ${
+                    selectedSlot !== null ? selectedSlot + 1 : "?"
+                  } (${selectedChartType})`,
                   data: tdrChartData,
-                  borderColor: getColor("littwin-blue"), // Nutzt automatisch die Tailwind-Farbe
-                  borderWidth: 0.5,
-                  //backgroundColor: getColor("littwin-blue"),
+                  borderColor: getColor("littwin-blue"),
+                  borderWidth: 1,
                   tension: 0.1,
                   parsing: {
-                    xAxisKey: "t", // Schlüssel für den Zeitstempel
-                    yAxisKey: "m", // Schlüssel für den Messwert
+                    xAxisKey: "t",
+                    yAxisKey: "m",
                   },
                 },
               ],
@@ -59,7 +58,7 @@ const TDRChart: React.FC = () => {
               maintainAspectRatio: false,
               scales: {
                 x: {
-                  type: "linear", // Lineare Skalierung für numerische Daten
+                  type: "linear",
                   title: {
                     display: true,
                     text: "Entfernung (m)",
@@ -94,7 +93,7 @@ const TDRChart: React.FC = () => {
         }
       }
     });
-  }, [tdrChartData]);
+  }, [tdrChartData, selectedSlot, selectedChartType]);
 
   return (
     <div style={{ width: "100%", height: isFullScreen ? "90%" : "28rem" }}>