git commit -m "fix: Redux TypeScript Fehler behoben & automatische Mock-Daten Aktualisierung

- useAppDispatch in store.ts hinzugefügt, um AsyncThunkActions korrekt zu dispatchen
- TypeScript-Fehler in useFetchAnalogeEingaenge.ts behoben
- loadFromWindow wird jetzt regelmäßig neu geladen, um Änderungen in Mock-Daten zu übernehmen
- UI aktualisiert sich automatisch, wenn sich Werte in ae.js ändern
- Code-Struktur verbessert & Redux-Integration optimiert

Test erfolgreich: Änderungen in ae.js werden nun direkt in der UI sichtbar!"

components/main/analogeEingaenge/hooks/useFetchAnalogeEingaenge.ts

@@ -1,23 +1,25 @@
 // components/main/analogeEingaenge/hooks/useFetchAnalogeEingaenge.ts
 import { useEffect } from "react";
-import { useDispatch } from "react-redux";
+import { useAppDispatch } from "../../../../redux/store"; // ✅ Typisierte Dispatch-Funktion verwenden
 import {
   loadFromWindow,
   setAnalogeEingaenge,
 } from "../../../../redux/slices/analogeEingaengeSlice";
 
 export const useFetchAnalogeEingaenge = () => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch(); // ✅ Verwende die App-Dispatch-Funktion
 
   useEffect(() => {
     dispatch(loadFromWindow()); // Initial Mock-Daten aus `window` laden
 
     const interval = setInterval(async () => {
       try {
+        dispatch(loadFromWindow()); // 🔄 Mock-Daten regelmäßig neu laden
+
         const response = await fetch("/api/get-embedded-data");
         if (!response.ok) throw new Error("Fehler beim Abrufen der Daten");
         const data = await response.json();
-        dispatch(setAnalogeEingaenge(data));
+        dispatch(setAnalogeEingaenge(data)); // ✅ API-Daten in Redux speichern
       } catch (error) {
         console.error("Fehler beim Abruf der Sensordaten:", error);
       }

config/webVersion.ts

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

data/mockdata/analogInputs.ts

@@ -1,32 +0,0 @@
-// /data/mockdata/analogInputs.ts
-/**
- Da alle Eingänge (xioPm1Inputs, xioPm2Inputs, analogInputs) die gleiche Struktur haben, können wir ein gemeinsames Interface verwenden
- */
-import { InputData } from "./types";
-
-export const analogInputs: InputData[] = [
-  { id: 1, value: 0, name: "----", uW: true, uG: true, oW: false, oG: true },
-  {
-    id: 2,
-    value: 22.91,
-    name: "Feuchtigkeit",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: false,
-  },
-  { id: 3, value: 0, name: "----", uW: true, uG: true, oW: false, oG: true },
-  { id: 4, value: 0, name: "----", uW: true, uG: true, oW: false, oG: true },
-  { id: 5, value: 0, name: "----", uW: true, uG: true, oW: false, oG: true },
-  {
-    id: 6,
-    value: 21.0,
-    name: "Temperatur",
-    uW: true,
-    uG: true,
-    oW: false,
-    oG: false,
-  },
-  { id: 7, value: 0, name: "----", uW: true, uG: true, oW: true, oG: true },
-  { id: 8, value: 0, name: "----", uW: true, uG: true, oW: false, oG: true },
-];

data/mockdata/types.ts

@@ -1,13 +0,0 @@
-// /data/mockdata/types.ts
-/**
- Da alle Eingänge (xioPm1Inputs, xioPm2Inputs, analogInputs) die gleiche Struktur haben, können wir ein gemeinsames Interface verwenden
- */
-export interface InputData {
-  id: number;
-  value: number;
-  name: string;
-  uW: boolean;
-  uG: boolean;
-  oW: boolean;
-  oG: boolean;
-}

data/mockdata/xioPm1Inputs.ts

@@ -1,80 +0,0 @@
-// /data/mockdata/xioPm1Inputs.ts
-/**
- Da alle Eingänge (xioPm1Inputs, xioPm2Inputs, analogInputs) die gleiche Struktur haben, können wir ein gemeinsames Interface verwenden
- */
-import { InputData } from "./types";
-
-export const xioPm1Inputs: InputData[] = [
-  {
-    id: 1,
-    value: 1.34,
-    name: "Test1",
-    uW: true,
-    uG: true,
-    oW: false,
-    oG: true,
-  },
-  {
-    id: 2,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 3,
-    value: 7.94,
-    name: "----",
-    uW: false,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 4,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 5,
-    value: 6.13,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 6,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 7,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 8,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-];

data/mockdata/xioPm2Inputs.ts

@@ -1,80 +0,0 @@
-// /data/mockdata/xioPm1Inputs.ts
-/**
- Da alle Eingänge (xioPm1Inputs, xioPm2Inputs, analogInputs) die gleiche Struktur haben, können wir ein gemeinsames Interface verwenden
- */
-import { InputData } from "./types";
-
-export const xioPm2Inputs: InputData[] = [
-  {
-    id: 1,
-    value: 1.34,
-    name: "Test1",
-    uW: true,
-    uG: true,
-    oW: false,
-    oG: true,
-  },
-  {
-    id: 2,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 3,
-    value: 7.94,
-    name: "----",
-    uW: false,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 4,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 5,
-    value: 6.13,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 6,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 7,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-  {
-    id: 8,
-    value: 7.94,
-    name: "----",
-    uW: true,
-    uG: true,
-    oW: true,
-    oG: true,
-  },
-];

public/CPLmockData/SERVICE/ae.js

@@ -1,5 +1,5 @@
 // public/CPLmockData/SERVICE/ae.js
-var win_analogeEingaenge1 = [1, 0, "----", 1, 1, 0, 1]; // Eingang 1
+var win_analogeEingaenge1 = [1, 0, "Sensor1", 1, 1, 0, 1]; // Eingang 1
 var win_analogeEingaenge2 = [2, 22.91, "Feuchtigkeit", 1, 1, 1, 0]; // Eingang 2
 var win_analogeEingaenge3 = [3, 0, "----", 1, 1, 0, 1]; // Eingang 3
 var win_analogeEingaenge4 = [4, 0, "----", 1, 1, 0, 1]; // Eingang 4

redux/slices/analogeEingaengeSlice.ts

@@ -1,7 +1,6 @@
-// redux/slices/analogeEingaengeSlice.ts
+// Redux Slice: redux/slices/analogeEingaengeSlice.ts
 import { createSlice, PayloadAction, createAsyncThunk } from "@reduxjs/toolkit";
 
-// Typ für einen einzelnen analogen Eingang
 export interface AnalogerEingang {
   id: number | null;
   value: number | null;
@@ -12,19 +11,11 @@ export interface AnalogerEingang {
   oG: boolean;
 }
 
-// Typ für den Gesamt-State
 export interface AnalogeEingaengeState {
-  win_analogeEingaenge1: AnalogerEingang;
+  [key: string]: AnalogerEingang;
-  win_analogeEingaenge2: AnalogerEingang;
-  win_analogeEingaenge3: AnalogerEingang;
-  win_analogeEingaenge4: AnalogerEingang;
-  win_analogeEingaenge5: AnalogerEingang;
-  win_analogeEingaenge6: AnalogerEingang;
-  win_analogeEingaenge7: AnalogerEingang;
-  win_analogeEingaenge8: AnalogerEingang;
 }
 
-// Standardwert für einen Eingang
+// Standardwerte für Eingänge
 const defaultAnalogerEingang: AnalogerEingang = {
   id: null,
   value: null,
@@ -35,7 +26,7 @@ const defaultAnalogerEingang: AnalogerEingang = {
   oG: false,
 };
 
-// Initialer Zustand mit leeren Werten
+// Initialer Zustand
 const initialState: AnalogeEingaengeState = {
   win_analogeEingaenge1: { ...defaultAnalogerEingang },
   win_analogeEingaenge2: { ...defaultAnalogerEingang },
@@ -47,19 +38,18 @@ const initialState: AnalogeEingaengeState = {
   win_analogeEingaenge8: { ...defaultAnalogerEingang },
 };
 
-// Mock-Daten aus `window` laden
+// Dynamisch Mock-Daten aus `window` abrufen
 export const loadFromWindow = createAsyncThunk(
   "analogeEingaenge/loadFromWindow",
   async () => {
-    const entries = Object.entries(window).filter(([key]) =>
-      key.startsWith("win_analogeEingaenge")
-    );
-
     const data: Partial<AnalogeEingaengeState> = {};
 
-    entries.forEach(([key, value]) => {
+    for (let i = 1; i <= 8; i++) {
+      const key = `win_analogeEingaenge${i}`;
+      const value = (window as any)[key];
+
       if (Array.isArray(value) && value.length === 7) {
-        data[key as keyof AnalogeEingaengeState] = {
+        data[key] = {
           id: value[0],
           value: value[1],
           name: value[2],
@@ -69,7 +59,7 @@ export const loadFromWindow = createAsyncThunk(
           oG: value[6] === 1,
         };
       }
-    });
+    }
 
     return data;
   }
@@ -82,18 +72,18 @@ const analogeEingaengeSlice = createSlice({
   reducers: {
     setAnalogerEingang(
       state,
-      action: PayloadAction<{
+      action: PayloadAction<{ key: string; value: AnalogerEingang }>
-        key: keyof AnalogeEingaengeState;
-        value: AnalogerEingang;
-      }>
     ) {
       state[action.payload.key] = action.payload.value;
     },
-    resetAnalogeEingaenge(state) {
+    setAnalogeEingaenge(
-      Object.keys(state).forEach((key) => {
+      state,
-        state[key as keyof AnalogeEingaengeState] = {
+      action: PayloadAction<Partial<AnalogeEingaengeState>>
-          ...defaultAnalogerEingang,
+    ) {
-        };
+      Object.entries(action.payload).forEach(([key, value]) => {
+        if (value) {
+          state[key] = value;
+        }
       });
     },
   },
@@ -104,7 +94,7 @@ const analogeEingaengeSlice = createSlice({
   },
 });
 
-export const { setAnalogerEingang, resetAnalogeEingaenge } =
+export const { setAnalogerEingang, setAnalogeEingaenge } =
   analogeEingaengeSlice.actions;
 
 export default analogeEingaengeSlice.reducer;

redux/store.ts

@@ -1,5 +1,5 @@
-// redux/store.ts
 import { configureStore } from "@reduxjs/toolkit";
+import { useDispatch } from "react-redux";
 import authReducer from "./slices/authSlice";
 import variablesReducer from "./slices/variablesSlice";
 import kueChartModeReducer from "./slices/kueChartModeSlice";
@@ -30,5 +30,6 @@ const store = configureStore({
 
 export type RootState = ReturnType<typeof store.getState>;
 export type AppDispatch = typeof store.dispatch;
+export const useAppDispatch: () => AppDispatch = useDispatch; // ✅ Typisierte Dispatch-Funktion
 
 export default store;