From c4c3880718803b7527c0409afd02860fd45cffec Mon Sep 17 00:00:00 2001
From: Adam Shiervani <adam.shiervani@gmail.com>
Date: Tue, 14 Oct 2025 22:48:53 +0200
Subject: [PATCH] fix: handle optional chaining for address and validation in
 StaticIpv4Card and StaticIpv6Card components

---
 ui/src/components/StaticIpv4Card.tsx | 19 ++++++++++++-------
 ui/src/components/StaticIpv6Card.tsx | 10 ++++------
 2 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/ui/src/components/StaticIpv4Card.tsx b/ui/src/components/StaticIpv4Card.tsx
index c0c5d19c..c8863ace 100644
--- a/ui/src/components/StaticIpv4Card.tsx
+++ b/ui/src/components/StaticIpv4Card.tsx
@@ -26,9 +26,9 @@ export default function StaticIpv4Card() {
   const hideSubnetMask = ipv4StaticAddress?.includes("/");
   useEffect(() => {
     const parts = ipv4StaticAddress?.split("/", 2);
-    if (parts.length !== 2) return;
+    if (parts?.length !== 2) return;
 
-    const cidrNotation = parseInt(parts[1]);
+    const cidrNotation = parseInt(parts?.[1] ?? "");
     if (isNaN(cidrNotation) || cidrNotation < 0 || cidrNotation > 32) return;
 
     const mask = netMaskFromCidr4(cidrNotation);
@@ -60,7 +60,9 @@ export default function StaticIpv4Card() {
               size="SM"
               placeholder="192.168.1.100"
               {
-              ...register("ipv4_static.address", { validate: validateIsIPOrCIDR4 })}
+              ...register("ipv4_static.address", {
+                validate: (value: string | undefined) => validateIsIPOrCIDR4(value ?? "")
+              })}
               error={formState.errors.ipv4_static?.address?.message}
             />
 
@@ -69,7 +71,7 @@ export default function StaticIpv4Card() {
               type="text"
               size="SM"
               placeholder="255.255.255.0"
-              {...register("ipv4_static.netmask", { validate })}
+              {...register("ipv4_static.netmask", { validate: (value: string | undefined) => validate(value ?? "") })}
               error={formState.errors.ipv4_static?.netmask?.message}
             />}
           </div>
@@ -79,7 +81,7 @@ export default function StaticIpv4Card() {
             type="text"
             size="SM"
             placeholder="192.168.1.1"
-            {...register("ipv4_static.gateway", { validate })}
+            {...register("ipv4_static.gateway", { validate: (value: string | undefined) => validate(value ?? "") })}
             error={formState.errors.ipv4_static?.gateway?.message}
           />
 
@@ -95,7 +97,10 @@ export default function StaticIpv4Card() {
                         type="text"
                         size="SM"
                         placeholder="1.1.1.1"
-                        {...register(`ipv4_static.dns.${index}`, { validate })}
+                        {...register(
+                          `ipv4_static.dns.${index}`,
+                          { validate: (value: string | undefined) => validate(value ?? "") }
+                        )}
                         error={formState.errors.ipv4_static?.dns?.[index]?.message}
                       />
                     </div>
@@ -123,7 +128,7 @@ export default function StaticIpv4Card() {
             LeadingIcon={LuPlus}
             type="button"
             text="Add DNS Server"
-            disabled={dns[0] === ""}
+            disabled={dns?.[0] === ""}
           />
         </div>
       </div>
diff --git a/ui/src/components/StaticIpv6Card.tsx b/ui/src/components/StaticIpv6Card.tsx
index 44996182..b9194e8c 100644
--- a/ui/src/components/StaticIpv6Card.tsx
+++ b/ui/src/components/StaticIpv6Card.tsx
@@ -55,7 +55,7 @@ export default function StaticIpv6Card() {
             type="text"
             size="SM"
             placeholder="2001:db8::1/64"
-            {...register("ipv6_static.prefix", { validate: cidrValidation })}
+            {...register("ipv6_static.prefix", { validate: (value: string | undefined) => cidrValidation(value ?? "") })}
             error={formState.errors.ipv6_static?.prefix?.message}
           />
 
@@ -64,7 +64,7 @@ export default function StaticIpv6Card() {
             type="text"
             size="SM"
             placeholder="2001:db8::1"
-            {...register("ipv6_static.gateway", { validate: ipv6Validation })}
+            {...register("ipv6_static.gateway", { validate: (value: string | undefined) => ipv6Validation(value ?? "") })}
             error={formState.errors.ipv6_static?.gateway?.message}
           />
 
@@ -80,9 +80,7 @@ export default function StaticIpv6Card() {
                         type="text"
                         size="SM"
                         placeholder="2001:4860:4860::8888"
-                        {...register(`ipv6_static.dns.${index}`, {
-                          validate: ipv6Validation,
-                        })}
+                        {...register(`ipv6_static.dns.${index}`, { validate: (value: string | undefined) => ipv6Validation(value ?? "") })}
                         error={formState.errors.ipv6_static?.dns?.[index]?.message}
                       />
                     </div>
@@ -110,7 +108,7 @@ export default function StaticIpv6Card() {
             LeadingIcon={LuPlus}
             type="button"
             text="Add DNS Server"
-            disabled={dns[0] === ""}
+            disabled={dns?.[0] === ""}
           />
         </div>
       </div>