feat(analogInputs): automatisches Laden der Chart-Daten bei Tabellenklick via Redux

- analogInputsHistorySlice um `autoLoad` erweitert, um automatisches Laden zu triggern
- handleSelect in AnalogInputsTable dispatcht jetzt `setAutoLoad(true)`
- AnalogInputsChart lauscht auf `autoLoad` + `selectedId` und lädt Daten automatisch
- `autoLoad` wird nach dem Laden wieder auf false zurückgesetzt

components/main/analogInputs/AnalogInputsTable.tsx

@@ -9,7 +9,10 @@ import settingsIcon from "@iconify/icons-mdi/settings";
 import waveformIcon from "@iconify/icons-mdi/waveform";
 import { setSelectedAnalogInput } from "@/redux/slices/analogInputs/selectedAnalogInputSlice";
 import { setIsSettingsModalOpen } from "@/redux/slices/analogInputs/analogInputsUiSlice";
-import { setSelectedId } from "@/redux/slices/analogInputs/analogInputsHistorySlice";
+import {
+  setSelectedId,
+  setAutoLoad,
+} from "@/redux/slices/analogInputs/analogInputsHistorySlice";
 
 export default function AnalogInputsTable() {
   const dispatch = useDispatch<AppDispatch>();
@@ -25,10 +28,10 @@ export default function AnalogInputsTable() {
   );
 
   const handleSelect = (id: number, input: AnalogInput) => {
-    dispatch(setIsSettingsModalOpen(true));
     dispatch(setSelectedId(id));
     setActiveId(id);
     dispatch(setSelectedAnalogInput(input));
+    dispatch(setAutoLoad(true));
   };
 
   return (
@@ -54,48 +57,60 @@ export default function AnalogInputsTable() {
           <tbody>
             {Object.values(analogInputs)
               .filter(
-                (e) =>
-                  e && typeof e.id === "number" && typeof e.label === "string"
+                (analogInput) =>
+                  analogInput &&
+                  typeof analogInput.id === "number" &&
+                  typeof analogInput.label === "string"
               )
               .slice(0, 8)
-              .map((e, index) => (
+              .map((analogInput, index) => (
                 <tr
                   key={index}
                   className={`transition cursor-pointer ${
-                    e.id === activeId ? "bg-blue-100" : "hover:bg-gray-100"
+                    analogInput.id === activeId
+                      ? "bg-blue-100"
+                      : "hover:bg-gray-100"
                   }`}
                 >
                   <td
                     className="border p-2"
-                    onClick={() => handleSelect(e.id!, e)}
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
                   >
                     <div className="flex items-center gap-1 ">
                       <Icon
                         icon={waveformIcon}
                         className="text-gray-600 text-base laptop:text-sm xl:text-sm 2xl:text-lg"
                       />
-                      {e.id ?? "-"}
+                      {analogInput.id ?? "-"}
                     </div>
                   </td>
                   <td
                     className="border p-2 text-right"
-                    onClick={() => handleSelect(e.id!, e)}
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
                   >
-                    {typeof e.value === "number" ? e.value.toFixed(2) : "-"}
+                    {typeof analogInput.value === "number"
+                      ? analogInput.value.toFixed(2)
+                      : "-"}
                   </td>
 
-                  <td className="border p-2">{e.unit || "-"}</td>
                   <td
                     className="border p-2"
-                    onClick={() => handleSelect(e.id!, e)}
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
                   >
-                    {e.label || "----"}
+                    {analogInput.unit || "-"}
+                  </td>
+                  <td
+                    className="border p-2"
+                    onClick={() => handleSelect(analogInput.id!, analogInput)}
+                  >
+                    {analogInput.label || "----"}
                   </td>
 
                   <td className="border p-2 text-center">
                     <button
                       onClick={() => {
-                        handleSelect(e.id!, e);
+                        handleSelect(analogInput.id!, analogInput);
+                        dispatch(setIsSettingsModalOpen(true));
                       }}
                       className="text-gray-400 hover:text-gray-500"
                     >