From d901289c8d174b7a4fbead1574b454b9e676d288 Mon Sep 17 00:00:00 2001 From: ISA Date: Mon, 24 Feb 2025 08:34:38 +0100 Subject: [PATCH] utils von SettingsModal ausgelagert --- .../header/settingsModal/SettingsModal.tsx | 127 +----------------- .../settingsModal/hooks/useAdminAuth.ts | 44 ++++++ .../settingsModal/hooks/useSystemSettings.ts | 29 ++++ .../header/settingsModal/utils/cryptoUtils.ts | 28 ++++ config/webVersion.ts | 2 +- 5 files changed, 108 insertions(+), 122 deletions(-) create mode 100644 components/header/settingsModal/hooks/useAdminAuth.ts create mode 100644 components/header/settingsModal/hooks/useSystemSettings.ts create mode 100644 components/header/settingsModal/utils/cryptoUtils.ts diff --git a/components/header/settingsModal/SettingsModal.tsx b/components/header/settingsModal/SettingsModal.tsx index 619daf8..1eff96c 100644 --- a/components/header/settingsModal/SettingsModal.tsx +++ b/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 ( <> { + 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 }; +} diff --git a/components/header/settingsModal/hooks/useSystemSettings.ts b/components/header/settingsModal/hooks/useSystemSettings.ts new file mode 100644 index 0000000..9d55579 --- /dev/null +++ b/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 }; +} diff --git a/components/header/settingsModal/utils/cryptoUtils.ts b/components/header/settingsModal/utils/cryptoUtils.ts new file mode 100644 index 0000000..6b12aa5 --- /dev/null +++ b/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(); +} diff --git a/config/webVersion.ts b/config/webVersion.ts index d0362dc..a5ffa0e 100644 --- a/config/webVersion.ts +++ b/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;