From e0faced051e5a7ef42608969aed61e0768c5b309 Mon Sep 17 00:00:00 2001
From: l0crian1 <ryan.claridge13@gmail.com>
Date: Thu, 17 Apr 2025 14:08:19 -0400
Subject: [PATCH 1/3] firewall: Bug #24: Fix state output for firewall rules

Firewall rules state output was not being displayed correctly
when there was more than one state object.
---
 frontend/app/firewall/page.tsx | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/frontend/app/firewall/page.tsx b/frontend/app/firewall/page.tsx
index edf3baf..da129bf 100644
--- a/frontend/app/firewall/page.tsx
+++ b/frontend/app/firewall/page.tsx
@@ -952,14 +952,22 @@ export default function FirewallPage() {
                                 {rule.state && (
                                   <div className="flex flex-col gap-1">
                                     <span className="text-slate-400 font-medium">State Tracking:</span>
-                                    {Object.entries(rule.state).map(([key, value]) => (
-                                      <div key={`state-${key}`} className="flex items-center gap-2 ml-2">
-                                        <span className="text-slate-400">{key}:</span>
+                                    {typeof rule.state === 'string' ? (
+                                      <div className="flex items-center gap-2 ml-2">
                                         <span className="text-white font-mono bg-slate-800 px-2 py-1 rounded text-xs">
-                                          {typeof value === 'object' ? JSON.stringify(value) : String(value)}
+                                          {rule.state}
                                         </span>
                                       </div>
-                                    ))}
+                                    ) : (
+                                      Object.entries(rule.state).map(([key, value]) => (
+                                        <div key={`state-${key}`} className="flex items-center gap-2 ml-2">
+                                          <span className="text-slate-400">{key}:</span>
+                                          <span className="text-white font-mono bg-slate-800 px-2 py-1 rounded text-xs">
+                                            {typeof value === 'object' ? JSON.stringify(value) : String(value)}
+                                          </span>
+                                        </div>
+                                      ))
+                                    )}
                                   </div>
                                 )}
                               </div>

From ce758f09587b45b777601fd575065fa3e43babb7 Mon Sep 17 00:00:00 2001
From: l0crian1 <ryan.claridge13@gmail.com>
Date: Thu, 17 Apr 2025 14:23:26 -0400
Subject: [PATCH 2/3] start.sh: set executable bit

This prevents the user from having to manually set
the executable bit on the start.sh script.
---
 start.sh | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 mode change 100644 => 100755 start.sh

diff --git a/start.sh b/start.sh
old mode 100644
new mode 100755

From c9f616eb087266ba96f2b55fa9febc2369024c37 Mon Sep 17 00:00:00 2001
From: l0crian1 <ryan.claridge13@gmail.com>
Date: Thu, 17 Apr 2025 15:31:32 -0400
Subject: [PATCH 3/3] routing: Bug#22: Fix route maps

- Fixed Objects are not valid as a react child error
- Fix formatting of match statements
---
 frontend/app/routing/page.tsx | 70 ++++++++++++++++++++++++++---------
 1 file changed, 53 insertions(+), 17 deletions(-)

diff --git a/frontend/app/routing/page.tsx b/frontend/app/routing/page.tsx
index 49ecef2..43ad463 100644
--- a/frontend/app/routing/page.tsx
+++ b/frontend/app/routing/page.tsx
@@ -1322,26 +1322,62 @@ export default function RoutingPage() {
                                 </TableCell>
                                 <TableCell>
                                   <div className="space-y-1">
-                                    {Object.entries(rule.match).map(([key, value], j) => (
-                                      <div key={j} className="flex items-center gap-1">
-                                        <span className="text-xs text-slate-400">{key}:</span>
-                                        <Badge variant="outline" className="border-purple-700 text-purple-400">
-                                          {value as string}
-                                        </Badge>
-                                      </div>
-                                    ))}
+                                    {Object.entries(rule.match || {}).map(([key, value], j) => {
+                                      // Format the value into a readable string
+                                      let displayValue = value;
+                                      if (typeof value === 'object' && value !== null) {
+                                        // Handle nested objects by getting all key-value pairs
+                                        const formatNestedObject = (obj: any, parentKey?: string): string => {
+                                          const entries = Object.entries(obj);
+                                          if (entries.length === 0) return '';
+                                          
+                                          const [k, v] = entries[0];
+                                          if (typeof v === 'object' && v !== null) {
+                                            return formatNestedObject(v, k);
+                                          }
+                                          return `${parentKey ? `${parentKey} ` : ''}${k} ${v}`;
+                                        };
+                                        displayValue = formatNestedObject(value);
+                                      }
+                                      return (
+                                        <div key={j} className="flex items-center gap-1">
+                                          <span className="text-xs text-muted-foreground">{key}:</span>
+                                          <Badge variant="secondary">
+                                            {String(displayValue)}
+                                          </Badge>
+                                        </div>
+                                      );
+                                    })}
                                   </div>
                                 </TableCell>
                                 <TableCell>
                                   <div className="space-y-1">
-                                    {Object.entries(rule.set).map(([key, value], j) => (
-                                      <div key={j} className="flex items-center gap-1">
-                                        <span className="text-xs text-slate-400">{key}:</span>
-                                        <Badge variant="outline" className="border-blue-700 text-blue-400">
-                                          {value as string}
-                                        </Badge>
-                                      </div>
-                                    ))}
+                                    {Object.entries(rule.set || {}).map(([key, value], j) => {
+                                      // Format the value into a readable string
+                                      let displayValue = value;
+                                      if (typeof value === 'object' && value !== null) {
+                                        // Handle nested objects by getting all key-value pairs
+                                        const formatNestedObject = (obj: any, parentKey?: string): string => {
+                                          const entries = Object.entries(obj);
+                                          if (entries.length === 0) return '';
+                                          
+                                          const [k, v] = entries[0];
+                                          if (typeof v === 'object' && v !== null) {
+                                            return formatNestedObject(v, k);
+                                          }
+                                          return `${parentKey ? `${parentKey} ` : ''}${k} ${v}`;
+                                        };
+                                        displayValue = formatNestedObject(value);
+                                      }
+                                      return (
+                                        <div key={j} className="flex items-center gap-1">
+                                          <span className="text-xs text-muted-foreground">{key}:</span>
+                                          <Badge variant="outline">
+                                            {String(displayValue)}
+                                          </Badge>
+                                        </div>
+                                      );
+                                    })}
                                   </div>
                                 </TableCell>
                               </TableRow>
@@ -1480,4 +1516,4 @@ export default function RoutingPage() {
       </Dialog>
     </div>
   )
-} 
\ No newline at end of file
+}