fix: Echtzeit-Aktualisierung des Admin-Status implementiert

- Intervall-basierte Überprüfung von `localStorage` hinzugefügt, um Änderungen am Admin-Status (`isAdminLoggedIn`) sofort zu synchronisieren.
- Zustand `isAdminLoggedIn` wird nun direkt nach Login/Logout aktualisiert.
- Weiterleitung zu `/offline.html` nach Logout integriert.
- Problem behoben, dass "Admin-Modus aktiv" erst nach einem Neuladen angezeigt wurde.

components/Header.jsx

@@ -9,35 +9,43 @@ import { useSelector } from "react-redux";
 function Header() {
   const router = useRouter();
   const [showSettingsModal, setShowSettingsModal] = useState(false);
-  const [isAdminLoggedIn, setIsAdminLoggedIn] = useState(false); // Lokaler Zustand
+  const [isAdminLoggedIn, setIsAdminLoggedIn] = useState(false);
   const deviceName = useSelector((state) => state.variables.deviceName);
 
   const handleSettingsClick = () => setShowSettingsModal(true);
   const handleCloseSettingsModal = () => setShowSettingsModal(false);
+
   const handleLogout = () => {
-    sessionStorage.removeItem("token"); // Token entfernen beim Abmelden
+    sessionStorage.removeItem("token"); // Token entfernen
-    setIsAdminLoggedIn(false); // Admin-Status zurücksetzen
+    localStorage.setItem("isAdminLoggedIn", "false"); // Admin-Status entfernen
-    window.location.href = "/offline.html";
+    setIsAdminLoggedIn(false); // Zustand sofort aktualisieren
+    router.push("/offline.html"); // Weiterleitung
+  };
+
+  const handleLogin = () => {
+    const token = JSON.stringify({ exp: Date.now() + 5 * 60 * 1000 }); // Beispiel-Token mit 5 Minuten Ablaufzeit
+    sessionStorage.setItem("token", token); // Token speichern
+    localStorage.setItem("isAdminLoggedIn", "true"); // Admin-Status setzen
+    setIsAdminLoggedIn(true); // Zustand sofort aktualisieren
   };
 
-  // Funktion, um den Token-Status zu prüfen
   useEffect(() => {
-    const token = sessionStorage.getItem("token");
+    // Initialer Check beim Laden der Komponente
-    if (token) {
+    const isAdmin = localStorage.getItem("isAdminLoggedIn") === "true";
-      try {
+    setIsAdminLoggedIn(isAdmin);
-        const { exp } = JSON.parse(atob(token));
+
-        if (Date.now() < exp) {
+    // Beobachten von Änderungen in localStorage
-          setIsAdminLoggedIn(true); // Admin eingeloggt
+    const interval = setInterval(() => {
-        } else {
+      const updatedIsAdmin = localStorage.getItem("isAdminLoggedIn") === "true";
-          sessionStorage.removeItem("token"); // Entferne abgelaufenen Token
+      if (updatedIsAdmin !== isAdminLoggedIn) {
-          setIsAdminLoggedIn(false);
+        setIsAdminLoggedIn(updatedIsAdmin);
-        }
-      } catch (error) {
-        console.error("Fehler beim Verarbeiten des Tokens:", error);
-        setIsAdminLoggedIn(false);
       }
-    }
+    }, 500); // Überprüfung alle 500ms
-  }, []);
+
+    return () => {
+      clearInterval(interval); // Intervall stoppen, wenn die Komponente entladen wird
+    };
+  }, [isAdminLoggedIn]);
 
   return (
     <header className="bg-gray-300 flex justify-between items-center w-full h-28 relative text-black">
@@ -70,12 +78,21 @@ function Header() {
           </button>
         </div>
         <div className="flex items-center justify-end w-full space-x-2">
-          <button
+          {!isAdminLoggedIn ? (
-            onClick={handleLogout}
+            <button
-            className="bg-littwin-blue text-white px-4 py-2 rounded"
+              onClick={handleLogin}
-          >
+              className="bg-littwin-blue text-white px-4 py-2 rounded"
-            Abmelden
+            >
-          </button>
+              Anmelden
+            </button>
+          ) : (
+            <button
+              onClick={handleLogout}
+              className="bg-littwin-blue text-white px-4 py-2 rounded"
+            >
+              Abmelden
+            </button>
+          )}
         </div>
       </div>
 

components/modales/settingsModal/SettingsModal.jsx

@@ -48,6 +48,7 @@ function SettingModal({ showModal, onClose }) {
       if (isMatch) {
         const token = generateToken(user);
         sessionStorage.setItem("token", token); // Speichere Token in SessionStorage
+        localStorage.setItem("isAdminLoggedIn", "true");
 
         setShowLoginForm(false);
         onClose();
@@ -97,7 +98,8 @@ function SettingModal({ showModal, onClose }) {
     active,
   };
   const handleAdminLogout = () => {
-    localStorage.removeItem("token"); // Remove token on logout
+    sessionStorage.removeItem("token"); // Token aus sessionStorage entfernen
+    localStorage.setItem("isAdminLoggedIn", "false"); // Admin-Status im localStorage setzen
   };
 
   useEffect(() => {