Letzte TDR-Messung anzeigen für ausgewählte Slot

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

@@ -1,15 +1,10 @@
 // /components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx
 import React, { useState, useEffect } from "react";
-import { useDispatch, useSelector } from "react-redux";
+import { useSelector } from "react-redux";
 import { useAppDispatch } from "../../../../../../redux/store";
-
 import { RootState } from "../../../../../../redux/store";
-import { fetchTDRChartDataById } from "../../../../../../services/fetchTDRChartDataById";
-import {
-  setTDRChartDataById,
-  setSelectedTDRId,
-} from "../../../../../../redux/slices/tdrDataByIdSlice";
-import { fetchTDMDataBySlotThunk } from "../../../../../../redux/thunks/fetchTDMDataBySlotThunk";
+import { fetchTDMDataBySlotThunk } from "../../../../../../redux/thunks/fetchTDMListBySlotThunk";
+import { fetchTDRChartDataByIdThunk } from "../../../../../../redux/thunks/fetchTDRChartDataByIdThunk";
 
 const TDRChartActionBar: React.FC = () => {
   const dispatch = useAppDispatch();
@@ -23,63 +18,53 @@ const TDRChartActionBar: React.FC = () => {
     selectedSlot !== null ? tdmChartData[selectedSlot] ?? [] : [];
 
   const [selectedId, setSelectedId] = useState<number | null>(null);
-  //-------------------------------
-  const handleSelectChange = async (
-    e: React.ChangeEvent<HTMLSelectElement>
-  ) => {
+
+  // Dropdown-Auswahl: Neue ID auswählen
+  const handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
     const id = parseInt(e.target.value);
     setSelectedId(id);
-
-    const data = await fetchTDRChartDataById(id);
-    if (!data) return;
-
-    dispatch(setTDRChartDataById({ id, data }));
-    dispatch(setSelectedTDRId(id));
+    dispatch(fetchTDRChartDataByIdThunk(id));
   };
-  //-------------------------------
-  const handleReset = () => {
-    setSelectedId(null);
-    dispatch(setSelectedTDRId(-1)); // z. B. -1 als „Reset“-Kennzeichnung
-  };
-  //-------------------------------
+
+  // Button: Als Referenzkurve setzen
   const handleSetReference = async () => {
     if (selectedId === null || selectedSlot === null) return;
 
     const url = `${window.location.origin}/CPL?seite.ACP&KTR${selectedSlot}=${selectedId}`;
-
     try {
       const response = await fetch(url);
       if (!response.ok) throw new Error("Fehler beim Setzen der Referenzkurve");
-
       alert("✅ Referenzkurve erfolgreich gesetzt.");
     } catch (error) {
       console.error("❌ Fehler:", error);
       alert("❌ Referenzkurve konnte nicht gesetzt werden.");
     }
   };
-  //-------------------------------
+
+  // Automatisch neueste ID laden, wenn Slot sich ändert
   useEffect(() => {
     if (selectedSlot !== null) {
-      dispatch(fetchTDMDataBySlotThunk(selectedSlot));
+      dispatch(fetchTDMDataBySlotThunk(selectedSlot)).then((action: any) => {
+        const slotData = action.payload?.data;
+        if (slotData?.length > 0) {
+          const lastId = slotData[0].id;
+          setSelectedId(lastId);
+          dispatch(fetchTDRChartDataByIdThunk(lastId));
+        }
+      });
     }
-  }, [selectedSlot]);
-  //--------------------------------
+  }, [selectedSlot, dispatch]);
+
   return (
     <div className="flex justify-between items-center p-2 bg-gray-100 rounded-lg space-x-4">
-      {/* Ausgewählte Slot Nummer anzeigen */}
+      {/* Ausgewählter Slot */}
       <div className="text-sm font-semibold">
         {selectedSlot !== null
           ? `Slot ${selectedSlot + 1}`
           : "Kein Slot gewählt"}
       </div>
 
-      {/* 🔵 Linke Seite: Reset-Button */}
-      <button
-        className="border border-gray-300 bg-white rounded px-3 py-1 text-sm hover:bg-gray-200"
-        onClick={handleReset}
-      >
-        Letzte Messung
-      </button>
+      {/* Button: Als Referenzkurve setzen */}
       {selectedId !== null && (
         <button
           onClick={handleSetReference}
@@ -89,7 +74,7 @@ const TDRChartActionBar: React.FC = () => {
         </button>
       )}
 
-      {/* 🔵 Rechte Seite: Dropdown */}
+      {/* Dropdown für Messungsauswahl */}
       <div className="flex items-center space-x-2">
         <label htmlFor="tdrIdSelect" className="text-sm font-semibold">
           Messung ID