Various fixes

netbox_device_view/templates/netbox_device_view/deviceview.html

@@ -60,11 +60,7 @@
 					{% endfor %}
 				{% endif %}
 				"
-				style="grid-area: {{ int.stylename }};
-				{% if cable_colors == "on" and int.cable.color != "" %}
-				background-color: #{{ int.cable.color }}
-				{% endif %}
-				"
+				style="grid-area: {{ int.stylename }}{% if cable_colors == 'on' and int.cable.color != '' %}; background-color: #{{ int.cable.color }}{% endif %}"
 				data-bs-toggle="tooltip"
 				data-bs-html="true"
 				data-bs-custom-class="device-view-tooltip"

netbox_device_view/utils.py

@@ -10,19 +10,27 @@ def process_interfaces(interfaces, ports_chassis, dev):
         for itf in interfaces:
             if itf.type == "virtual" or itf.type == "lag":
                 continue
-            regex = r"^(?P<type>([a-zA-Z\-_]*))(\/|(?P<dev>[0-9]+).|\s)?((?P<module>[0-9]+).|\s)?((?P<port>[0-9]+))$"
-            matches = re.search(regex, itf.name.lower())
-            if matches:
-                itf.stylename = (
-                    (matches["type"] or "")
-                    + (matches["module"] or "")
-                    + "-"
-                    + matches["port"]
-                )
-            else:
-                itf.stylename = re.sub(r"[^.a-zA-Z\d]", "-", itf.name.lower())
-            if itf.stylename.isdigit():
+            # Convert to lowercase and replace common separators with hyphens
+            # This replaces the original regex matching and if/else block
+            stylename = re.sub(r"[/\.\s]+", "-", itf.name.lower())
+
+            # Clean up multiple hyphens and leading/trailing hyphens
+            stylename = re.sub(r"-+", "-", stylename).strip("-")
+
+            # If the name becomes empty after cleaning, use a fallback
+            if not stylename:
+                stylename = f"iface-{itf.pk}"  # Use a unique fallback
+
+            # Assign the generated stylename back to the object property
+            itf.stylename = stylename
+
+            # Check if the stylename exists and starts with a digit or a hyphen
+            # This replaces the original 'if itf.stylename.isdigit():' line
+            if itf.stylename and (
+                itf.stylename[0].isdigit() or itf.stylename[0] == "-"
+            ):
                 itf.stylename = f"p{itf.stylename}"
+
             if dev not in ports_chassis:
                 ports_chassis[dev] = []
             ports_chassis[dev].append(itf)
@@ -55,7 +63,9 @@ def prepare(obj):
                 device_type=obj.device_type
             ).grid_template_area
             modules[1] = obj.modules.all()
-            ports_chassis = process_interfaces(obj.interfaces.all(), ports_chassis, 1)
+            ports_chassis = process_interfaces(
+                obj.interfaces.all(), ports_chassis, obj.name
+            )
             ports_chassis = process_ports(obj.frontports.all(), ports_chassis, "Front")
             ports_chassis = process_ports(obj.rearports.all(), ports_chassis, "Rear")
             ports_chassis = process_ports(

setup.py

@@ -5,7 +5,7 @@
 
 setup(
     name="netbox-device-view",
-    version="0.1.9",
+    version="0.1.10-alpha",
     description="NetBox Device View plugin",
     packages=find_packages(),
     author="Peter Baumert",