utils von SettingsModal ausgelagert

components/header/settingsModal/SettingsModal.tsx

@@ -10,6 +10,9 @@ import handleSetDateTime from "./handlers/handleSetDateTime";
 import handleSubmit from "./handlers/handleSubmit";
 import bcrypt from "bcryptjs";
 import CryptoJS from "crypto-js";
+import { useAdminAuth } from "./hooks/useAdminAuth";
+import { useSystemSettings } from "./hooks/useSystemSettings";
+import { generateKeyAndIV, generateToken } from "./utils/cryptoUtils";
 
 ReactModal.setAppElement("#__next");
 
@@ -22,43 +25,10 @@ const USERS = {
   },
 };
 
-// Funktion zur Generierung eines AES-Schlüssels und IVs
-function generateKeyAndIV() {
-  const encryptionKey = process.env.NEXT_PUBLIC_ENCRYPTION_KEY;
-  const encryptionIV = process.env.NEXT_PUBLIC_ENCRYPTION_IV;
-
-  if (!encryptionKey || !encryptionIV) {
-    throw new Error("Encryption key or IV is not defined.");
-  }
-
-  const key = CryptoJS.enc.Utf8.parse(encryptionKey);
-  const iv = CryptoJS.enc.Utf8.parse(encryptionIV);
-  return { key, iv };
-}
-
-// Funktion zur Generierung eines Tokens
-function generateToken(user) {
-  const payload = {
-    username: user.username,
-    role: user.role,
-    exp: Date.now() + 5 * 60 * 1000, // Ablaufzeit: 5 Minuten
-  };
-  const token = JSON.stringify(payload);
-  const { key, iv } = generateKeyAndIV();
-  const encryptedToken = CryptoJS.AES.encrypt(token, key, { iv }).toString();
-  return encryptedToken;
-}
-
-// Funktion zur Entschlüsselung des Tokens
-function decryptToken(encryptedToken) {
-  const { key, iv } = generateKeyAndIV();
-  const bytes = CryptoJS.AES.decrypt(encryptedToken, key, { iv });
-  const decryptedToken = bytes.toString(CryptoJS.enc.Utf8);
-  return JSON.parse(decryptedToken);
-}
-
 function SettingModal({ showModal, onClose }) {
-  const [isAdminLoggedIn, setAdminLoggedIn] = useState(false);
+  const { isAdminLoggedIn, setAdminLoggedIn } = useAdminAuth(showModal);
+  const { formValues, setFormValues } = useSystemSettings(showModal);
+
   const [username, setUsername] = useState("");
   const [password, setPassword] = useState("");
   const [error, setError] = useState("");
@@ -82,24 +52,6 @@ function SettingModal({ showModal, onClose }) {
     });
   }
 
-  useEffect(() => {
-    if (showModal) {
-      const token = sessionStorage.getItem("token");
-      if (token) {
-        try {
-          const { exp } = decryptToken(token);
-          if (Date.now() < exp) {
-            setAdminLoggedIn(true);
-          } else {
-            sessionStorage.removeItem("token");
-            localStorage.setItem("isAdminLoggedIn", "false");
-          }
-        } catch (error) {
-          console.error("Token-Entschlüsselung fehlgeschlagen:", error);
-        }
-      }
-    }
-  }, [showModal]);
   const deviceName_Redux = useSelector(
     (state: RootState) => state.systemSettings.deviceName
   );
@@ -161,73 +113,6 @@ function SettingModal({ showModal, onClose }) {
     localStorage.setItem("isAdminLoggedIn", "false"); // Admin-Status im localStorage setzen
   };
 
-  useEffect(() => {
-    if (showModal) {
-      setName(deviceName_Redux || "");
-      setMac1(mac1_Redux || "");
-      setIp(ip_Redux || "");
-      setSubnet(subnet_Redux || "");
-      setGateway(gateway_Redux || "");
-      setSystemUhr(datetime_Redux || "");
-      setNtp1(ntp1_Redux || "");
-      setNtp2(ntp2_Redux || "");
-      setNtp3(ntp3_Redux || "");
-      setNtpTimezone(ntpTimezone_Redux || "");
-      setActive(active_Redux || "");
-    }
-  }, [showModal]);
-
-  useEffect(() => {
-    setOriginalValues({
-      name: deviceName_Redux,
-      ip: ip_Redux,
-      subnet: subnet_Redux,
-      gateway: gateway_Redux,
-      ntp1: ntp1_Redux,
-      ntp2: ntp2_Redux,
-      ntp3: ntp3_Redux,
-      ntpTimezone: ntpTimezone_Redux,
-      active: active_Redux,
-    });
-  }, [
-    deviceName_Redux,
-    ip_Redux,
-    subnet_Redux,
-    gateway_Redux,
-    ntp1_Redux,
-    ntp2_Redux,
-    ntp3_Redux,
-    ntpTimezone_Redux,
-    active_Redux,
-  ]);
-
-  useEffect(() => {
-    // Überprüfen, ob ein Token im SessionStorage vorhanden ist
-    const token = sessionStorage.getItem("token");
-    if (token) {
-      try {
-        // Token mit CryptoJS entschlüsseln
-        const bytes = CryptoJS.AES.decrypt(
-          token,
-          process.env.NEXT_PUBLIC_ENCRYPTION_KEY
-        );
-        const decryptedToken = JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
-
-        // Ablaufzeit überprüfen
-        if (Date.now() < decryptedToken.exp) {
-          setAdminLoggedIn(true);
-        } else {
-          // Token ist abgelaufen
-          sessionStorage.removeItem("token");
-          setAdminLoggedIn(false);
-        }
-      } catch (error) {
-        console.error("Fehler beim Entschlüsseln des Tokens:", error);
-        setAdminLoggedIn(false);
-      }
-    }
-  }, []);
-
   return (
     <>
       <ReactModal

components/header/settingsModal/hooks/useAdminAuth.ts

@@ -0,0 +1,44 @@
+// components/header/settingsModal/hooks/useAdminAuth.ts
+import { useState, useEffect } from "react";
+import CryptoJS from "crypto-js";
+
+function decryptToken(encryptedToken: string) {
+  const encryptionKey = process.env.NEXT_PUBLIC_ENCRYPTION_KEY;
+  const encryptionIV = process.env.NEXT_PUBLIC_ENCRYPTION_IV;
+
+  if (!encryptionKey || !encryptionIV) {
+    throw new Error("Encryption key or IV is not defined.");
+  }
+
+  const key = CryptoJS.enc.Utf8.parse(encryptionKey);
+  const iv = CryptoJS.enc.Utf8.parse(encryptionIV);
+
+  const bytes = CryptoJS.AES.decrypt(encryptedToken, key, { iv });
+  return JSON.parse(bytes.toString(CryptoJS.enc.Utf8));
+}
+
+export function useAdminAuth(showModal: boolean) {
+  const [isAdminLoggedIn, setAdminLoggedIn] = useState(false);
+
+  useEffect(() => {
+    if (showModal) {
+      const token = sessionStorage.getItem("token");
+      if (token) {
+        try {
+          const { exp } = decryptToken(token);
+          if (Date.now() < exp) {
+            setAdminLoggedIn(true);
+          } else {
+            sessionStorage.removeItem("token");
+            setAdminLoggedIn(false);
+          }
+        } catch (error) {
+          console.error("Token-Entschlüsselung fehlgeschlagen:", error);
+          setAdminLoggedIn(false);
+        }
+      }
+    }
+  }, [showModal]);
+
+  return { isAdminLoggedIn, setAdminLoggedIn };
+}

components/header/settingsModal/hooks/useSystemSettings.ts

@@ -0,0 +1,29 @@
+// components/header/settingsModal/hooks/useSystemSettings.ts
+import { useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+import { RootState } from "../../../../redux/store";
+
+export function useSystemSettings(showModal: boolean) {
+  const settings = useSelector((state: RootState) => state.systemSettings);
+  const [formValues, setFormValues] = useState(settings);
+  const [originalValues, setOriginalValues] = useState({});
+
+  useEffect(() => {
+    if (showModal) {
+      setFormValues(settings);
+      setOriginalValues({
+        name: settings.deviceName,
+        ip: settings.ip,
+        subnet: settings.subnet,
+        gateway: settings.gateway,
+        ntp1: settings.ntp1,
+        ntp2: settings.ntp2,
+        ntp3: settings.ntp3,
+        ntpTimezone: settings.ntpTimezone,
+        active: settings.ntpActive,
+      });
+    }
+  }, [showModal, settings]);
+
+  return { formValues, setFormValues, originalValues };
+}

components/header/settingsModal/utils/cryptoUtils.ts

@@ -0,0 +1,28 @@
+// components/header/settingsModal/utils/cryptoUtils.ts
+import CryptoJS from "crypto-js";
+
+// Generiert den Schlüssel und IV für AES-Verschlüsselung
+export function generateKeyAndIV() {
+  const encryptionKey = process.env.NEXT_PUBLIC_ENCRYPTION_KEY;
+  const encryptionIV = process.env.NEXT_PUBLIC_ENCRYPTION_IV;
+
+  if (!encryptionKey || !encryptionIV) {
+    throw new Error("Encryption key or IV is not defined.");
+  }
+
+  const key = CryptoJS.enc.Utf8.parse(encryptionKey);
+  const iv = CryptoJS.enc.Utf8.parse(encryptionIV);
+  return { key, iv };
+}
+
+// Generiert einen verschlüsselten Token
+export function generateToken(user) {
+  const payload = {
+    username: user.username,
+    role: user.role,
+    exp: Date.now() + 5 * 60 * 1000, // Ablaufzeit: 5 Minuten
+  };
+  const token = JSON.stringify(payload);
+  const { key, iv } = generateKeyAndIV();
+  return CryptoJS.AES.encrypt(token, key, { iv }).toString();
+}

config/webVersion.ts

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