From d46ba5be12719c3f70fb6b007a07f7de911698e9 Mon Sep 17 00:00:00 2001
From: William Deren <William-De71@users.noreply.github.com>
Date: Thu, 31 Oct 2024 10:10:20 +0100
Subject: [PATCH] Scene: Add Pilot Wire Mode in trigger & device set value
 action (#2149)

---
 .../components/device/SelectPilotWireMode.jsx | 62 +++++++++++++++++++
 front/src/config/i18n/de.json                 | 10 +++
 front/src/config/i18n/en.json                 | 10 +++
 front/src/config/i18n/fr.json                 | 10 +++
 .../edit-scene/actions/DeviceSetValue.jsx     | 12 ++++
 .../triggers/DeviceFeatureState.jsx           |  9 ++-
 .../PilotWireModeDeviceState.jsx              | 53 ++++++++++++++++
 7 files changed, 164 insertions(+), 2 deletions(-)
 create mode 100644 front/src/components/device/SelectPilotWireMode.jsx
 create mode 100644 front/src/routes/scene/edit-scene/triggers/device-states/PilotWireModeDeviceState.jsx

diff --git a/front/src/components/device/SelectPilotWireMode.jsx b/front/src/components/device/SelectPilotWireMode.jsx
new file mode 100644
index 0000000000..3a3d8ecf3a
--- /dev/null
+++ b/front/src/components/device/SelectPilotWireMode.jsx
@@ -0,0 +1,62 @@
+import { Component } from 'preact';
+import { Text } from 'preact-i18n';
+import Select from 'react-select';
+import get from 'get-value';
+
+import { PILOT_WIRE_MODE } from '../../../../server/utils/constants';
+import withIntlAsProp from '../../utils/withIntlAsProp';
+
+class SelectPilotWireMode extends Component {
+  handleValueChange = ({ value }) => {
+    this.props.updateValue(value);
+  };
+
+  getOptions = () => {
+    const deviceFeatureOptions = Object.keys(PILOT_WIRE_MODE).map(key => {
+      const value = PILOT_WIRE_MODE[key];
+      return {
+        label: get(this.props.intl.dictionary, `deviceFeatureValue.category.heater.pilot-wire-mode.${value}`, {
+          default: value
+        }),
+        value
+      };
+    });
+
+    this.setState({ deviceFeatureOptions });
+  };
+
+  getSelectedOption = () => {
+    const value = this.props.value;
+
+    if (value !== undefined) {
+      return {
+        label: get(this.props.intl.dictionary, `deviceFeatureValue.category.heater.pilot-wire-mode.${value}`, {
+          default: value
+        }),
+        value
+      };
+    } else {
+      return;
+    }
+  };
+
+  componentDidMount() {
+    this.getOptions();
+  }
+
+  render(props, { deviceFeatureOptions }) {
+    const selectedOption = this.getSelectedOption();
+    return (
+      <Select
+        class="select-device-feature"
+        defaultValue={''}
+        value={selectedOption}
+        onChange={this.handleValueChange}
+        options={deviceFeatureOptions}
+        placeholder={<Text id="global.selectPlaceholder" />}
+      />
+    );
+  }
+}
+
+export default withIntlAsProp(SelectPilotWireMode);
diff --git a/front/src/config/i18n/de.json b/front/src/config/i18n/de.json
index 7aa907b04e..2ef3b832c0 100644
--- a/front/src/config/i18n/de.json
+++ b/front/src/config/i18n/de.json
@@ -2853,6 +2853,16 @@
           "51": "Doppeltes Drücken"
         }
       },
+      "heater": {
+        "pilot-wire-mode": {
+          "0": "Aus",
+          "1": "Frostschutz",
+          "2": "Öko",
+          "3": "Komfort -1°C",
+          "4": "Komfort -2°C",
+          "5": "Komfort"
+        }
+      },
       "opening-sensor": {
         "binary": {
           "other": "Kein Wert empfangen",
diff --git a/front/src/config/i18n/en.json b/front/src/config/i18n/en.json
index 10acaf6e99..05c245aa73 100644
--- a/front/src/config/i18n/en.json
+++ b/front/src/config/i18n/en.json
@@ -2853,6 +2853,16 @@
           "51": "Double press"
         }
       },
+      "heater": {
+        "pilot-wire-mode": {
+          "0": "Off",
+          "1": "Frost Protection",
+          "2": "Eco",
+          "3": "Comfort -1°C",
+          "4": "Comfort -2°C",
+          "5": "Comfort"
+        }
+      },
       "opening-sensor": {
         "binary": {
           "other": "No value received",
diff --git a/front/src/config/i18n/fr.json b/front/src/config/i18n/fr.json
index 47dea0ad50..a23d5b0bac 100644
--- a/front/src/config/i18n/fr.json
+++ b/front/src/config/i18n/fr.json
@@ -2853,6 +2853,16 @@
           "51": "Pression double"
         }
       },
+      "heater": {
+        "pilot-wire-mode": {
+          "0": "Off",
+          "1": "Hors Gel",
+          "2": "Eco",
+          "3": "Confort -1°C",
+          "4": "Confort -2°C",
+          "5": "Confort"
+        }
+      },
       "opening-sensor": {
         "binary": {
           "other": "Aucune valeur reçue",
diff --git a/front/src/routes/scene/edit-scene/actions/DeviceSetValue.jsx b/front/src/routes/scene/edit-scene/actions/DeviceSetValue.jsx
index 7b1cd3b295..3f81fb8e6f 100644
--- a/front/src/routes/scene/edit-scene/actions/DeviceSetValue.jsx
+++ b/front/src/routes/scene/edit-scene/actions/DeviceSetValue.jsx
@@ -13,6 +13,7 @@ import TextWithVariablesInjected from '../../../../components/scene/TextWithVari
 import '../../../../components/boxs/device-in-room/device-features/style.css';
 import style from './DeviceSetValue.css';
 import ShutterButtons from '../../../../components/device/ShutterButtons';
+import SelectPilotWireMode from '../../../../components/device/SelectPilotWireMode';
 
 class DeviceSetValue extends Component {
   constructor(props) {
@@ -144,6 +145,17 @@ class DeviceSetValue extends Component {
       );
     }
 
+    if (this.state.deviceFeature.type === DEVICE_FEATURE_TYPES.HEATER.PILOT_WIRE_MODE) {
+      return (
+        <SelectPilotWireMode
+          category={this.state.deviceFeature.category}
+          type={this.state.deviceFeature.type}
+          updateValue={this.handleNewPureValue}
+          value={this.props.action.value}
+        />
+      );
+    }
+
     return (
       <div>
         <div className={style.explanationText}>
diff --git a/front/src/routes/scene/edit-scene/triggers/DeviceFeatureState.jsx b/front/src/routes/scene/edit-scene/triggers/DeviceFeatureState.jsx
index 9e8764dc10..2cac11f1c8 100644
--- a/front/src/routes/scene/edit-scene/triggers/DeviceFeatureState.jsx
+++ b/front/src/routes/scene/edit-scene/triggers/DeviceFeatureState.jsx
@@ -9,6 +9,7 @@ import PresenceSensorDeviceState from './device-states/PresenceSensorDeviceState
 import ThresholdDeviceState from './device-states/ThresholdDeviceState';
 import DefaultDeviceState from './device-states/DefaultDeviceState';
 import ButtonClickDeviceState from './device-states/ButtonClickDeviceState';
+import PilotWireModeDeviceState from './device-states/PilotWireModeDeviceState';
 
 class TurnOnLight extends Component {
   onDeviceFeatureChange = deviceFeature => {
@@ -27,6 +28,7 @@ class TurnOnLight extends Component {
     let binaryDevice = false;
     let presenceDevice = false;
     let buttonClickDevice = false;
+    let pilotWireModeDevice = false;
 
     if (selectedDeviceFeature) {
       const { category, type } = selectedDeviceFeature;
@@ -34,10 +36,12 @@ class TurnOnLight extends Component {
       binaryDevice = type === DEVICE_FEATURE_TYPES.SWITCH.BINARY;
       presenceDevice = category === DEVICE_FEATURE_CATEGORIES.PRESENCE_SENSOR;
       buttonClickDevice = category === DEVICE_FEATURE_CATEGORIES.BUTTON;
+      pilotWireModeDevice = category === DEVICE_FEATURE_CATEGORIES.HEATER;
     }
 
-    const defaultDevice = selectedDeviceFeature && !binaryDevice && !presenceDevice && !buttonClickDevice;
-    const thresholdDevice = selectedDeviceFeature && !presenceDevice && !buttonClickDevice;
+    const defaultDevice =
+      selectedDeviceFeature && !binaryDevice && !presenceDevice && !buttonClickDevice && !pilotWireModeDevice;
+    const thresholdDevice = selectedDeviceFeature && !presenceDevice && !buttonClickDevice && !pilotWireModeDevice;
 
     return (
       <div>
@@ -53,6 +57,7 @@ class TurnOnLight extends Component {
           {binaryDevice && <BinaryDeviceState {...props} selectedDeviceFeature={selectedDeviceFeature} />}
           {presenceDevice && <PresenceSensorDeviceState {...props} />}
           {buttonClickDevice && <ButtonClickDeviceState {...props} />}
+          {pilotWireModeDevice && <PilotWireModeDeviceState {...props} />}
           {defaultDevice && <DefaultDeviceState {...props} selectedDeviceFeature={selectedDeviceFeature} />}
         </div>
         {thresholdDevice && <ThresholdDeviceState {...props} />}
diff --git a/front/src/routes/scene/edit-scene/triggers/device-states/PilotWireModeDeviceState.jsx b/front/src/routes/scene/edit-scene/triggers/device-states/PilotWireModeDeviceState.jsx
new file mode 100644
index 0000000000..a4bf6a75c8
--- /dev/null
+++ b/front/src/routes/scene/edit-scene/triggers/device-states/PilotWireModeDeviceState.jsx
@@ -0,0 +1,53 @@
+import { Component, Fragment } from 'preact';
+import Select from 'react-select';
+import get from 'get-value';
+
+import { PILOT_WIRE_MODE } from '../../../../../../../server/utils/constants';
+import withIntlAsProp from '../../../../../utils/withIntlAsProp';
+
+class PilotWireModeDeviceState extends Component {
+  handleValueChange = ({ value }) => {
+    this.props.updateTriggerProperty(this.props.index, 'value', value);
+  };
+
+  getOptions = () => {
+    const options = Object.keys(PILOT_WIRE_MODE).map(key => {
+      const value = PILOT_WIRE_MODE[key];
+      return {
+        label: get(this.props.intl.dictionary, `deviceFeatureValue.category.heater.pilot-wire-mode.${value}`, {
+          default: value
+        }),
+        value
+      };
+    });
+
+    this.setState({ options });
+  };
+
+  componentWillMount() {
+    this.props.updateTriggerProperty(this.props.index, 'operator', '=');
+
+    this.getOptions();
+  }
+
+  render({ trigger }, { options }) {
+    const defaultValue = options.find(option => trigger.value === option.value);
+
+    return (
+      <Fragment>
+        <div class="col-2 col-md-1">
+          <div class="text-center" style={{ marginTop: '10px' }}>
+            <i class="fe fe-arrow-right" style={{ fontSize: '20px' }} />
+          </div>
+        </div>
+        <div class="col-10 col-md-5">
+          <div class="form-group">
+            <Select defaultValue={defaultValue || ''} onChange={this.handleValueChange} options={options} />
+          </div>
+        </div>
+      </Fragment>
+    );
+  }
+}
+
+export default withIntlAsProp(PilotWireModeDeviceState);