feat: Projekt von JavaScript zu TypeScript migriert

pages/_app.tsx

@@ -0,0 +1,62 @@
+// pages/_app.tsx
+import { useEffect, useState } from "react";
+import { loadWindowVariables } from "../utils/loadWindowVariables";
+import Header from "../components/Header";
+import Navigation from "../components/Navigation";
+import Footer from "../components/Footer";
+import "../styles/globals.css";
+import { Provider } from "react-redux";
+import { setVariables } from "../store/variablesSlice";
+import store from "../store/store";
+import { AppProps } from "next/app";
+
+function MyApp({ Component, pageProps }: AppProps) {
+  const [sessionExpired, setSessionExpired] = useState(false);
+
+  useEffect(() => {
+    const loadAndStoreVariables = async () => {
+      try {
+        const variables = await loadWindowVariables();
+        if (!variables) throw new Error("Sitzungsfehler"); // Fehler werfen, wenn keine Variablen geladen werden
+        store.dispatch(setVariables(variables));
+        setSessionExpired(false); // Sitzung ist aktiv
+      } catch (error) {
+        console.error("Fehler beim Laden der Sitzung:", error);
+        setSessionExpired(true); // Sitzung ist abgelaufen oder fehlgeschlagen
+      }
+    };
+
+    if (typeof window !== "undefined") {
+      loadAndStoreVariables(); // Initiales Laden
+
+      // Intervall zum Aktualisieren des Redux-Stores alle 10 Sekunden
+      const intervalId = setInterval(loadAndStoreVariables, 10000);
+
+      // Bereinigen des Intervalls, wenn die Komponente unmountet wird
+      return () => clearInterval(intervalId);
+    }
+  }, []);
+
+  return (
+    <Provider store={store}>
+      <div className="flex flex-col h-screen overflow-hidden">
+        <Header />
+        <div className="flex flex-grow w-full">
+          <Navigation className="w-1/5" />
+          <main className="w-full flex-grow">
+            {sessionExpired && (
+              <div className="bg-red-500 text-white p-4 text-center">
+                Ihre Sitzung ist abgelaufen oder die Verbindung ist
+                unterbrochen. Bitte laden Sie die Seite neu.
+              </div>
+            )}
+            <Component {...pageProps} />
+          </main>
+        </div>
+        <Footer />
+      </div>
+    </Provider>
+  );
+}
+
+export default MyApp;