diff --git a/src/app/components/StatusPage.tsx b/src/app/components/StatusPage.tsx index 34b61ec..cb8bcd0 100644 --- a/src/app/components/StatusPage.tsx +++ b/src/app/components/StatusPage.tsx @@ -27,20 +27,32 @@ export default function StatusPage({ config, setConfig, onOpenFileManager }: Sta }; const [showDeviceOverlay, setShowDeviceOverlay] = useState(false); - // Find the first enabled device as the active device - const findActiveDevice = () => { + + // Build a sorted list of all IEC devices for the overlay. + const allIecDevices = Object.entries(config.devices?.iec ?? {}) + .sort(([a], [b]) => parseInt(a) - parseInt(b)) + .map(([num, d]: [string, any]) => ({ + id: `drive-${num}`, + number: num, + type: (d.type ?? 'drive') as any, + name: d.name, + enabled: d.enabled, + url: d.url, + mode: d.mode, + })); + + // Find the first enabled drive as the active device. + const activeDevice = (() => { if (config.devices?.iec) { for (const [num, device] of Object.entries(config.devices.iec)) { const d = device as any; - if (d.type === 'drive' && d.enabled) { - return { number: num, ...d }; - } + if (d.type === 'drive' && d.enabled) return { number: num, ...d }; } } return null; - }; + })(); - const activeDevice = findActiveDevice(); + const activeDeviceIndex = allIecDevices.findIndex(d => d.number === activeDevice?.number); const activeDir = activeDevice ? (activeDevice.base_url || activeDevice.url || null) : null; @@ -247,18 +259,10 @@ export default function StatusPage({ config, setConfig, onOpenFileManager }: Sta - {showDeviceOverlay && ( + {showDeviceOverlay && allIecDevices.length > 0 && ( setShowDeviceOverlay(false)}