feat: Redux-Thunk für digitale Eingänge integriert & UI mit zwei Tabellen umgesetzt
- `fetchDigitaleEingaengeThunk.ts` erstellt, um digitale Eingänge in Redux zu speichern.
- `fetchDigitaleEingaenge.ts` erstellt, um API-Daten aus `de.js` zu laden.
- `digitalInputsSlice.ts` hinzugefügt, um digitale Eingänge in Redux zu verwalten.
- `DigitalInputs.tsx` überarbeitet: Zwei Tabellen für digitale Eingänge hinzugefügt.
- Sicherstellung, dass Redux-Thunk nur im Client (`useEffect`) ausgeführt wird.
- API-Calls werden nun alle 10 Sekunden aktualisiert.
✅ Jetzt läuft Redux-Thunk stabil & effizient für digitale Eingänge!
This commit is contained in:
@@ -4,7 +4,6 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { Provider } from "react-redux";
|
||||
import store, { useAppDispatch } from "../redux/store";
|
||||
import { fetchAnalogeEingaengeThunk } from "../redux/thunks/fetchAnalogeEingaengeThunk";
|
||||
import { loadWindowVariables } from "../utils/loadWindowVariables";
|
||||
import Header from "../components/header/Header";
|
||||
import Navigation from "../components/navigation/Navigation";
|
||||
@@ -19,6 +18,8 @@ import {
|
||||
setOpcUaActiveClientCount,
|
||||
setOpcUaNodesetName,
|
||||
} from "../redux/slices/opcuaSettingsSlice";
|
||||
import { fetchAnalogeEingaengeThunk } from "../redux/thunks/fetchAnalogeEingaengeThunk";
|
||||
import { fetchDigitaleEingaengeThunk } from "../redux/thunks/fetchDigitaleEingaengeThunk";
|
||||
|
||||
function MyApp({ Component, pageProps }: AppProps) {
|
||||
return (
|
||||
@@ -95,7 +96,7 @@ function AppContent({ Component, pageProps }: AppProps) {
|
||||
return () => clearInterval(intervalId);
|
||||
}
|
||||
}, []);
|
||||
|
||||
//---------------------------------------------------------
|
||||
useEffect(() => {
|
||||
if (typeof window !== "undefined") {
|
||||
dispatch(fetchAnalogeEingaengeThunk());
|
||||
@@ -105,7 +106,17 @@ function AppContent({ Component, pageProps }: AppProps) {
|
||||
return () => clearInterval(interval);
|
||||
}
|
||||
}, [dispatch]);
|
||||
|
||||
//---------------------------------------------------------
|
||||
useEffect(() => {
|
||||
if (typeof window !== "undefined") {
|
||||
dispatch(fetchDigitaleEingaengeThunk());
|
||||
const interval = setInterval(() => {
|
||||
dispatch(fetchDigitaleEingaengeThunk());
|
||||
}, 10000);
|
||||
return () => clearInterval(interval);
|
||||
}
|
||||
}, [dispatch]);
|
||||
//---------------------------------------------------------
|
||||
return (
|
||||
<div className="flex flex-col h-screen overflow-hidden">
|
||||
<WindowVariablesInitializer />
|
||||
|
||||
Reference in New Issue
Block a user