From e140227f7ab9eff2d79957a8cdbcf9b631a30b29 Mon Sep 17 00:00:00 2001
From: Wolfgang Hottgenroth <wolfgang.hottgenroth@icloud.com>
Date: Mon, 17 Nov 2025 22:04:59 +0100
Subject: [PATCH] new ui 10

---
 apps/ui/static/api-client.js | 5 ++++-
 apps/ui/static/types.js      | 2 +-
 apps/ui/templates/room.html  | 6 +++++-
 apps/ui/templates/rooms.html | 5 ++++-
 4 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/apps/ui/static/api-client.js b/apps/ui/static/api-client.js
index f90e5d8..2efca82 100644
--- a/apps/ui/static/api-client.js
+++ b/apps/ui/static/api-client.js
@@ -246,7 +246,10 @@ class HomeAutomationClient {
         const deviceMap = {};
         devices.forEach(d => deviceMap[d.device_id] = d);
 
-        return room.devices
+        // Extract device IDs from room.devices (they are objects with device_id property)
+        const deviceIds = room.devices.map(d => d.device_id || d);
+        
+        return deviceIds
             .map(id => deviceMap[id])
             .filter(d => d != null);
     }
diff --git a/apps/ui/static/types.js b/apps/ui/static/types.js
index 017b0fe..c98c8a0 100644
--- a/apps/ui/static/types.js
+++ b/apps/ui/static/types.js
@@ -8,7 +8,7 @@
 /**
  * @typedef {Object} Room
  * @property {string} name - Room name (e.g., "Küche", "Wohnzimmer")
- * @property {string[]} devices - Array of device IDs in this room
+ * @property {Array<{device_id: string, title: string, icon: string, rank: number}>} devices - Array of device objects in this room
  */
 
 /**
diff --git a/apps/ui/templates/room.html b/apps/ui/templates/room.html
index 26193d1..133ab28 100644
--- a/apps/ui/templates/room.html
+++ b/apps/ui/templates/room.html
@@ -264,8 +264,12 @@
                     deviceMap[device.device_id] = device;
                 });
 
+                // Extract device IDs from room devices (they are objects now)
+                const deviceIds = room.devices.map(d => d.device_id);
+                console.log('Device IDs from room:', deviceIds);
+
                 // Filter devices for this room
-                const roomDevices = room.devices
+                const roomDevices = deviceIds
                     .map(deviceId => deviceMap[deviceId])
                     .filter(device => device != null);
 
diff --git a/apps/ui/templates/rooms.html b/apps/ui/templates/rooms.html
index fb0012c..f93099a 100644
--- a/apps/ui/templates/rooms.html
+++ b/apps/ui/templates/rooms.html
@@ -256,7 +256,10 @@
             return card;
         }
 
-        function calculateRoomStats(deviceIds, deviceMap) {
+        function calculateRoomStats(roomDevices, deviceMap) {
+            // Extract device IDs from room devices (they are objects now)
+            const deviceIds = roomDevices.map(d => d.device_id || d);
+            
             // Count device types
             let lights = 0;
             let thermostats = 0;