Update temp/humidity in room GladysAssistant#1316

atrovato · Apr 11, 2022 · 77e2bb6 · 77e2bb6
1 parent 9f64e60
commit 77e2bb6
Show file tree

Hide file tree

Showing 4 changed files with 73 additions and 8 deletions.
diff --git a/front/src/actions/dashboard/boxes/humidityInRoom.js b/front/src/actions/dashboard/boxes/humidityInRoom.js
@@ -1,3 +1,5 @@
+import get from 'get-value';
+
 import { RequestStatus } from '../../../utils/consts';
 import createBoxActions from '../boxActions';
 
@@ -10,14 +12,29 @@ function createActions(store) {
     async getHumidityInRoom(state, box, x, y) {
       boxActions.updateBoxStatus(state, BOX_KEY, x, y, RequestStatus.Getting);
       try {
-        const room = await state.httpClient.get(`/api/v1/room/${box.room}?expand=humidity`);
+        const room = await state.httpClient.get(`/api/v1/room/${box.room}?expand=humidity,devices`);
         boxActions.mergeBoxData(state, BOX_KEY, x, y, {
           room
         });
         boxActions.updateBoxStatus(state, BOX_KEY, x, y, RequestStatus.Success);
       } catch (e) {
         boxActions.updateBoxStatus(state, BOX_KEY, x, y, RequestStatus.Error);
       }
+    },
+    async deviceFeatureWebsocketEvent(state, box, x, y, payload) {
+      const data = boxActions.getBoxData(box, x, y);
+      const devices = get(data, 'room.devices', { default: [] });
+
+      // Search if feature is in room
+      const featureIndex = devices
+        .flatMap(device => device.features)
+        .findIndex(feature => feature.selector === payload.device_feature_selector);
+
+      // If feature is in room
+      if (featureIndex !== -1) {
+        // Refresh box value
+        this.getHumidityInRoom(state, box, x, y);
+      }
     }
   };
   return Object.assign({}, actions);

diff --git a/front/src/actions/dashboard/boxes/temperatureInRoom.js b/front/src/actions/dashboard/boxes/temperatureInRoom.js
@@ -1,3 +1,5 @@
+import get from 'get-value';
+
 import { RequestStatus } from '../../../utils/consts';
 import createBoxActions from '../boxActions';
 
@@ -10,14 +12,29 @@ function createActions(store) {
     async getTemperatureInRoom(state, box, x, y) {
       boxActions.updateBoxStatus(state, BOX_KEY, x, y, RequestStatus.Getting);
       try {
-        const room = await state.httpClient.get(`/api/v1/room/${box.room}?expand=temperature`);
+        const room = await state.httpClient.get(`/api/v1/room/${box.room}?expand=temperature,devices`);
         boxActions.mergeBoxData(state, BOX_KEY, x, y, {
           room
         });
         boxActions.updateBoxStatus(state, BOX_KEY, x, y, RequestStatus.Success);
       } catch (e) {
         boxActions.updateBoxStatus(state, BOX_KEY, x, y, RequestStatus.Error);
       }
+    },
+    async deviceFeatureWebsocketEvent(state, box, x, y, payload) {
+      const data = boxActions.getBoxData(box, x, y);
+      const devices = get(data, 'room.devices', { default: [] });
+
+      // Search if feature is in room
+      const featureIndex = devices
+        .flatMap(device => device.features)
+        .findIndex(feature => feature.selector === payload.device_feature_selector);
+
+      // If feature is in room
+      if (featureIndex !== -1) {
+        // Refresh box value
+        this.getTemperatureInRoom(state, box, x, y);
+      }
     }
   };
   return Object.assign({}, actions);

diff --git a/front/src/components/boxs/room-humidity/RoomHumidity.jsx b/front/src/components/boxs/room-humidity/RoomHumidity.jsx
@@ -1,9 +1,11 @@
 import { Component } from 'preact';
 import { connect } from 'unistore/preact';
 import { Text } from 'preact-i18n';
+import get from 'get-value';
+
 import actions from '../../../actions/dashboard/boxes/humidityInRoom';
 import { DASHBOARD_BOX_STATUS_KEY, DASHBOARD_BOX_DATA_KEY } from '../../../utils/consts';
-import get from 'get-value';
+import { WEBSOCKET_MESSAGE_TYPES } from '../../../../../server/utils/constants';
 
 const isNotNullOrUndefined = value => value !== undefined && value !== null;
 
@@ -47,8 +49,13 @@ class RoomHumidityBoxComponent extends Component {
     this.props.getHumidityInRoom(this.props.box, this.props.x, this.props.y);
   };
 
+  updateRoomHumidity = payload => {
+    this.props.deviceFeatureWebsocketEvent(this.props.x, this.props.y, payload);
+  };
+
   componentDidMount() {
     this.refreshData();
+    this.props.session.dispatcher.addListener(WEBSOCKET_MESSAGE_TYPES.DEVICE.NEW_STATE, this.updateRoomHumidity);
   }
 
   componentDidUpdate(previousProps) {
@@ -58,6 +65,10 @@ class RoomHumidityBoxComponent extends Component {
     }
   }
 
+  componentWillUnmount() {
+    this.props.session.dispatcher.removeListener(WEBSOCKET_MESSAGE_TYPES.DEVICE.NEW_STATE, this.updateRoomHumidity);
+  }
+
   render(props, {}) {
     const boxData = get(props, `${DASHBOARD_BOX_DATA_KEY}HumidityInRoom.${props.x}_${props.y}`);
     const boxStatus = get(props, `${DASHBOARD_BOX_STATUS_KEY}HumidityInRoom.${props.x}_${props.y}`);

diff --git a/front/src/components/boxs/room-temperature/RoomTemperature.jsx b/front/src/components/boxs/room-temperature/RoomTemperature.jsx
@@ -1,9 +1,11 @@
 import { Component } from 'preact';
 import { connect } from 'unistore/preact';
 import { Text } from 'preact-i18n';
+import get from 'get-value';
+
 import actions from '../../../actions/dashboard/boxes/temperatureInRoom';
 import { DASHBOARD_BOX_STATUS_KEY, DASHBOARD_BOX_DATA_KEY } from '../../../utils/consts';
-import get from 'get-value';
+import { WEBSOCKET_MESSAGE_TYPES } from '../../../../../server/utils/constants';
 
 const isNotNullOrUndefined = value => value !== undefined && value !== null;
 
@@ -14,13 +16,13 @@ const RoomTemperatureBox = ({ children, ...props }) => (
         <i class="fe fe-thermometer" />
       </span>
       <div>
-        {isNotNullOrUndefined(props.temperature) && (
+        {props.valued && (
           <h4 class="m-0">
             <Text id="global.degreeValue" fields={{ value: Math.round(props.temperature) }} />
-            {props.unit === 'celsius' ? 'C' : 'F'}
+            <Text id={`global.${props.unit}`} />
           </h4>
         )}
-        {!isNotNullOrUndefined(props.temperature) && (
+        {!props.valued && (
           <p class="m-0">
             <Text id="dashboard.boxes.temperatureInRoom.noTemperatureRecorded" />
           </p>
@@ -36,8 +38,13 @@ class RoomTemperatureBoxComponent extends Component {
     this.props.getTemperatureInRoom(this.props.box, this.props.x, this.props.y);
   };
 
+  updateRoomTemperature = payload => {
+    this.props.deviceFeatureWebsocketEvent(this.props.x, this.props.y, payload);
+  };
+
   componentDidMount() {
     this.refreshData();
+    this.props.session.dispatcher.addListener(WEBSOCKET_MESSAGE_TYPES.DEVICE.NEW_STATE, this.updateRoomTemperature);
   }
 
   componentDidUpdate(previousProps) {
@@ -47,14 +54,27 @@ class RoomTemperatureBoxComponent extends Component {
     }
   }
 
+  componentWillUnmount() {
+    this.props.session.dispatcher.removeListener(WEBSOCKET_MESSAGE_TYPES.DEVICE.NEW_STATE, this.updateRoomTemperature);
+  }
+
   render(props, {}) {
     const boxData = get(props, `${DASHBOARD_BOX_DATA_KEY}TemperatureInRoom.${props.x}_${props.y}`);
     const boxStatus = get(props, `${DASHBOARD_BOX_STATUS_KEY}TemperatureInRoom.${props.x}_${props.y}`);
     const temperature = get(boxData, 'room.temperature.temperature');
     const unit = get(boxData, 'room.temperature.unit');
     const roomName = get(boxData, 'room.name');
+    const valued = isNotNullOrUndefined(temperature);
+
     return (
-      <RoomTemperatureBox {...props} temperature={temperature} unit={unit} boxStatus={boxStatus} roomName={roomName} />
+      <RoomTemperatureBox
+        {...props}
+        temperature={temperature}
+        unit={unit}
+        boxStatus={boxStatus}
+        roomName={roomName}
+        valued={valued}
+      />
     );
   }
 }