From ffacced2b18d30509b60ddaa1423d689c5cde1e0 Mon Sep 17 00:00:00 2001
From: "tony.nealon@wholesailnetworks.com" <tony.nealon@wholesailnetworks.com>
Date: Tue, 20 May 2025 23:41:31 +0000
Subject: [PATCH] Refactor rack elevation template to use htmx for dynamic
 loading and improved user experience

---
 netbox/templates/dcim/inc/rack_elevation.html | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/netbox/templates/dcim/inc/rack_elevation.html b/netbox/templates/dcim/inc/rack_elevation.html
index 33037c1ff..7fc8eeb3e 100644
--- a/netbox/templates/dcim/inc/rack_elevation.html
+++ b/netbox/templates/dcim/inc/rack_elevation.html
@@ -1,9 +1,19 @@
 {% load i18n %}
-<div style="margin-left: -30px">
-    <object data="{% url 'dcim-api:rack-elevation' pk=object.pk %}?face={{face}}&render=svg{% if extra_params %}&{{ extra_params }}{% endif %}" class="rack_elevation" aria-label="{% trans "Rack elevation" %}"></object>
+<div
+  hx-get="{% url 'dcim-api:rack-elevation' pk=object.pk %}?face={{ face }}&render=svg{% if extra_params %}&{{ extra_params }}{% endif %}"
+  hx-trigger="intersect"
+  hx-swap="innerHTML"
+  aria-label="{% trans 'Rack elevation' %}"
+  style="margin-left: -30px"
+>
+  <div class="d-flex justify-content-center align-items-center" style="min-height: 200px; margin-left: 30px;">
+    <div class="spinner-border" role="status">
+      <span class="visually-hidden">Rack Loading...</span>
+    </div>
+  </div>
 </div>
 <div class="text-center mt-3">
     <a class="btn btn-outline-primary" href="{% url 'dcim-api:rack-elevation' pk=object.pk %}?face={{face}}&render=svg{% if extra_params %}&{{ extra_params }}{% endif %}" hx-boost="false">
         <i class="mdi mdi-file-download"></i> {% trans "Download SVG" %}
     </a>
-</div>
+</div>
\ No newline at end of file