From 268698a0810d72e7dade3091df251662d3dabded Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Christian=20Cape=C3=A1ns=20P=C3=A9rez?= Date: Tue, 21 Apr 2020 12:13:01 +0200 Subject: [PATCH 1/5] fix the wrong stuff in the bach I --- .../src/components/dashboard/DevicePanel.js | 7 ++- .../components/dashboard/devices/Device.js | 54 +++++++++++++++++-- .../dashboard/devices/DeviceSettingsModal.js | 21 ++++---- .../dashboard/devices/DimmerStyle.js | 2 + .../src/components/dashboard/devices/Light.js | 4 +- .../dashboard/devices/LightStyle.js | 2 + .../components/dashboard/devices/NewDevice.js | 1 + .../dashboard/devices/SensorStyle.js | 3 ++ .../dashboard/devices/SmartPlugStyle.js | 4 ++ .../dashboard/devices/SwitchStyle.js | 3 ++ .../dashboard/devices/styleComponents.js | 1 + smart-hut/src/store.js | 2 +- 12 files changed, 86 insertions(+), 18 deletions(-) diff --git a/smart-hut/src/components/dashboard/DevicePanel.js b/smart-hut/src/components/dashboard/DevicePanel.js index 449642e..2fb222d 100644 --- a/smart-hut/src/components/dashboard/DevicePanel.js +++ b/smart-hut/src/components/dashboard/DevicePanel.js @@ -24,7 +24,12 @@ class DevicePanel extends Component { render() { return ( - + {this.props.devices.map((e, i) => { return ( diff --git a/smart-hut/src/components/dashboard/devices/Device.js b/smart-hut/src/components/dashboard/devices/Device.js index d71c79e..a743318 100644 --- a/smart-hut/src/components/dashboard/devices/Device.js +++ b/smart-hut/src/components/dashboard/devices/Device.js @@ -5,7 +5,7 @@ import Sensor from "./Sensor"; import { ButtonDimmer, KnobDimmer } from "./Dimmer"; import Switcher from "./Switch"; import Videocam from "./Videocam"; -import { Segment, Grid, Header, Button, Icon } from "semantic-ui-react"; +import { Segment, Grid, Header, Button, Icon, Card } from "semantic-ui-react"; import { RemoteService } from "../../../remote"; import { connect } from "react-redux"; import DeviceSettingsModal from "./DeviceSettingsModal"; @@ -58,12 +58,48 @@ class Device extends React.Component { render() { return ( - + + + {this.props.device.name} + + + {this.renderDeviceComponent()} + + + +
+ + + {this.props.device.kind === "smartPlug" ? ( + + ) : null} + +
+ + {/* {this.renderDeviceComponent()} {this.props.tab === "Devices" ? ( - -
{this.props.stateOrDevice.name}
+ +
{this.props.device.name}
+ + + + {this.props.device.kind === "smartPlug" ? ( + {this.props.stateOrDevice.kind === "smartPlug" ? ( + + ) : null} + + ); + } + + stateDescription() { + return ( +
+ +
+ ); + } + + get deviceName() { + return this.props.tab === "Devices" + ? this.props.stateOrDevice.name + : this.props.device.name; + } + render() { { - if (this.props.type !== "") { - return ( - - - {this.renderDeviceComponent()} - {this.props.tab === "Devices" ? ( - -
{this.props.stateOrDevice.name}
- - {this.props.stateOrDevice.kind === "smartPlug" ? ( - - ) : null} - + return ( + + + +
{this.deviceName}
+ {this.props.tab === "Scenes" ? ( +
{this.props.roomName}
) : ( - -
{this.props.device.name}
- {this.props.tab === "Scenes" ? ( -
{this.props.roomName}
- ) : ( - "" - )} - - + "" )} - - {this.props.stateOrDevice && this.props.tab === "Devices" ? ( - - ) : ( - "" - )} - - ); - } else { - return null; - } + + + + {this.renderDeviceComponent()} + + + + {this.props.tab === "Devices" + ? this.deviceDescription() + : this.stateDescription()} + + + + ); } } } @@ -198,7 +213,6 @@ const mapStateToProps = (state, ownProps) => ({ } }, get type() { - console.log("ALPACA", state, ownProps); if (state.active.activeTab === "Scenes") { if (state.sceneStates[ownProps.id]) { //console.log(state.sceneStates[ownProps.id], ownProps.id); diff --git a/smart-hut/src/components/dashboard/devices/DeviceSettingsModal.js b/smart-hut/src/components/dashboard/devices/DeviceSettingsModal.js index 5a563e6..fc7956b 100644 --- a/smart-hut/src/components/dashboard/devices/DeviceSettingsModal.js +++ b/smart-hut/src/components/dashboard/devices/DeviceSettingsModal.js @@ -26,26 +26,24 @@ const DeleteModal = (props) => ( ); const SettingsForm = (props) => { + const handleInputChange = (e) => { + const { name, value } = e.target; + setValues({ ...values, [name]: value }); + }; + const [values, setValues] = useState({ name: "" }); - const handleInputChange = (e) => { - const { name, value } = e.target.value; - setValues({ ...values, [name]: value }); - console.log("EDDDDITING!!", e.target.value); - console.log(props); - }; + console.log(props); return ( - - Edit Name: + @@ -109,20 +107,25 @@ class DeviceSettingsModal extends Component { ); } + _editForm = null; + get editForm() { + this._editForm = this._editForm || ( + + ); + return this._editForm; + } + render() { - const SettingsModal = () => ( + return ( Settings of {this.props.device.name} - - - + {this.editForm} ); - return ; } } diff --git a/smart-hut/src/store.js b/smart-hut/src/store.js index eade971..002c0db 100644 --- a/smart-hut/src/store.js +++ b/smart-hut/src/store.js @@ -499,7 +499,6 @@ function reducer(previousState, action) { console.warn(`Action type ${action.type} unknown`, action); return previousState; } - console.log("THETRUEALPACA", newState, action.type, action); return newState; }