new ui 9

apps/ui/templates/device.html

@@ -824,9 +824,7 @@
 
         // Cleanup on page unload
         window.addEventListener('beforeunload', () => {
-            if (eventSource) {
-                eventSource.close();
-            }
+            window.apiClient.disconnectRealtime();
         });
 
         // Load device on page load

apps/ui/templates/room.html

@@ -240,12 +240,20 @@
                 const layoutData = await window.apiClient.getLayout();
                 const devicesData = await window.apiClient.getDevices();
 
+                console.log('Room name from URL:', roomName);
+                console.log('Available rooms:', layoutData.rooms.map(r => r.name));
+                console.log('Total devices:', devicesData.length);
+
                 // Find the room using API client helper
                 const room = window.apiClient.findRoom(layoutData, roomName);
                 if (!room) {
+                    console.error('Room not found:', roomName);
                     throw new Error(`Raum "${roomName}" nicht gefunden`);
                 }
 
+                console.log('Found room:', room);
+                console.log('Room devices:', room.devices);
+
                 // Update header
                 roomNameEl.textContent = room.name;
                 roomInfoEl.textContent = `${room.devices.length} Gerät${room.devices.length !== 1 ? 'e' : ''}`;
@@ -261,6 +269,8 @@
                     .map(deviceId => deviceMap[deviceId])
                     .filter(device => device != null);
 
+                console.log('Filtered room devices:', roomDevices);
+
                 loading.style.display = 'none';
 
                 if (roomDevices.length === 0) {
@@ -437,9 +447,7 @@
 
         // Cleanup on page unload
         window.addEventListener('beforeunload', () => {
-            if (eventSource) {
-                eventSource.close();
-            }
+            window.apiClient.disconnectRealtime();
         });
 
         // Load room on page load