Merge branch '71-6-users-can-add-conditions-to-automations' into 'dev'

Resolve "6. Users can add conditions to automations"

Closes #71

See merge request sa4-2020/the-sanmarinoes/frontend!152

smart-hut/src/components/dashboard/AutomationCreationModal.js

@@ -49,8 +49,21 @@ const deviceStateOptions = [
     { key: 'on', text: 'on', value: true },
 ];
 
+const thermostatOptions = [
+    { key: 'HEATING', text: 'HEATING', value: 'HEATING' },
+    { key: 'COOLING', text: 'COOLING', value: 'COOLING' },
+    { key: 'IDLE', text: 'IDLE', value: 'IDLE' },
+    { key: 'OFF', text: 'OFF', value: 'OFF' },
+];
+
+const thermostatOperands = [
+    { key: 'EQUAL', text: '=', value: 'EQUAL' },
+    { key: 'NOTEQUAL', text: '\u2260', value: 'NOTEQUAL' },
+];
+
 const CreateTrigger = (props) => {
     const [activeOperand, setActiveOperand] = useState(true);
+    const [activeThermostat, setActiveThermostat] = useState(false);
     const operandsRef = useRef(null);
     const valuesRef = useRef(null);
     const notAdmitedDevices = ['buttonDimmer'];
@@ -72,7 +85,7 @@ const CreateTrigger = (props) => {
     const onChange = (e, val) => {
         props.inputChange(val);
         setActiveOperand(hasOperand.has(props.devices[val.value].kind));
-
+        setActiveThermostat(props.devices[val.value].kind === 'thermostat');
         if (operandsRef.current) operandsRef.current.setValue('');
         if (valuesRef.current) valuesRef.current.inputRef.current.valueAsNumber = undefined;
     };
@@ -92,7 +105,32 @@ const CreateTrigger = (props) => {
                   placeholder="Device"
                 />
               </Form.Field>
-            {activeOperand ? (
+              {
+                  activeThermostat ? (
+                    <>
+                      <Form.Field inline width={2}>
+                        <Dropdown
+                          onChange={(e, val) => props.inputChange(val)}
+                          ref={operandsRef}
+                          name="operand"
+                          compact
+                          selection
+                          options={thermostatOperands}
+                        />
+                      </Form.Field>
+                      <Form.Field inline width={7}>
+                        <Dropdown
+                          onChange={(e, val) => props.inputChange(val)}
+                          placeholder="State"
+                          name="mode"
+                          compact
+                          selection
+                          options={thermostatOptions}
+                        />
+                      </Form.Field>
+                    </>
+)
+                : activeOperand ? (
                   <>
                     <Form.Field inline width={2}>
                       <Dropdown
@@ -127,7 +165,8 @@ const CreateTrigger = (props) => {
                               options={deviceStateOptions}
                             />
                           </Form.Field>
-            )}
+                        )
+}
             </Form.Group>
           </Form>
         </List.Content>
@@ -164,8 +203,10 @@ const SceneItem = (props) => {
 
 const Trigger = ({
                      deviceName, trigger, onRemove, index,
-}) => {
+                 }) => {
-  const { operand, value, on } = trigger;
+    const {
+ operand, value, on, mode,
+} = trigger;
     let symbol;
     if (operand) {
         symbol = operands.filter((opt) => opt.key === operand)[0].text;
@@ -175,7 +216,7 @@ const Trigger = ({
         <Menu compact>
           <Menu.Item as="span">{deviceName}</Menu.Item>
           {operand ? <Menu.Item as="span">{symbol}</Menu.Item> : ''}
-        <Menu.Item as="span">{operand ? value : on ? 'on' : 'off'}</Menu.Item>
+          <Menu.Item as="span">{mode || (operand ? value : on ? 'on' : 'off')}</Menu.Item>
         </Menu>
         <Icon
           as="i"
@@ -192,10 +233,12 @@ class AutomationSaveModal extends Component {
         super(props);
         this.state = {
             triggerList: [],
+            conditionsList: [],
             order: [],
             automationName: 'New Automation',
             editName: false,
             newTrigger: {},
+            newCondition: {},
             scenesFilter: null,
             openModal: false,
         };
@@ -226,13 +269,17 @@ class AutomationSaveModal extends Component {
         this.setautomationName = this._setter('automationName');
         this.setEditName = this._setter('editName');
         this.setNewTrigger = this._setter('newTrigger');
-
         this.addTrigger = this.addTrigger.bind(this);
         this.removeTrigger = this.removeTrigger.bind(this);
         this.onInputChange = this.onInputChange.bind(this);
         this.searchScenes = this.searchScenes.bind(this);
         this.orderScenes = this.orderScenes.bind(this);
         this.onChangeName = this.onChangeName.bind(this);
+
+        // Conditions
+        this.setNewCondition = this._setter('newCondition');
+        this.addCondition = this.addCondition.bind(this);
+        this.removeCondition = this.removeCondition.bind(this);
     }
 
     openModal = (e) => {
@@ -254,14 +301,29 @@ class AutomationSaveModal extends Component {
     triggerKind(trigger) {
         if ('operand' in trigger && 'value' in trigger) {
             return 'rangeTrigger';
-    } if ('on' in trigger) {
+        }
+        if ('on' in trigger) {
             return 'booleanTrigger';
         }
         return false;
         // throw new Error("Trigger kind not handled");
     }
 
-  _checkNewTrigger(trigger) {
+    conditionKind(condition) {
+        if ('operand' in condition && 'value' in condition) {
+            return 'rangeTrigger';
+        }
+        if ('on' in condition) {
+            return 'booleanTrigger';
+        }
+
+        if ('operand' in condition && 'mode' in condition) {
+            return 'thermostatCondition';
+        }
+        return false;
+    }
+
+    _checkNewTrigger(trigger, isCondition = false) {
         const error = {
             result: false,
             message: 'There are missing fields!',
@@ -271,19 +333,24 @@ class AutomationSaveModal extends Component {
         )[0];
 
         const triggerKind = this.triggerKind(trigger);
+        const conditionKind = this.conditionKind(trigger);
+        if (!isCondition && (!device || !triggerKind)) {
+            error.message = 'There are missing fields';
+            return error;
+        }
 
-    if (!device || !triggerKind) {
+        if (isCondition && !conditionKind) {
             error.message = 'There are missing fields';
             return error;
         }
         const deviceKind = device.kind;
         const devicesWithPercentage = ['dimmableLight', 'curtains', 'knobDimmer'];
 
-    switch (triggerKind) {
+        switch (isCondition ? conditionKind : triggerKind) {
-      case 'booleanTrigger':
+            case 'booleanTrigger' || 'booleanCondition':
                 if (!trigger.device || trigger.on === null || trigger.on === undefined) return error;
                 break;
-      case 'rangeTrigger':
+            case 'rangeTrigger' || 'rangeCondition':
                 if (!trigger.device || !trigger.operand || !trigger.value) {
                     return error;
                 }
@@ -298,7 +365,8 @@ class AutomationSaveModal extends Component {
                 ) {
                     error.message = "The value can't exceed 100, as it's a percentage";
                     return error;
-        } if (
+                }
+                if (
                     deviceKind === 'sensor'
                     && device.sensor === 'HUMIDITY'
                     && trigger.value > 100
@@ -307,25 +375,36 @@ class AutomationSaveModal extends Component {
                     return error;
                 }
                 break;
+            case 'thermostatCondition':
+                if (!trigger.device || trigger.mode === null || trigger.mode === undefined || !trigger.operand) return error;
+                break;
             default:
                 throw new Error('theoretically unreachable statement');
         }
 
-    const isNotDuplicate = !this.state.triggerList.some(
+        let isNotDuplicate = null;
+
+        if (isCondition === true) {
+            isNotDuplicate = !this.state.conditionsList.some(
                 (t) => t.device === trigger.device && t.operand === trigger.operand,
             );
-
+        } else {
+            isNotDuplicate = !this.state.triggerList.some(
+                (t) => t.device === trigger.device && t.operand === trigger.operand,
+            );
+        }
+        const type = isCondition ? 'condition' : 'trigger';
+        const duplicationMessage = `You have already created a ${type} for this device with the same conditions`;
         return {
             result: isNotDuplicate,
             message: isNotDuplicate
                 ? null
-        : 'You have already created a trigger for this device with the same conditions',
+                : duplicationMessage,
         };
     }
 
     addTrigger() {
         const { result, message } = this._checkNewTrigger(this.state.newTrigger);
-
         if (result) {
             this.setState(
                 update(this.state, {
@@ -383,12 +462,14 @@ class AutomationSaveModal extends Component {
         return this.props.scenes.filter((e) => e.name.includes(this.scenesFilter));
     }
 
-  _generateKey = (trigger) => {
+    _generateKey = (trigger, isCondition = false) => {
-    switch (this.triggerKind(trigger)) {
+        switch (isCondition ? this.conditionKind(trigger) : this.triggerKind(trigger)) {
-      case 'booleanTrigger':
+            case 'booleanTrigger' || 'booleanCondition':
                 return `${trigger.device}${trigger.on}`;
-      case 'rangeTrigger':
+            case 'rangeTrigger' || 'rangeCondition':
                 return `${trigger.device}${trigger.operand}${trigger.value}`;
+            case 'thermostatCondition':
+                return `${trigger.device}${trigger.operand}${trigger.mode}`;
             default:
                 throw new Error('theoretically unreachable statement');
         }
@@ -444,6 +525,25 @@ class AutomationSaveModal extends Component {
                     );
                 }
 
+                for (const condition of this.state.conditionsList) {
+                    const kind = condition.kind || this.conditionKind(condition);
+                    const loSpagnolo = (kind === 'thermostatCondition' ? { operator: condition.operand, mode: condition.mode }
+                        : {
+                            operator: condition.operand,
+                            range: parseInt(condition.value),
+                        });
+                    automation.conditions.push(
+                        {
+                            deviceId: condition.device,
+                            kind,
+                            ...(kind === 'booleanTrigger'
+                                ? { on: condition.on }
+                                : loSpagnolo
+                            ),
+                        },
+                    );
+                }
+
                 this.props
                     .fastUpdateAutomation(automation)
                     .then(this.closeModal)
@@ -454,6 +554,7 @@ class AutomationSaveModal extends Component {
                         automation,
                         triggerList: this.state.triggerList,
                         order: this.state.order,
+                        conditionList: this.state.conditionsList,
                     })
                     .then(this.closeModal)
                     .catch(console.error);
@@ -473,11 +574,44 @@ class AutomationSaveModal extends Component {
         ) : (
           <Button icon labelPosition="left" color="green" onClick={this.openModal}>
             <Icon name="add" />
-Create new automation
+                Create new automation
           </Button>
         );
     }
 
+    // CONDITIONS
+
+    addCondition() {
+        // Same method used to check triggers and conditions, not a mistake
+        const { result, message } = this._checkNewTrigger(this.state.newCondition, true);
+        if (result) {
+            this.setState(
+                update(this.state, {
+                    conditionsList: { $push: [this.state.newCondition] },
+                }),
+            );
+        } else {
+            alert(message);
+        }
+    }
+
+    removeCondition(index) {
+        this.setState(
+            update(this.state, { conditionsList: { $splice: [[index, 1]] } }),
+        );
+    }
+
+    onInputChangeCondition = (val) => {
+        if (val.name === 'device') {
+            this.setNewCondition({ [val.name]: val.value });
+        } else {
+            this.setNewCondition({
+                ...this.state.newCondition,
+                [val.name]: val.value,
+            });
+        }
+    }
+
     render() {
         return (
           <Modal
@@ -499,7 +633,6 @@ Create new automation
                             this.state.automationName
                         )}
               </Header>
-
               <Button
                 onClick={() => this.setEditName((prev) => !prev)}
                 style={{ display: 'inline' }}
@@ -578,6 +711,42 @@ Create new automation
                   </Grid.Row>
                 </Grid>
               </Segment>
+              <Grid columns={1} stackable textAlign="center">
+                <Grid.Row verticalAlign="middle">
+                  <Grid.Column>
+                    <Header>Add Conditions</Header>
+                    <List divided relaxed>
+                      {this.state.conditionsList.length > 0
+                                    && this.state.conditionsList.map((condition, i) => {
+                                        const deviceName = this.deviceList.filter(
+                                            (d) => d.id === condition.device,
+                                        )[0].name;
+                                        const key = this._generateKey(condition, true);
+                                        return (
+                                          <Trigger
+                                            key={key}
+                                            index={i}
+                                            deviceName={deviceName}
+                                            trigger={condition}
+                                            onRemove={this.removeCondition}
+                                          />
+                                        );
+                                    })}
+                      <CreateTrigger
+                        devices={this.props.devices}
+                        inputChange={this.onInputChangeCondition}
+                      />
+                    </List>
+                    <Button
+                      onClick={this.addCondition}
+                      circular
+                      icon="add"
+                      color="blue"
+                      size="huge"
+                    />
+                  </Grid.Column>
+                </Grid.Row>
+              </Grid>
               <Grid>
                 <Grid.Row>
                   <Grid.Column style={{ marginRight: '1rem' }}>

smart-hut/src/components/dashboard/AutomationsPanel.js

@@ -17,7 +17,7 @@ import CreateAutomation, { operands } from './AutomationCreationModal';
 const Automation = ({
  automation, devices, scenes, removeAutomation,
 }) => {
-  const { triggers } = automation;
+  const { triggers, conditions } = automation;
   const scenePriorities = automation.scenes;
   const getOperator = (operand) => operands.filter((o) => o.key === operand)[0].text;
 
@@ -85,6 +85,36 @@ const Automation = ({
           </Grid.Row>
         </Grid>
       </Segment>
+      <Grid columns={1} stackable textAlign="center">
+        <Grid.Row verticalAlign="middle">
+          <Grid.Column>
+            <Header>Conditions</Header>
+            <List divided relaxed>
+              {conditions !== undefined
+                  && conditions.map((condition) => {
+                    const device = devices.filter(
+                      (d) => d.id === condition.deviceId,
+                    )[0];
+                    return (
+                      <Menu key={condition.id} compact>
+                        <Menu.Item as="span">
+                          {device.name}
+                          {' '}
+                          {condition.operator
+                            ? `${getOperator(condition.operator)
+                              } ${
+                              condition.mode ? condition.mode : condition.range}`
+                            : condition.on
+                            ? ' - on'
+                            : ' - off'}
+                        </Menu.Item>
+                      </Menu>
+                    );
+                  })}
+            </List>
+          </Grid.Column>
+        </Grid.Row>
+      </Grid>
     </>
   );
 };

smart-hut/src/remote.js

@@ -556,19 +556,31 @@ export const RemoteService = {
    *  with user-fiendly errors as a RemoteError
    */
   saveAutomation: (data) => {
-    const { automation, triggerList, order } = data;
+    const {
+ automation, triggerList, order, conditionList,
+} = data;
     automation.triggers = [];
     automation.scenes = [];
+    automation.condition = [];
     return (dispatch) => {
       const urlAutomation = '/automation';
       const urlBooleanTrigger = '/booleanTrigger';
       const urlRangeTrigger = '/rangeTrigger';
       const urlScenePriority = '/scenePriority';
+      // conditions
+      const urlRangeCondition = '/rangeCondition';
+      const urlBooleanCondition = '/booleanCondition';
+      const urlThermostatCondition = '/thermostatCondition';
 
       const rangeTriggerList = triggerList.filter((trigger) => 'operand' in trigger);
       const booleanTriggerList = triggerList.filter(
         (trigger) => !('operand' in trigger),
       );
+      const rangeConditionList = conditionList.filter((condition) => 'operand' in condition && 'value' in condition);
+      const booleanConditionList = conditionList.filter((condition) => 'on' in condition);
+      debugger;
+      const thermostatConditionList = conditionList.filter((condition) => 'operand' in condition && 'mode' in condition);
+
 
       return Endpoint.post(urlAutomation, {}, automation).then(
         async (automationRes) => {
@@ -591,7 +603,7 @@ export const RemoteService = {
             const trigger = {
               automationId: id,
               deviceId: t.device,
-              on: t.value,
+              on: t.on,
             };
             resBoolTriggers.push(Endpoint.post(
               urlBooleanTrigger,
@@ -601,6 +613,50 @@ export const RemoteService = {
           }
           automation.triggers.push(...((await Promise.all(resBoolTriggers)).map((v) => v.data)));
 
+          // Conditions
+          const resRangeConditions = [];
+          for (const t of rangeConditionList) {
+            const condition = {
+              automationId: id,
+              deviceId: t.device,
+              operator: t.operand,
+              range: t.value,
+            };
+            resRangeConditions.push(Endpoint.post(urlRangeCondition, {}, condition));
+          }
+          automation.conditions = (await Promise.all(resRangeConditions)).map((v) => v.data);
+
+          const resBoolConditions = [];
+          for (const t of booleanConditionList) {
+            const condition = {
+              automationId: id,
+              deviceId: t.device,
+              on: t.on,
+            };
+            resBoolConditions.push(Endpoint.post(
+              urlBooleanCondition,
+              {},
+              condition,
+            ));
+          }
+          automation.conditions.push(...((await Promise.all(resBoolConditions)).map((v) => v.data)));
+
+          const resThermoConditions = [];
+          for (const t of thermostatConditionList) {
+            const condition = {
+              automationId: id,
+              deviceId: t.device,
+              mode: t.mode,
+              operator: t.operand,
+            };
+            resThermoConditions.push(Endpoint.post(
+              urlThermostatCondition,
+              {},
+              condition,
+            ));
+          }
+          automation.conditions.push(...((await Promise.all(resThermoConditions)).map((v) => v.data)));
+
           const resScenePriorities = [];
           for (const [priority, sceneId] of order.entries()) {
             const scenePriority = {