fix poe status display

Author: hall

CHANGELOG.md

@@ -7,8 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/).
 
 ## [Unreleased]
 
+### Fixed
+
+- PoE status display
+
 ## [0.5.1] - 2026-02-07
 
+An even further reduction in zip size to `11.9 KB`!
+
 ### Changed
 
 - Use toggle boxes instead of radio buttons

src/legend.jsx

@@ -6,7 +6,7 @@ const states = [
     { help: "link established at 100M", port: { link: { speed: 100 } } },
     { help: "link established at 1G", port: { link: { speed: 1000 } } },
     { help: "link established at 10G", port: { link: { speed: 10000 } } },
-    { help: "poe enabled (802.3at/af mode)", port: { poe: { enabled: true, mode: "802.3at" } } },
+    { help: "poe enabled (802.3at/af mode)", port: { poe: { enabled: true, mode: "at" } } },
     { help: "stp enabled", port: { stp: true } },
     { help: "lacp enabled", port: { lacp: true } },
     { help: "vlan id", port: { vlan: { pvid: 10 } } },
@@ -33,7 +33,7 @@ export default function Legend({ poe }) {
                         .filter(s => poe || !('poe' in s.port))
                         .map((s, i) => (
                             <span key={i} className="legend-item">
-                                <dt><Port number="X" port={s.port} /></dt>
+                                <dt><Port number="X" port={s.port} poe={poe} /></dt>
                                 <dd>{s.help}</dd>
                             </span>
                         ))}

src/port.jsx

@@ -5,10 +5,10 @@ export default function Port({ number, port, poe }) {
 	if (!(port?.enabled ?? true)) className += ' disabled';
 
 	return (
-		<div className={className}>
+		<div className={className} title={port?.name}>
 			{port?.lacp && <span className="port-badge port-badge-lacp">&bull;</span>}
 			{port?.stp && <span className="port-badge port-badge-stp">&bull;</span>}
-			{poe && port?.poe?.enabled && <span className="port-poe">{port?.poe?.mode?.substring(5)}</span>}
+			{poe && port?.poe?.enabled && port?.poe?.mode !== 'disable' && <span className="port-poe">{port?.poe?.mode}</span>}
 			{number}
 			<span className="port-vlan">{port?.vlan?.pvid}</span>
 		</div>