From 06c20fa95073b95e02e1ceb8dec5faf646df5b9b Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Fri, 23 Aug 2024 18:09:16 +0200
Subject: [PATCH 01/20] Add dynamic value to input

---
 src/components/Form/FormInput.tsx | 1 +
 src/components/UI/Input.tsx       | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/Form/FormInput.tsx b/src/components/Form/FormInput.tsx
index fced1b00..33ba8ccd 100644
--- a/src/components/Form/FormInput.tsx
+++ b/src/components/Form/FormInput.tsx
@@ -9,6 +9,7 @@ import { Controller, type FieldValues } from "react-hook-form";
 export interface InputFieldProps<T> extends BaseFormBuilderProps<T> {
   type: "text" | "number" | "password";
   properties?: {
+    value?: string;
     prefix?: string;
     suffix?: string;
     step?: number;
diff --git a/src/components/UI/Input.tsx b/src/components/UI/Input.tsx
index 2c3080fb..630a6364 100644
--- a/src/components/UI/Input.tsx
+++ b/src/components/UI/Input.tsx
@@ -31,7 +31,7 @@ export interface InputProps
 }
 
 const Input = React.forwardRef<HTMLInputElement, InputProps>(
-  ({ className, variant, prefix, suffix, action, ...props }, ref) => {
+  ({ className, value, variant, prefix, suffix, action, ...props }, ref) => {
     return (
       <div className="relative w-full">
         {prefix && (
@@ -45,6 +45,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
             className,
             inputVariants({ variant }),
           )}
+          value={value}
           ref={ref}
           {...props}
         />

From 0911df6b0d583330e0686b83241257725ae67ec7 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Fri, 23 Aug 2024 18:31:41 +0200
Subject: [PATCH 02/20] Add dynamic bit to password generator

---
 src/components/Form/FormPasswordGenerator.tsx |  2 ++
 src/components/UI/Generator.tsx               | 20 ++++++++++---------
 2 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/Form/FormPasswordGenerator.tsx b/src/components/Form/FormPasswordGenerator.tsx
index a94b0215..cf05f806 100644
--- a/src/components/Form/FormPasswordGenerator.tsx
+++ b/src/components/Form/FormPasswordGenerator.tsx
@@ -9,6 +9,7 @@ import { Controller, type FieldValues } from "react-hook-form";
 export interface PasswordGeneratorProps<T> extends BaseFormBuilderProps<T> {
   type: "passwordGenerator";
   hide?: boolean;
+  bits?: { text: string; value: string; key: string }[];
   devicePSKBitCount: number;
   inputChange: ChangeEventHandler;
   selectChange: (event: string) => void;
@@ -28,6 +29,7 @@ export function PasswordGenerator<T extends FieldValues>({
         <Generator
           hide={field.hide}
           devicePSKBitCount={field.devicePSKBitCount}
+          bits={field.bits}
           inputChange={field.inputChange}
           selectChange={field.selectChange}
           buttonClick={field.buttonClick}
diff --git a/src/components/UI/Generator.tsx b/src/components/UI/Generator.tsx
index 0e8b1e0d..07ea3ed2 100644
--- a/src/components/UI/Generator.tsx
+++ b/src/components/UI/Generator.tsx
@@ -17,6 +17,7 @@ export interface GeneratorProps extends React.BaseHTMLAttributes<HTMLElement> {
   value: string;
   variant: "default" | "invalid";
   buttonText?: string;
+  bits?: { text: string; value: string; key: string }[];
   selectChange: (event: string) => void;
   inputChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
   buttonClick: React.MouseEventHandler<HTMLButtonElement>;
@@ -35,6 +36,11 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
       variant,
       value,
       buttonText,
+      bits = [
+        { text: "256 bit", value: "32", key: "bit256" },
+        { text: "128 bit", value: "16", key: "bit128" },
+        { text: "8 bit", value: "1", key: "bit8" },
+      ],
       selectChange,
       inputChange,
       buttonClick,
@@ -63,15 +69,11 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
             <SelectValue />
           </SelectTrigger>
           <SelectContent>
-            <SelectItem key="bit256" value="32">
-              256 bit
-            </SelectItem>
-            <SelectItem key="bit128" value="16">
-              128 bit
-            </SelectItem>
-            <SelectItem key="bit8" value="1">
-              8 bit
-            </SelectItem>
+            {bits.map(({ text, value, key }) => (
+              <SelectItem key={key} value={value}>
+                {text}
+              </SelectItem>
+            ))}
           </SelectContent>
         </Select>
         <Button

From 8c4c8a760e65c805cb58bc5243a2a683da83f77e Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Fri, 23 Aug 2024 18:32:29 +0200
Subject: [PATCH 03/20] Add @noble/curves

---
 package.json   |  1 +
 pnpm-lock.yaml | 16 ++++++++++++++++
 2 files changed, 17 insertions(+)

diff --git a/package.json b/package.json
index 5ef708e7..ea5a4169 100644
--- a/package.json
+++ b/package.json
@@ -24,6 +24,7 @@
     "@bufbuild/protobuf": "^1.10.0",
     "@emeraldpay/hashicon-react": "^0.5.2",
     "@meshtastic/js": "2.3.7-1",
+    "@noble/curves": "^1.5.0",
     "@radix-ui/react-accordion": "^1.2.0",
     "@radix-ui/react-checkbox": "^1.1.0",
     "@radix-ui/react-dialog": "^1.1.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 8a5e82b6..8c520c9b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -17,6 +17,9 @@ importers:
       '@meshtastic/js':
         specifier: 2.3.7-1
         version: 2.3.7-1
+      '@noble/curves':
+        specifier: ^1.5.0
+        version: 1.5.0
       '@radix-ui/react-accordion':
         specifier: ^1.2.0
         version: 1.2.0(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -584,6 +587,13 @@ packages:
   '@meshtastic/js@2.3.7-1':
     resolution: {integrity: sha512-pv+Xk6HkKrScCrQp31k5QOUYozabXn6NhXN7c7Cc9ysG94U1wGtfueRbEbFxXCHO3JshNz0CdE1FcSMnrLMjsQ==}
 
+  '@noble/curves@1.5.0':
+    resolution: {integrity: sha512-J5EKamIHnKPyClwVrzmaf5wSdQXgdHcPZIZLu3bwnbeCx8/7NPK5q2ZBWF+5FvYGByjiQQsJYX6jfgB2wDPn3A==}
+
+  '@noble/hashes@1.4.0':
+    resolution: {integrity: sha512-V1JJ1WTRUqHHrOSh597hURcMqVKVGL/ea3kv0gSnEdsEZ0/+VyPghM1lMNGc00z7CIQorSvbKpuJkxvuHbvdbg==}
+    engines: {node: '>= 16'}
+
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
     engines: {node: '>= 8'}
@@ -3485,6 +3495,12 @@ snapshots:
     transitivePeerDependencies:
       - buffer
 
+  '@noble/curves@1.5.0':
+    dependencies:
+      '@noble/hashes': 1.4.0
+
+  '@noble/hashes@1.4.0': {}
+
   '@nodelib/fs.scandir@2.1.5':
     dependencies:
       '@nodelib/fs.stat': 2.0.5

From 22cd5aa88de3ae3934d0a268cb2d823f52980f19 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Fri, 23 Aug 2024 18:33:13 +0200
Subject: [PATCH 04/20] Add key generation

---
 .../PageComponents/Config/Security.tsx        | 45 ++++++++++---------
 src/core/utils/x25519.ts                      |  9 ++++
 2 files changed, 32 insertions(+), 22 deletions(-)
 create mode 100644 src/core/utils/x25519.ts

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index a82ed980..9c770f43 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -1,4 +1,8 @@
 import { DynamicForm } from "@app/components/Form/DynamicForm.js";
+import {
+  getX25519PrivateKey,
+  getX25519PublicKey,
+} from "@app/core/utils/x25519";
 import type { SecurityValidation } from "@app/validation/config/security.js";
 import { useDevice } from "@core/stores/deviceStore.js";
 import { Protobuf } from "@meshtastic/js";
@@ -50,22 +54,25 @@ export const Security = (): JSX.Element => {
     );
   };
 
-  const clickEvent = (
-    setKey: (value: React.SetStateAction<string>) => void,
-    bitCount: number,
-    setValidationText: (
-      value: React.SetStateAction<string | undefined>,
-    ) => void,
-  ) => {
-    setKey(
+  const privateKeyClickEvent = () => {
+    const privateKey = getX25519PrivateKey();
+    const publicKey = getX25519PublicKey(privateKey);
+
+    setPrivateKey(fromByteArray(privateKey));
+    setPublicKey(fromByteArray(publicKey));
+    setPrivateKeyValidationText(undefined);
+  };
+
+  const adminKeyClickEvent = () => {
+    setAdminKey(
       btoa(
         cryptoRandomString({
-          length: bitCount ?? 0,
+          length: adminKeyBitCount ?? 0,
           type: "alphanumeric",
         }),
       ),
     );
-    setValidationText(undefined);
+    setAdminKeyValidationText(undefined);
   };
 
   const validatePass = (
@@ -129,17 +136,13 @@ export const Security = (): JSX.Element => {
               name: "privateKey",
               label: "Private Key",
               description: "Used to create a shared key with a remote device",
+              bits: [{ text: "128 bit", value: "16", key: "bit128" }],
               validationText: privateKeyValidationText,
               devicePSKBitCount: privateKeyBitCount,
               inputChange: privateKeyInputChangeEvent,
               selectChange: privateKeySelectChangeEvent,
               hide: !privateKeyVisible,
-              buttonClick: () =>
-                clickEvent(
-                  setPrivateKey,
-                  privateKeyBitCount,
-                  setPrivateKeyValidationText,
-                ),
+              buttonClick: privateKeyClickEvent,
               disabledBy: [
                 {
                   fieldName: "adminChannelEnabled",
@@ -161,6 +164,9 @@ export const Security = (): JSX.Element => {
               description:
                 "Sent out to other nodes on the mesh to allow them to compute a shared secret key",
               disabledBy: [{ fieldName: "always" }],
+              properties: {
+                value: publicKey,
+              },
             },
           ],
         },
@@ -193,12 +199,7 @@ export const Security = (): JSX.Element => {
               inputChange: adminKeyInputChangeEvent,
               selectChange: adminKeySelectChangeEvent,
               hide: !adminKeyVisible,
-              buttonClick: () =>
-                clickEvent(
-                  setAdminKey,
-                  adminKeyBitCount,
-                  setAdminKeyValidationText,
-                ),
+              buttonClick: adminKeyClickEvent,
               disabledBy: [{ fieldName: "adminChannelEnabled" }],
               properties: {
                 value: adminKey,
diff --git a/src/core/utils/x25519.ts b/src/core/utils/x25519.ts
new file mode 100644
index 00000000..d9ae20b5
--- /dev/null
+++ b/src/core/utils/x25519.ts
@@ -0,0 +1,9 @@
+import { x25519 } from "@noble/curves/ed25519";
+
+export function getX25519PrivateKey(): Uint8Array {
+  return x25519.utils.randomPrivateKey();
+}
+
+export function getX25519PublicKey(privateKey: Uint8Array): Uint8Array {
+  return x25519.getPublicKey(privateKey);
+}

From afc45588fa47a6db7161ec56fd8708fbbdcb06d4 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Fri, 23 Aug 2024 23:29:52 +0200
Subject: [PATCH 05/20] Fixed security key generation

---
 .../PageComponents/Config/Security.tsx        | 34 ++++++++++++++-----
 1 file changed, 25 insertions(+), 9 deletions(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 9c770f43..62c25e99 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -19,7 +19,7 @@ export const Security = (): JSX.Element => {
   );
   const [privateKeyVisible, setPrivateKeyVisible] = useState<boolean>(false);
   const [privateKeyBitCount, setPrivateKeyBitCount] = useState<number>(
-    config.security?.privateKey.length ?? 16,
+    config.security?.privateKey.length ?? 32,
   );
   const [privateKeyValidationText, setPrivateKeyValidationText] =
     useState<string>();
@@ -60,7 +60,11 @@ export const Security = (): JSX.Element => {
 
     setPrivateKey(fromByteArray(privateKey));
     setPublicKey(fromByteArray(publicKey));
-    setPrivateKeyValidationText(undefined);
+    validatePass(
+      fromByteArray(privateKey),
+      privateKeyBitCount,
+      setPrivateKeyValidationText,
+    );
   };
 
   const adminKeyClickEvent = () => {
@@ -82,19 +86,31 @@ export const Security = (): JSX.Element => {
       value: React.SetStateAction<string | undefined>,
     ) => void,
   ) => {
-    if (input.length % 4 !== 0 || toByteArray(input).length !== count) {
+    try {
+      if (input.length % 4 !== 0 || toByteArray(input).length !== count) {
+        setValidationText(`Please enter a valid ${count * 8} bit PSK.`);
+      } else {
+        setValidationText(undefined);
+      }
+    } catch (e) {
+      console.error(e);
       setValidationText(`Please enter a valid ${count * 8} bit PSK.`);
-    } else {
-      setValidationText(undefined);
     }
   };
 
   const privateKeyInputChangeEvent = (
     e: React.ChangeEvent<HTMLInputElement>,
   ) => {
-    const psk = e.currentTarget?.value;
-    setPrivateKey(psk);
-    validatePass(psk, privateKeyBitCount, setPrivateKeyValidationText);
+    const privateKeyB64String = e.currentTarget?.value;
+    setPrivateKey(privateKeyB64String);
+    validatePass(
+      privateKeyB64String,
+      privateKeyBitCount,
+      setPrivateKeyValidationText,
+    );
+
+    const publicKey = getX25519PublicKey(toByteArray(privateKeyB64String));
+    setPublicKey(fromByteArray(publicKey));
   };
 
   const adminKeyInputChangeEvent = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -136,7 +152,7 @@ export const Security = (): JSX.Element => {
               name: "privateKey",
               label: "Private Key",
               description: "Used to create a shared key with a remote device",
-              bits: [{ text: "128 bit", value: "16", key: "bit128" }],
+              bits: [{ text: "256 bit", value: "32", key: "bit256" }],
               validationText: privateKeyValidationText,
               devicePSKBitCount: privateKeyBitCount,
               inputChange: privateKeyInputChangeEvent,

From c4342f1a2b480365de416c08c0bb8f3cb84b9ef2 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Fri, 23 Aug 2024 23:39:48 +0200
Subject: [PATCH 06/20] Update passwordGenerator disabled

---
 src/components/UI/Generator.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/UI/Generator.tsx b/src/components/UI/Generator.tsx
index 07ea3ed2..ed228a5c 100644
--- a/src/components/UI/Generator.tsx
+++ b/src/components/UI/Generator.tsx
@@ -64,6 +64,7 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
         <Select
           value={devicePSKBitCount?.toString()}
           onValueChange={(e) => selectChange(e)}
+          disabled={disabled}
         >
           <SelectTrigger className="!max-w-max">
             <SelectValue />
@@ -80,6 +81,7 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
           type="button"
           variant="success"
           onClick={buttonClick}
+          disabled={disabled}
           {...props}
         >
           {buttonText}

From c711c39aa9ce330c581794f6e03875b562177a08 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Sat, 24 Aug 2024 12:21:15 +0200
Subject: [PATCH 07/20] Add inputChange to FormInpit

---
 src/components/Form/FormInput.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/components/Form/FormInput.tsx b/src/components/Form/FormInput.tsx
index 33ba8ccd..13f77260 100644
--- a/src/components/Form/FormInput.tsx
+++ b/src/components/Form/FormInput.tsx
@@ -4,10 +4,12 @@ import type {
 } from "@components/Form/DynamicForm.js";
 import { Input } from "@components/UI/Input.js";
 import type { LucideIcon } from "lucide-react";
+import type { ChangeEventHandler } from "react";
 import { Controller, type FieldValues } from "react-hook-form";
 
 export interface InputFieldProps<T> extends BaseFormBuilderProps<T> {
   type: "text" | "number" | "password";
+  inputChange?: ChangeEventHandler;
   properties?: {
     value?: string;
     prefix?: string;
@@ -34,13 +36,14 @@ export function GenericInput<T extends FieldValues>({
           type={field.type}
           step={field.properties?.step}
           value={field.type === "number" ? Number.parseFloat(value) : value}
-          onChange={(e) =>
+          onChange={(e) => {
+            if (field.inputChange) field.inputChange(e);
             onChange(
               field.type === "number"
                 ? Number.parseFloat(e.target.value)
                 : e.target.value,
-            )
-          }
+            );
+          }}
           {...field.properties}
           {...rest}
           disabled={disabled}

From 4cf91272de1aa99bd3c0c9db51507eb751c234ce Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Sat, 24 Aug 2024 12:21:41 +0200
Subject: [PATCH 08/20] Removed admin key generation from security

---
 .../PageComponents/Config/Security.tsx        | 66 +++++--------------
 1 file changed, 18 insertions(+), 48 deletions(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 62c25e99..c07099df 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -29,10 +29,6 @@ export const Security = (): JSX.Element => {
   const [adminKey, setAdminKey] = useState<string>(
     fromByteArray(config.security?.adminKey ?? new Uint8Array(0)),
   );
-  const [adminKeyVisible, setAdminKeyVisible] = useState<boolean>(false);
-  const [adminKeyBitCount, setAdminKeyBitCount] = useState<number>(
-    config.security?.adminKey.length ?? 16,
-  );
   const [adminKeyValidationText, setAdminKeyValidationText] =
     useState<string>();
 
@@ -54,32 +50,7 @@ export const Security = (): JSX.Element => {
     );
   };
 
-  const privateKeyClickEvent = () => {
-    const privateKey = getX25519PrivateKey();
-    const publicKey = getX25519PublicKey(privateKey);
-
-    setPrivateKey(fromByteArray(privateKey));
-    setPublicKey(fromByteArray(publicKey));
-    validatePass(
-      fromByteArray(privateKey),
-      privateKeyBitCount,
-      setPrivateKeyValidationText,
-    );
-  };
-
-  const adminKeyClickEvent = () => {
-    setAdminKey(
-      btoa(
-        cryptoRandomString({
-          length: adminKeyBitCount ?? 0,
-          type: "alphanumeric",
-        }),
-      ),
-    );
-    setAdminKeyValidationText(undefined);
-  };
-
-  const validatePass = (
+  const validateKey = (
     input: string,
     count: number,
     setValidationText: (
@@ -98,12 +69,25 @@ export const Security = (): JSX.Element => {
     }
   };
 
+  const privateKeyClickEvent = () => {
+    const privateKey = getX25519PrivateKey();
+    const publicKey = getX25519PublicKey(privateKey);
+
+    setPrivateKey(fromByteArray(privateKey));
+    setPublicKey(fromByteArray(publicKey));
+    validateKey(
+      fromByteArray(privateKey),
+      privateKeyBitCount,
+      setPrivateKeyValidationText,
+    );
+  };
+
   const privateKeyInputChangeEvent = (
     e: React.ChangeEvent<HTMLInputElement>,
   ) => {
     const privateKeyB64String = e.currentTarget?.value;
     setPrivateKey(privateKeyB64String);
-    validatePass(
+    validateKey(
       privateKeyB64String,
       privateKeyBitCount,
       setPrivateKeyValidationText,
@@ -116,19 +100,13 @@ export const Security = (): JSX.Element => {
   const adminKeyInputChangeEvent = (e: React.ChangeEvent<HTMLInputElement>) => {
     const psk = e.currentTarget?.value;
     setAdminKey(psk);
-    validatePass(psk, privateKeyBitCount, setAdminKeyValidationText);
+    validateKey(psk, privateKeyBitCount, setAdminKeyValidationText);
   };
 
   const privateKeySelectChangeEvent = (e: string) => {
     const count = Number.parseInt(e);
     setPrivateKeyBitCount(count);
-    validatePass(privateKey, count, setPrivateKeyValidationText);
-  };
-
-  const adminKeySelectChangeEvent = (e: string) => {
-    const count = Number.parseInt(e);
-    setAdminKeyBitCount(count);
-    validatePass(privateKey, count, setAdminKeyValidationText);
+    validateKey(privateKey, count, setPrivateKeyValidationText);
   };
 
   return (
@@ -205,24 +183,16 @@ export const Security = (): JSX.Element => {
                 'If true, device is considered to be "managed" by a mesh administrator via admin messages',
             },
             {
-              type: "passwordGenerator",
+              type: "text",
               name: "adminKey",
               label: "Admin Key",
               description:
                 "The public key authorized to send admin messages to this node",
               validationText: adminKeyValidationText,
-              devicePSKBitCount: adminKeyBitCount,
               inputChange: adminKeyInputChangeEvent,
-              selectChange: adminKeySelectChangeEvent,
-              hide: !adminKeyVisible,
-              buttonClick: adminKeyClickEvent,
               disabledBy: [{ fieldName: "adminChannelEnabled" }],
               properties: {
                 value: adminKey,
-                action: {
-                  icon: adminKeyVisible ? EyeOff : Eye,
-                  onClick: () => setAdminKeyVisible(!adminKeyVisible),
-                },
               },
             },
           ],

From 4bde402a53dc670f4f3e468114eb67b11b3be8cb Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Sun, 25 Aug 2024 23:49:48 +0200
Subject: [PATCH 09/20] Add key generation confirmation

---
 src/components/PageComponents/Config/Security.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index c07099df..cc67c007 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -7,7 +7,6 @@ import type { SecurityValidation } from "@app/validation/config/security.js";
 import { useDevice } from "@core/stores/deviceStore.js";
 import { Protobuf } from "@meshtastic/js";
 import { fromByteArray, toByteArray } from "base64-js";
-import cryptoRandomString from "crypto-random-string";
 import { Eye, EyeOff } from "lucide-react";
 import { useState } from "react";
 
@@ -70,6 +69,11 @@ export const Security = (): JSX.Element => {
   };
 
   const privateKeyClickEvent = () => {
+    const generate = confirm(
+      "Are you sure you want to generate a new key pair?",
+    );
+    if (!generate) return;
+
     const privateKey = getX25519PrivateKey();
     const publicKey = getX25519PublicKey(privateKey);
 

From f66332b3e33e824dff7f043058c4490829049dbf Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Sat, 31 Aug 2024 15:58:12 +0200
Subject: [PATCH 10/20] Handle undefined booleans

---
 src/components/PageComponents/Config/Security.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index cc67c007..0a1117fe 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -122,6 +122,11 @@ export const Security = (): JSX.Element => {
           adminKey: adminKey,
           privateKey: privateKey,
           publicKey: publicKey,
+          adminChannelEnabled: config.security?.adminChannelEnabled ?? false,
+          isManaged: config.security?.isManaged ?? false,
+          bluetoothLoggingEnabled: config.security?.bluetoothLoggingEnabled ?? false,
+          debugLogApiEnabled: config.security?.debugLogApiEnabled ?? false,
+          serialEnabled: config.security?.serialEnabled ?? false,
         },
       }}
       fieldGroups={[
@@ -170,7 +175,7 @@ export const Security = (): JSX.Element => {
         },
         {
           label: "Admin Settings",
-          description: "Settings for Admin ",
+          description: "Settings for Admin",
           fields: [
             {
               type: "toggle",

From d0bd02980de89146341133e34cc152eb0ca2b107 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Mon, 2 Sep 2024 13:10:59 +0200
Subject: [PATCH 11/20] Update private key generation

---
 src/core/utils/x25519.ts | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/core/utils/x25519.ts b/src/core/utils/x25519.ts
index d9ae20b5..8daa7a84 100644
--- a/src/core/utils/x25519.ts
+++ b/src/core/utils/x25519.ts
@@ -1,7 +1,13 @@
 import { x25519 } from "@noble/curves/ed25519";
 
 export function getX25519PrivateKey(): Uint8Array {
-  return x25519.utils.randomPrivateKey();
+  const key = x25519.utils.randomPrivateKey();
+
+  key[0] &= 248
+  key[31] &= 127
+  key[31] |= 64
+
+  return key;
 }
 
 export function getX25519PublicKey(privateKey: Uint8Array): Uint8Array {

From 9bea6870bbc18e4cf6424083b34d744bc980a041 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Mon, 2 Sep 2024 13:11:42 +0200
Subject: [PATCH 12/20] Add submit button to work

---
 src/components/PageComponents/Config/Security.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 0a1117fe..ec5e7752 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -89,7 +89,7 @@ export const Security = (): JSX.Element => {
   const privateKeyInputChangeEvent = (
     e: React.ChangeEvent<HTMLInputElement>,
   ) => {
-    const privateKeyB64String = e.currentTarget?.value;
+    const privateKeyB64String = e.target.value;
     setPrivateKey(privateKeyB64String);
     validateKey(
       privateKeyB64String,
@@ -116,6 +116,8 @@ export const Security = (): JSX.Element => {
   return (
     <DynamicForm<SecurityValidation>
       onSubmit={onSubmit}
+      submitType="onSubmit"
+      hasSubmitButton={true}
       defaultValues={{
         ...config.security,
         ...{

From 354d04592bfbe42d456afe35e11a840eb140681d Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Mon, 2 Sep 2024 15:05:04 +0200
Subject: [PATCH 13/20] Fix build

---
 src/components/PageComponents/Config/Security.tsx | 3 ++-
 src/core/utils/x25519.ts                          | 6 +++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index ec5e7752..1026a00d 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -126,7 +126,8 @@ export const Security = (): JSX.Element => {
           publicKey: publicKey,
           adminChannelEnabled: config.security?.adminChannelEnabled ?? false,
           isManaged: config.security?.isManaged ?? false,
-          bluetoothLoggingEnabled: config.security?.bluetoothLoggingEnabled ?? false,
+          bluetoothLoggingEnabled:
+            config.security?.bluetoothLoggingEnabled ?? false,
           debugLogApiEnabled: config.security?.debugLogApiEnabled ?? false,
           serialEnabled: config.security?.serialEnabled ?? false,
         },
diff --git a/src/core/utils/x25519.ts b/src/core/utils/x25519.ts
index 8daa7a84..2729d80a 100644
--- a/src/core/utils/x25519.ts
+++ b/src/core/utils/x25519.ts
@@ -3,9 +3,9 @@ import { x25519 } from "@noble/curves/ed25519";
 export function getX25519PrivateKey(): Uint8Array {
   const key = x25519.utils.randomPrivateKey();
 
-  key[0] &= 248
-  key[31] &= 127
-  key[31] |= 64
+  key[0] &= 248;
+  key[31] &= 127;
+  key[31] |= 64;
 
   return key;
 }

From 9d4aa05316232cafea9855fc3c257d8d82ed21bf Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Mon, 2 Sep 2024 15:45:58 +0200
Subject: [PATCH 14/20] Updated pki regenerate dialog

---
 src/components/Dialog/PkiRegenerateDialog.tsx |  39 +++
 .../PageComponents/Config/Security.tsx        | 251 +++++++++---------
 2 files changed, 170 insertions(+), 120 deletions(-)
 create mode 100644 src/components/Dialog/PkiRegenerateDialog.tsx

diff --git a/src/components/Dialog/PkiRegenerateDialog.tsx b/src/components/Dialog/PkiRegenerateDialog.tsx
new file mode 100644
index 00000000..3edc221a
--- /dev/null
+++ b/src/components/Dialog/PkiRegenerateDialog.tsx
@@ -0,0 +1,39 @@
+import { Button } from "@components/UI/Button.js";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@components/UI/Dialog.js";
+
+export interface PkiRegenerateDialogProps {
+  open: boolean;
+  onOpenChange: () => void;
+  onSubmit: () => void;
+}
+
+export const PkiRegenerateDialog = ({
+  open,
+  onOpenChange,
+  onSubmit,
+}: PkiRegenerateDialogProps): JSX.Element => {
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>Regenerate Key pair?</DialogTitle>
+          <DialogDescription>
+            Are you sure you want to regenerate key pair?
+          </DialogDescription>
+        </DialogHeader>
+        <DialogFooter>
+          <Button variant="destructive" onClick={() => onSubmit()}>
+            Regenerate
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 1026a00d..68a5ffe2 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -1,3 +1,4 @@
+import { PkiRegenerateDialog } from "@app/components/Dialog/PkiRegenerateDialog";
 import { DynamicForm } from "@app/components/Form/DynamicForm.js";
 import {
   getX25519PrivateKey,
@@ -30,6 +31,7 @@ export const Security = (): JSX.Element => {
   );
   const [adminKeyValidationText, setAdminKeyValidationText] =
     useState<string>();
+  const [dialogOpen, setDialogOpen] = useState<boolean>(false);
 
   const onSubmit = (data: SecurityValidation) => {
     if (privateKeyValidationText || adminKeyValidationText) return;
@@ -69,11 +71,10 @@ export const Security = (): JSX.Element => {
   };
 
   const privateKeyClickEvent = () => {
-    const generate = confirm(
-      "Are you sure you want to generate a new key pair?",
-    );
-    if (!generate) return;
+    setDialogOpen(true);
+  };
 
+  const pkiRegenerate = () => {
     const privateKey = getX25519PrivateKey();
     const publicKey = getX25519PublicKey(privateKey);
 
@@ -84,6 +85,8 @@ export const Security = (): JSX.Element => {
       privateKeyBitCount,
       setPrivateKeyValidationText,
     );
+
+    setDialogOpen(false);
   };
 
   const privateKeyInputChangeEvent = (
@@ -114,126 +117,134 @@ export const Security = (): JSX.Element => {
   };
 
   return (
-    <DynamicForm<SecurityValidation>
-      onSubmit={onSubmit}
-      submitType="onSubmit"
-      hasSubmitButton={true}
-      defaultValues={{
-        ...config.security,
-        ...{
-          adminKey: adminKey,
-          privateKey: privateKey,
-          publicKey: publicKey,
-          adminChannelEnabled: config.security?.adminChannelEnabled ?? false,
-          isManaged: config.security?.isManaged ?? false,
-          bluetoothLoggingEnabled:
-            config.security?.bluetoothLoggingEnabled ?? false,
-          debugLogApiEnabled: config.security?.debugLogApiEnabled ?? false,
-          serialEnabled: config.security?.serialEnabled ?? false,
-        },
-      }}
-      fieldGroups={[
-        {
-          label: "Security Settings",
-          description: "Settings for the Security configuration",
-          fields: [
-            {
-              type: "passwordGenerator",
-              name: "privateKey",
-              label: "Private Key",
-              description: "Used to create a shared key with a remote device",
-              bits: [{ text: "256 bit", value: "32", key: "bit256" }],
-              validationText: privateKeyValidationText,
-              devicePSKBitCount: privateKeyBitCount,
-              inputChange: privateKeyInputChangeEvent,
-              selectChange: privateKeySelectChangeEvent,
-              hide: !privateKeyVisible,
-              buttonClick: privateKeyClickEvent,
-              disabledBy: [
-                {
-                  fieldName: "adminChannelEnabled",
-                  invert: true,
+    <>
+      <DynamicForm<SecurityValidation>
+        onSubmit={onSubmit}
+        submitType="onSubmit"
+        hasSubmitButton={true}
+        defaultValues={{
+          ...config.security,
+          ...{
+            adminKey: adminKey,
+            privateKey: privateKey,
+            publicKey: publicKey,
+            adminChannelEnabled: config.security?.adminChannelEnabled ?? false,
+            isManaged: config.security?.isManaged ?? false,
+            bluetoothLoggingEnabled:
+              config.security?.bluetoothLoggingEnabled ?? false,
+            debugLogApiEnabled: config.security?.debugLogApiEnabled ?? false,
+            serialEnabled: config.security?.serialEnabled ?? false,
+          },
+        }}
+        fieldGroups={[
+          {
+            label: "Security Settings",
+            description: "Settings for the Security configuration",
+            fields: [
+              {
+                type: "passwordGenerator",
+                name: "privateKey",
+                label: "Private Key",
+                description: "Used to create a shared key with a remote device",
+                bits: [{ text: "256 bit", value: "32", key: "bit256" }],
+                validationText: privateKeyValidationText,
+                devicePSKBitCount: privateKeyBitCount,
+                inputChange: privateKeyInputChangeEvent,
+                selectChange: privateKeySelectChangeEvent,
+                hide: !privateKeyVisible,
+                buttonClick: privateKeyClickEvent,
+                disabledBy: [
+                  {
+                    fieldName: "adminChannelEnabled",
+                    invert: true,
+                  },
+                ],
+                properties: {
+                  value: privateKey,
+                  action: {
+                    icon: privateKeyVisible ? EyeOff : Eye,
+                    onClick: () => setPrivateKeyVisible(!privateKeyVisible),
+                  },
                 },
-              ],
-              properties: {
-                value: privateKey,
-                action: {
-                  icon: privateKeyVisible ? EyeOff : Eye,
-                  onClick: () => setPrivateKeyVisible(!privateKeyVisible),
+              },
+              {
+                type: "text",
+                name: "publicKey",
+                label: "Public Key",
+                description:
+                  "Sent out to other nodes on the mesh to allow them to compute a shared secret key",
+                disabledBy: [{ fieldName: "always" }],
+                properties: {
+                  value: publicKey,
                 },
               },
-            },
-            {
-              type: "text",
-              name: "publicKey",
-              label: "Public Key",
-              description:
-                "Sent out to other nodes on the mesh to allow them to compute a shared secret key",
-              disabledBy: [{ fieldName: "always" }],
-              properties: {
-                value: publicKey,
+            ],
+          },
+          {
+            label: "Admin Settings",
+            description: "Settings for Admin",
+            fields: [
+              {
+                type: "toggle",
+                name: "adminChannelEnabled",
+                label: "Allow Legacy Admin",
+                description:
+                  "Allow incoming device control over the insecure legacy admin channel",
               },
-            },
-          ],
-        },
-        {
-          label: "Admin Settings",
-          description: "Settings for Admin",
-          fields: [
-            {
-              type: "toggle",
-              name: "adminChannelEnabled",
-              label: "Allow Legacy Admin",
-              description:
-                "Allow incoming device control over the insecure legacy admin channel",
-            },
-            {
-              type: "toggle",
-              name: "isManaged",
-              label: "Managed",
-              description:
-                'If true, device is considered to be "managed" by a mesh administrator via admin messages',
-            },
-            {
-              type: "text",
-              name: "adminKey",
-              label: "Admin Key",
-              description:
-                "The public key authorized to send admin messages to this node",
-              validationText: adminKeyValidationText,
-              inputChange: adminKeyInputChangeEvent,
-              disabledBy: [{ fieldName: "adminChannelEnabled" }],
-              properties: {
-                value: adminKey,
+              {
+                type: "toggle",
+                name: "isManaged",
+                label: "Managed",
+                description:
+                  'If true, device is considered to be "managed" by a mesh administrator via admin messages',
               },
-            },
-          ],
-        },
-        {
-          label: "Logging Settings",
-          description: "Settings for Logging",
-          fields: [
-            {
-              type: "toggle",
-              name: "bluetoothLoggingEnabled",
-              label: "Allow Bluetooth Logging",
-              description: "Enables device (serial style logs) over Bluetooth",
-            },
-            {
-              type: "toggle",
-              name: "debugLogApiEnabled",
-              label: "Enable Debug Log API",
-              description: "Output live debug logging over serial",
-            },
-            {
-              type: "toggle",
-              name: "serialEnabled",
-              label: "Serial Output Enabled",
-              description: "Serial Console over the Stream API",
-            },
-          ],
-        },
-      ]}
-    />
+              {
+                type: "text",
+                name: "adminKey",
+                label: "Admin Key",
+                description:
+                  "The public key authorized to send admin messages to this node",
+                validationText: adminKeyValidationText,
+                inputChange: adminKeyInputChangeEvent,
+                disabledBy: [{ fieldName: "adminChannelEnabled" }],
+                properties: {
+                  value: adminKey,
+                },
+              },
+            ],
+          },
+          {
+            label: "Logging Settings",
+            description: "Settings for Logging",
+            fields: [
+              {
+                type: "toggle",
+                name: "bluetoothLoggingEnabled",
+                label: "Allow Bluetooth Logging",
+                description:
+                  "Enables device (serial style logs) over Bluetooth",
+              },
+              {
+                type: "toggle",
+                name: "debugLogApiEnabled",
+                label: "Enable Debug Log API",
+                description: "Output live debug logging over serial",
+              },
+              {
+                type: "toggle",
+                name: "serialEnabled",
+                label: "Serial Output Enabled",
+                description: "Serial Console over the Stream API",
+              },
+            ],
+          },
+        ]}
+      />
+      <PkiRegenerateDialog
+        open={dialogOpen}
+        onOpenChange={() => setDialogOpen(false)}
+        onSubmit={() => pkiRegenerate()}
+      />
+    </>
   );
 };

From d10c010b9a292078ef19ad6a54af4ee6292e5123 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Wed, 4 Sep 2024 18:50:49 +0200
Subject: [PATCH 15/20] Dont disable PKI on Allow Legacy Admin

---
 src/components/PageComponents/Config/Security.tsx | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 68a5ffe2..c0555015 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -153,12 +153,6 @@ export const Security = (): JSX.Element => {
                 selectChange: privateKeySelectChangeEvent,
                 hide: !privateKeyVisible,
                 buttonClick: privateKeyClickEvent,
-                disabledBy: [
-                  {
-                    fieldName: "adminChannelEnabled",
-                    invert: true,
-                  },
-                ],
                 properties: {
                   value: privateKey,
                   action: {

From 5e72510befeb40a4b5adb6e9cd1ce6aa2ae194e4 Mon Sep 17 00:00:00 2001
From: Tilen Komel <me@komelt.dev>
Date: Fri, 6 Sep 2024 09:33:13 +0200
Subject: [PATCH 16/20] Removed submit button

---
 .../PageComponents/Config/Security.tsx           |  3 +--
 src/components/UI/Generator.tsx                  | 16 ++++++++++++++++
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index c0555015..550b55e0 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -120,8 +120,7 @@ export const Security = (): JSX.Element => {
     <>
       <DynamicForm<SecurityValidation>
         onSubmit={onSubmit}
-        submitType="onSubmit"
-        hasSubmitButton={true}
+        submitType="onChange"
         defaultValues={{
           ...config.security,
           ...{
diff --git a/src/components/UI/Generator.tsx b/src/components/UI/Generator.tsx
index ed228a5c..7d589be4 100644
--- a/src/components/UI/Generator.tsx
+++ b/src/components/UI/Generator.tsx
@@ -50,6 +50,21 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
     },
     ref,
   ) => {
+    const inputRef = React.useRef<HTMLInputElement>(null);
+
+    // Invokes onChange event on the input element when the value changes from the parent component
+    React.useEffect(() => {
+      if (!inputRef.current) return;
+      const setValue = Object.getOwnPropertyDescriptor(
+        HTMLInputElement.prototype,
+        "value",
+      )?.set;
+
+      if (!setValue) return;
+      inputRef.current.value = "";
+      setValue.call(inputRef.current, value);
+      inputRef.current.dispatchEvent(new Event("input", { bubbles: true }));
+    }, [value]);
     return (
       <>
         <Input
@@ -60,6 +75,7 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
           onChange={inputChange}
           action={action}
           disabled={disabled}
+          ref={inputRef}
         />
         <Select
           value={devicePSKBitCount?.toString()}

From b522113cd7d999addb044d75dbf2bba874787521 Mon Sep 17 00:00:00 2001
From: Hunter Thornsberry <hunter@hunterthornsberry.com>
Date: Sat, 7 Sep 2024 20:16:29 -0400
Subject: [PATCH 17/20] bad merge on Security.tsx

---
 .../PageComponents/Config/Security.tsx        | 93 +++++++++----------
 1 file changed, 42 insertions(+), 51 deletions(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index be67e4b0..550b55e0 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -160,57 +160,48 @@ export const Security = (): JSX.Element => {
                   },
                 },
               },
-            {
-              type: "text",
-              name: "publicKey",
-              label: "Public Key",
-              disabled: true,
-              description:
-                "Sent out to other nodes on the mesh to allow them to compute a shared secret key",
-            },
-          ],
-        },
-        {
-          label: "Admin Settings",
-          description: "Settings for Admin ",
-          fields: [
-            {
-              type: "toggle",
-              name: "adminChannelEnabled",
-              label: "Allow Legacy Admin",
-              description:
-                "Allow incoming device control over the insecure legacy admin channel",
-            },
-            {
-              type: "toggle",
-              name: "isManaged",
-              label: "Managed",
-              description:
-                'If true, device is considered to be "managed" by a mesh administrator via admin messages',
-            },
-            {
-              type: "passwordGenerator",
-              name: "adminKey",
-              label: "Admin Key",
-              description:
-                "The public key authorized to send admin messages to this node",
-              validationText: adminKeyValidationText,
-              devicePSKBitCount: adminKeyBitCount,
-              inputChange: adminKeyInputChangeEvent,
-              selectChange: adminKeySelectChangeEvent,
-              hide: !adminKeyVisible,
-              buttonClick: () =>
-                clickEvent(
-                  setAdminKey,
-                  adminKeyBitCount,
-                  setAdminKeyValidationText,
-                ),
-              disabledBy: [{ fieldName: "adminChannelEnabled" }],
-              properties: {
-                value: adminKey,
-                action: {
-                  icon: adminKeyVisible ? EyeOff : Eye,
-                  onClick: () => setAdminKeyVisible(!adminKeyVisible),
+              {
+                type: "text",
+                name: "publicKey",
+                label: "Public Key",
+                description:
+                  "Sent out to other nodes on the mesh to allow them to compute a shared secret key",
+                disabledBy: [{ fieldName: "always" }],
+                properties: {
+                  value: publicKey,
+                },
+              },
+            ],
+          },
+          {
+            label: "Admin Settings",
+            description: "Settings for Admin",
+            fields: [
+              {
+                type: "toggle",
+                name: "adminChannelEnabled",
+                label: "Allow Legacy Admin",
+                description:
+                  "Allow incoming device control over the insecure legacy admin channel",
+              },
+              {
+                type: "toggle",
+                name: "isManaged",
+                label: "Managed",
+                description:
+                  'If true, device is considered to be "managed" by a mesh administrator via admin messages',
+              },
+              {
+                type: "text",
+                name: "adminKey",
+                label: "Admin Key",
+                description:
+                  "The public key authorized to send admin messages to this node",
+                validationText: adminKeyValidationText,
+                inputChange: adminKeyInputChangeEvent,
+                disabledBy: [{ fieldName: "adminChannelEnabled" }],
+                properties: {
+                  value: adminKey,
                 },
               },
             ],

From 2b81fc47e25001bc9e91d3ceeb1d69ddf57451db Mon Sep 17 00:00:00 2001
From: Hunter Thornsberry <hunter@hunterthornsberry.com>
Date: Sat, 7 Sep 2024 20:19:51 -0400
Subject: [PATCH 18/20] disable the public key input

---
 src/components/PageComponents/Config/Security.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 550b55e0..9ede77e2 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -164,9 +164,9 @@ export const Security = (): JSX.Element => {
                 type: "text",
                 name: "publicKey",
                 label: "Public Key",
+                disabled: true,
                 description:
                   "Sent out to other nodes on the mesh to allow them to compute a shared secret key",
-                disabledBy: [{ fieldName: "always" }],
                 properties: {
                   value: publicKey,
                 },

From f7a2e5f76ba7a9ae325efc41492720c73d146ba9 Mon Sep 17 00:00:00 2001
From: Hunter Thornsberry <hunter@hunterthornsberry.com>
Date: Sat, 7 Sep 2024 20:24:18 -0400
Subject: [PATCH 19/20] Invert adminKey disabledBy

---
 src/components/PageComponents/Config/Security.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 9ede77e2..86abf247 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -199,7 +199,7 @@ export const Security = (): JSX.Element => {
                   "The public key authorized to send admin messages to this node",
                 validationText: adminKeyValidationText,
                 inputChange: adminKeyInputChangeEvent,
-                disabledBy: [{ fieldName: "adminChannelEnabled" }],
+                disabledBy: [{ fieldName: "adminChannelEnabled", invert: true }],
                 properties: {
                   value: adminKey,
                 },

From 989fad7e174613d887a56f1ce35f194d98b94d16 Mon Sep 17 00:00:00 2001
From: Hunter Thornsberry <hunter@hunterthornsberry.com>
Date: Sat, 7 Sep 2024 20:24:45 -0400
Subject: [PATCH 20/20] biome

---
 src/components/PageComponents/Config/Security.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/PageComponents/Config/Security.tsx b/src/components/PageComponents/Config/Security.tsx
index 86abf247..bb0a24e0 100644
--- a/src/components/PageComponents/Config/Security.tsx
+++ b/src/components/PageComponents/Config/Security.tsx
@@ -199,7 +199,9 @@ export const Security = (): JSX.Element => {
                   "The public key authorized to send admin messages to this node",
                 validationText: adminKeyValidationText,
                 inputChange: adminKeyInputChangeEvent,
-                disabledBy: [{ fieldName: "adminChannelEnabled", invert: true }],
+                disabledBy: [
+                  { fieldName: "adminChannelEnabled", invert: true },
+                ],
                 properties: {
                   value: adminKey,
                 },