From 4e810c17a587491f5fbf6e73de1e1ea945622853 Mon Sep 17 00:00:00 2001
From: "Joseph.Rawlings" <root0091@gmail.com>
Date: Thu, 18 Dec 2025 08:22:00 -0500
Subject: [PATCH] fix: update help modal component to use slots for description
 and details in firewall management

---
 .../views/components/ui/help-modal.blade.php  |  4 ++--
 .../Servers/Proxmox/views/firewall.blade.php  | 22 +++++++++++--------
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/extensions/Servers/Proxmox/views/components/ui/help-modal.blade.php b/extensions/Servers/Proxmox/views/components/ui/help-modal.blade.php
index 84e8f7c2b..082dc33c1 100644
--- a/extensions/Servers/Proxmox/views/components/ui/help-modal.blade.php
+++ b/extensions/Servers/Proxmox/views/components/ui/help-modal.blade.php
@@ -35,7 +35,7 @@
         @click="open = false"
         @keydown.escape.window="open = false"
         class="fixed inset-0"
-        style="z-index: 1050; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(2px); display: none;"
+        style="z-index: 1050; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(2px);"
     ></div>
     
     <!-- Modal Content -->
@@ -49,7 +49,7 @@
         x-transition:leave-end="opacity-0 scale-95"
         @click.away="open = false"
         class="fixed inset-0 flex items-center justify-center p-4"
-        style="z-index: 1050; display: none;"
+        style="z-index: 1050;"
     >
         <div class="modal-lte" style="position: relative; width: 100%; max-width: 42rem; max-height: 90vh; overflow-y: auto; background: #fff; border-radius: .375rem; box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15); padding: 1.5rem;">
             <button @click="open = false" style="position: absolute; top: 1rem; right: 1rem; padding: .25rem; border-radius: .25rem; color: #6c757d; background: transparent; border: none; cursor: pointer; transition: background .2s ease, color .2s ease;" onmouseover="this.style.background='#f8f9fa'; this.style.color='#495057'" onmouseout="this.style.background='transparent'; this.style.color='#6c757d'">
diff --git a/extensions/Servers/Proxmox/views/firewall.blade.php b/extensions/Servers/Proxmox/views/firewall.blade.php
index 51da779f6..bae531630 100644
--- a/extensions/Servers/Proxmox/views/firewall.blade.php
+++ b/extensions/Servers/Proxmox/views/firewall.blade.php
@@ -194,15 +194,19 @@
                 class="mb-0">
                 <x-slot name="actions">
                     <x-proxmox::ui.help-modal title="Firewall Management" icon="ri-question-line">
-                        <p class="text-sm text-base/90 mb-4">
-                            The Firewall Management interface provides comprehensive control over your virtual machine's network security, including rule-based filtering, IP aliases, and security policies.
-                        </p>
-                        <div class="pt-4 border-t border-neutral/30 space-y-2">
-                            <p class="text-xs text-base/75"><span class="font-semibold text-base/90">Firewall Rules:</span> Create granular rules to allow or block specific traffic patterns.</p>
-                            <p class="text-xs text-base/75"><span class="font-semibold text-base/90">IP Aliases:</span> Define named groups of IP addresses for easier rule management.</p>
-                            <p class="text-xs text-base/75"><span class="font-semibold text-base/90">IP Sets:</span> Manage collections of IP addresses for advanced filtering.</p>
-                            <p class="text-xs text-base/75"><span class="font-semibold text-base/90">Security Logs:</span> Monitor firewall activity and blocked attempts.</p>
-                        </div>
+                        <x-slot name="description">
+                            <p class="text-sm text-base/90 mb-4">
+                                The Firewall Management interface provides comprehensive control over your virtual machine's network security, including rule-based filtering, IP aliases, and security policies.
+                            </p>
+                        </x-slot>
+                        <x-slot name="details">
+                            <div class="space-y-2">
+                                <p class="text-xs text-base/75"><span class="font-semibold text-base/90">Firewall Rules:</span> Create granular rules to allow or block specific traffic patterns.</p>
+                                <p class="text-xs text-base/75"><span class="font-semibold text-base/90">IP Aliases:</span> Define named groups of IP addresses for easier rule management.</p>
+                                <p class="text-xs text-base/75"><span class="font-semibold text-base/90">IP Sets:</span> Manage collections of IP addresses for advanced filtering.</p>
+                                <p class="text-xs text-base/75"><span class="font-semibold text-base/90">Security Logs:</span> Monitor firewall activity and blocked attempts.</p>
+                            </div>
+                        </x-slot>
                     </x-proxmox::ui.help-modal>
                 </x-slot>
             </x-proxmox::ui.section-header>