Lights can be modified by a guest

smart-hut/src/components/dashboard/devices/Curtain.js

@@ -101,6 +101,7 @@ class Curtain extends Component {
           {Math.round(this.props.stateOrDevice.intensity)}%
         </span>
         <input
+          disabled={this.props.disabled}
           onChange={this.handleChange}
           value={this.props.stateOrDevice.intensity}
           className="slider"

smart-hut/src/components/dashboard/devices/Dimmer.js

@@ -105,7 +105,7 @@ export class KnobDimmerComponent extends Component {
         <CircularInput
           style={KnobDimmerStyle}
           value={+(Math.round(this.state.intensity / 100 + "e+2") + "e-2")}
-          onChange={this.setIntensity}
+          onChange={this.props.disabled ? null : this.setIntensity}
         >
           <text
             style={textStyle}

smart-hut/src/components/dashboard/devices/Light.js

@@ -68,9 +68,12 @@ class Light extends Component {
 
   onClickDevice = () => {
     const on = !this.turnedOn;
-    if (this.props.tab === "Devices") {
+    if (this.props.tab !== "Scenes") {
       this.props
-        .saveDevice({ ...this.props.stateOrDevice, on })
+        .saveDevice(
+          { ...this.props.stateOrDevice, on },
+          this.props.tab === "Hosts" ? this.props.activeHost : null
+        )
         .catch((err) => console.error("regular light update error", err));
     } else {
       if (this.props.device.kind === "regularLight") {
@@ -115,10 +118,13 @@ class Light extends Component {
 
   saveIntensity = () => {
     const intensity = Math.round(this.state.intensity);
-    if (this.props.tab === "Devices") {
+    if (this.props.tab !== "Scenes") {
       this.props
-        .saveDevice({ ...this.props.stateOrDevice, intensity })
+        .saveDevice(
-        .catch((err) => console.error("regular light update error", err));
+          { ...this.props.stateOrDevice, intensity },
+          this.props.tab === "Hosts" ? this.props.activeHost : null
+        )
+        .catch((err) => console.error("dimmable light update error", err));
     } else {
       this.props
         .updateState(
@@ -137,8 +143,8 @@ class Light extends Component {
         <CircularInput
           style={LightDimmerStyle}
           value={+(Math.round(this.intensity / 100 + "e+2") + "e-2")}
-          onChange={this.setIntensity}
+          onChange={this.props.disabled ? null : this.setIntensity}
-          onMouseUp={this.saveIntensity}
+          onMouseUp={this.props.disabled ? null : this.saveIntensity}
         >
           <text
             style={textStyle}

smart-hut/src/components/dashboard/devices/SmartPlug.js

@@ -52,7 +52,7 @@ class SmartPlug extends Component {
 
   render() {
     return (
-      <StyledDiv onClick={this.onClickDevice}>
+      <StyledDiv onClick={this.props.disabled ? () => {} : this.onClickDevice}>
         <Image src={this.getIcon()} style={imageStyle} />
         <span style={nameStyle}>Smart Plug</span>
 

smart-hut/src/components/dashboard/devices/Switch.js

@@ -38,7 +38,7 @@ class Switch extends Component {
 
   render() {
     return (
-      <StyledDiv onClick={this.onClickDevice}>
+      <StyledDiv onClick={this.props.disabled ? () => {} : this.onClickDevice}>
         <Image src={this.getIcon()} style={imageStyle} />
         <span style={nameStyle}>Switch</span>
 

smart-hut/src/components/dashboard/devices/Thermostats.js

@@ -99,6 +99,7 @@ class Thermostats extends Component {
         <h3 style={deviceName}>
           Thermostat
           <Checkbox
+            disabled={this.props.disabled}
             checked={
               this.props.tab === "Devices"
                 ? this.props.device.mode !== "OFF"
@@ -118,6 +119,7 @@ class Thermostats extends Component {
         </div>
         {this.props.tab === "Devices" ? (
           <Slider
+            disabled={this.props.disabled}
             min={10}
             max={30}
             step={0.1}

smart-hut/src/deviceProps.js

@@ -45,6 +45,7 @@ function getRoomName(state, ownProps) {
 
 export default function mapStateToProps(state, ownProps) {
   return {
+    activeHost: state.active.activeHost,
     get stateOrDevice() {
       return getStateOrDevice(state, ownProps);
     },
@@ -57,5 +58,12 @@ export default function mapStateToProps(state, ownProps) {
     get type() {
       return getDevice(state, ownProps).kind;
     },
+    get disabled() {
+      return (
+        ownProps.tab === "Hosts" &&
+        ["dimmableLight", "light"].indexOf(getDevice(state, ownProps).kind) ===
+          -1
+      );
+    },
   };
 }

smart-hut/src/remote.js

@@ -529,16 +529,24 @@ export const RemoteService = {
    * @returns {Promise<Device, RemoteError>} promise that resolves to the saved device and rejects
    *  with user-fiendly errors as a RemoteError
    */
-  saveDevice: (data) => {
+  saveDevice: (data, hostId = null) => {
     return (dispatch) => {
       let url = "/device";
       if ((data.id && data.flowType === "OUTPUT") || !data.id) {
         url = "/" + data.kind;
       }
 
-      return Endpoint[data.id ? "put" : "post"](url, {}, data)
+      return Endpoint[data.id ? "put" : "post"](
+        url,
+        hostId ? { hostId } : {},
+        data
+      )
         .then((res) => {
-          dispatch(actions.deviceSave(res.data));
+          dispatch(
+            hostId
+              ? actions.hostDeviceSave(hostId, res.data)
+              : actions.deviceSave(res.data)
+          );
           return res.data;
         })
         .catch((err) => {

smart-hut/src/store.js

@@ -3,6 +3,7 @@ import thunk from "redux-thunk";
 import update from "immutability-helper";
 import reduxWebSocket, { connect } from "@giantmachines/redux-websocket";
 import { socketURL } from "./endpoint";
+import actions from "./storeActions";
 
 function reducer(previousState, action) {
   let newState, change;
@@ -333,6 +334,18 @@ function reducer(previousState, action) {
       }
       newState = update(previousState, change);
       break;
+    case "HOST_DEVICE_SAVE":
+      change = {
+        hostDevices: {
+          [action.hostId]: {
+            [action.device.id]: {
+              $set: action.device,
+            },
+          },
+        },
+      };
+      newState = update(previousState, change);
+      break;
 
     case "AUTOMATION_SAVE":
       change = {
@@ -491,7 +504,6 @@ function reducer(previousState, action) {
           a[hostId].push(e);
           return a;
         }, {});
-
       newState = reducer(previousState, {
         type: "DEVICES_UPDATE",
         partial: true,

smart-hut/src/storeActions.js

@@ -25,6 +25,11 @@ const actions = {
     type: "DEVICE_SAVE",
     device,
   }),
+  hostDeviceSave: (hostId, device) => ({
+    type: "HOST_DEVICE_SAVE",
+    hostId,
+    device,
+  }),
   triggerSave: (automation) => ({
     type: "TRIGGER_SAVE",
     automation,