From 237aee9c46557e9b19527ea8364b00c13781bcee Mon Sep 17 00:00:00 2001
From: Michel Roegl-Brunner <michel.roegl-brunner@htl-braunau.at>
Date: Fri, 7 Nov 2025 12:53:54 +0100
Subject: [PATCH] Add Interface Port display to script detail modal header

- Display port in header next to script name for better visibility
- Position port close to name/logo section
- Keep port display in Basic Information section as well
- Style port with badge-like appearance for prominence
---
 src/app/_components/ScriptDetailModal.tsx | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/app/_components/ScriptDetailModal.tsx b/src/app/_components/ScriptDetailModal.tsx
index 3801a7c..5f3f840 100644
--- a/src/app/_components/ScriptDetailModal.tsx
+++ b/src/app/_components/ScriptDetailModal.tsx
@@ -165,6 +165,20 @@ export function ScriptDetailModal({
                 {script.privileged && <PrivilegedBadge />}
               </div>
             </div>
+            
+            {/* Interface Port*/}
+            {script.interface_port && (
+              <div className="ml-3 sm:ml-4 flex-shrink-0">
+                <div className="bg-primary/10 border border-primary/30 rounded-lg px-3 py-1.5 sm:px-4 sm:py-2">
+                  <span className="text-xs sm:text-sm font-medium text-muted-foreground mr-2">
+                    Port:
+                  </span>
+                  <span className="text-sm sm:text-base font-semibold text-foreground font-mono">
+                    {script.interface_port}
+                  </span>
+                </div>
+              </div>
+            )}
           </div>
           
           {/* Close Button */}