// _app.js
import { useEffect } 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";

function MyApp({ Component, pageProps }) {
  useEffect(() => {
    if (typeof window !== "undefined") {
      setInterval(() => {
        loadWindowVariables();
      }, 5000);
      loadWindowVariables();
    }
  }, []);

  return (
    <div className="bg-gray-100 flex flex-col min-h-screen overflow-hidden">
      <Header />
      <div className="flex flex-grow w-full">
        <Navigation className="w-1/5" />
        <main className="flex-1 p-4">
          <Component {...pageProps} />
        </main>
      </div>
      <Footer />
    </div>
  );
}

export default MyApp;