diff --git a/smart-hut/src/components/AutomationModal.js b/smart-hut/src/components/AutomationModal.js
deleted file mode 100644
index 5f8fbd5..0000000
--- a/smart-hut/src/components/AutomationModal.js
+++ /dev/null
@@ -1,189 +0,0 @@
-import React, { Component } from "react";
-import { connect } from "react-redux";
-import { RemoteService } from "../remote";
-import { appActions } from "../storeActions";
-
-class AutomationModal extends Component {
- constructor(props) {
- super(props);
- this.state = this.initialState;
- this.setInitialState();
-
- this.addAutomationModal = this.addAutomationModal.bind(this);
- this.modifyAutomationModal = this.modifyAutomationModal.bind(this);
- this.deleteAutomation = this.deleteAutomation.bind(this);
- }
-
- get initialState() {
- return {
- //INITIAL STATE HERE
- };
- }
-
- setInitialState() {
- this.setState(this.initialState);
- }
-
- get type() {
- return !this.props.id ? "new" : "modify";
- }
-
- addAutomationModal = (e) => {
- /*let data = {
- // DATA HERE
- };*/
- // TODO CALL TO REMOTE SERVER TO ADD SCENE
- /*this.props
- .saveRoom(data, null)
- .then(() => {
- this.setInitialState();
- this.closeModal();
- })
- .catch((err) => console.error("error in creating room", err));*/
- };
-
- modifyAutomationModal = (e) => {
- /* let data = {
- // DATA HERE
- };*/
- // TODO CALL TO REMOTE SERVER TO MODIFY SCENE
- /*this.props
- .saveRoom(data, this.props.id)
- .then(() => {
- this.setInitialState();
- this.closeModal();
- })
- .catch((err) => console.error("error in updating room", err));*/
- };
-
- deleteAutomation = (e) => {
- // TODO CALL TO REMOTE SERVER TO DELETE SCENE
- /*
- this.props
- .deleteRoom(this.props.id)
- .then(() => this.closeModal())
- .catch((err) => console.error("error in deleting room", err));*/
- };
-
- changeSomething = (event) => {
- let nam = event.target.name;
- let val = event.target.value;
- this.setState({ [nam]: val });
- };
-
- closeModal = (e) => {
- this.setState({ openModal: false });
- };
-
- openModal = (e) => {
- this.setState({ openModal: true });
- };
-
- render() {
- return (
-
- {/*
- {!this.props.nicolaStop ? (
-
-
- {this.type === "new" ? (
-
- ) : (
-
- )}
-
-
- {this.type === "new" ? (
-
- ) : (
-
- )}
-
-
- ) : null}
-
-
-
- {this.type === "new" ? "Add new automation" : "Modify automation"}
-
-
- {
- //TODO FORM TO ADD OR MODIFY SCENE
- }
-
- {this.type === "modify" ? (
-
- ) : null}
-
-
-
-
-
-
- */}
-
- );
- }
-}
-
-const setActiveAutomation = (activeAutomation) => {
- return (dispatch) =>
- dispatch(appActions.setActiveAutomation(activeAutomation));
-};
-
-const mapStateToProps = (state, ownProps) => ({
- automations: ownProps.id ? state.automations[ownProps.id] : null,
-});
-const AutomationModalContainer = connect(
- mapStateToProps,
- { ...RemoteService, setActiveAutomation },
- null,
- { forwardRef: true }
-)(AutomationModal);
-export default AutomationModalContainer;
diff --git a/smart-hut/src/components/RoomModal.js b/smart-hut/src/components/RoomModal.js
index eabdb89..2054b8a 100644
--- a/smart-hut/src/components/RoomModal.js
+++ b/smart-hut/src/components/RoomModal.js
@@ -21,7 +21,6 @@ class RoomModal extends Component {
constructor(props) {
super(props);
this.state = this.initialState;
- this.setInitialState();
this.fileInputRef = React.createRef();
diff --git a/smart-hut/src/components/dashboard/HostsPanel.js b/smart-hut/src/components/dashboard/HostsPanel.js
index 538cb89..a9199c8 100644
--- a/smart-hut/src/components/dashboard/HostsPanel.js
+++ b/smart-hut/src/components/dashboard/HostsPanel.js
@@ -7,13 +7,19 @@ import Device from "../../components/dashboard/devices/Device";
class HostsPanel extends Component {
constructor(props) {
super(props);
- if (this.props.activeHost !== -1) {
+ }
+
+ componentDidUpdate(oldProps) {
+ if (
+ oldProps.activeHost !== this.props.activeHost &&
+ this.props.activeHost !== -1
+ ) {
this.props.fetchDevices(null, this.props.activeHost).catch(console.error);
}
}
render() {
- console.log(this.props);
+ console.log(this.props.hostDevices);
return (
{this.props.isActiveDefaultHost && (
@@ -42,7 +48,8 @@ class HostsPanel extends Component {
const mapStateToProps = (state, _) => ({
isActiveDefaultHost: state.active.activeHost === -1,
activeHost: state.active.activeHost,
- hostDeviceIds: Object.keys(state.hostDevices[state.activeHost] || {}),
+ hostDevices: state.hostDevices,
+ hostDeviceIds: Object.keys(state.hostDevices[state.active.activeHost] || {}),
});
const HostsPanelContainer = connect(mapStateToProps, RemoteService)(HostsPanel);
export default HostsPanelContainer;
diff --git a/smart-hut/src/components/dashboard/devices/Curtain.js b/smart-hut/src/components/dashboard/devices/Curtain.js
index d475455..e055b34 100644
--- a/smart-hut/src/components/dashboard/devices/Curtain.js
+++ b/smart-hut/src/components/dashboard/devices/Curtain.js
@@ -2,6 +2,7 @@ import React, { Component } from "react";
import "./Curtains.css";
import { RemoteService } from "../../../remote";
import { connect } from "react-redux";
+import mapStateToProps from "../../../deviceProps";
class Curtain extends Component {
constructor(props) {
@@ -112,15 +113,5 @@ class Curtain extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- get stateOrDevice() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.sceneStates[ownProps.id];
- }
- },
- //device: state.devices[ownProps.id],
-});
const CurtainContainer = connect(mapStateToProps, RemoteService)(Curtain);
export default CurtainContainer;
diff --git a/smart-hut/src/components/dashboard/devices/Device.js b/smart-hut/src/components/dashboard/devices/Device.js
index 61ee18b..d153cdf 100644
--- a/smart-hut/src/components/dashboard/devices/Device.js
+++ b/smart-hut/src/components/dashboard/devices/Device.js
@@ -11,6 +11,7 @@ import { Header, Button, Icon, Card } from "semantic-ui-react";
import { RemoteService } from "../../../remote";
import { connect } from "react-redux";
import DeviceSettingsModal from "./DeviceSettingsModal";
+import mapStateToProps from "../../../deviceProps";
const centerComponent = {
marginLeft: "50%",
@@ -45,66 +46,33 @@ class Device extends React.Component {
}
renderDeviceComponent() {
- switch (this.props.type) {
- case "curtains":
- return (
-
- );
- case "thermostat":
- return (
-
- );
- case "regularLight":
- return (
-
- );
- case "sensor":
- return (
-
- );
- case "motionSensor":
- return ;
- case "buttonDimmer":
- return (
-
- );
- case "knobDimmer":
- return (
-
- );
- case "smartPlug":
- return (
-
- );
- case "switch":
- return (
-
- );
- case "dimmableLight":
- return ;
- case "securityCamera":
- return (
-
- );
- default:
- throw new Error("Device type unknown");
+ const mapKindToComponent = {
+ curtains: Curtains,
+ thermostat: Thermostat,
+ regularLight: Light,
+ sensor: Sensor,
+ motionSensor: Sensor,
+ buttonDimmer: ButtonDimmer,
+ knobDimmer: KnobDimmer,
+ smartPlug: SmartPlug,
+ switch: Switcher,
+ dimmableLight: Light,
+ securityCamera: Videocam,
+ };
+
+ if (!(this.props.type in mapKindToComponent)) {
+ throw new Error(`device kind ${this.props.type} not known`);
}
+
+ return React.createElement(
+ mapKindToComponent[this.props.type],
+ {
+ tab: this.props.tab,
+ id: this.props.id,
+ hostId: this.props.hostId,
+ },
+ ""
+ );
}
deviceDescription() {
@@ -165,7 +133,7 @@ class Device extends React.Component {
{this.props.tab === "Devices"
? this.deviceDescription()
- : this.stateDescription()}
+ : this.props.tab === "Scenes" && this.stateDescription()}
{this.props.tab === "Devices" ? (
({
- get stateOrDevice() {
- return getStateOrDevice(state, ownProps);
- },
- get device() {
- return getDevice(state, ownProps);
- },
- get roomName() {
- return (state.rooms[getDevice(state, ownProps).roomId] || {}).name;
- },
- get type() {
- return getDevice(state, ownProps).kind;
- },
-});
const DeviceContainer = connect(mapStateToProps, RemoteService)(Device);
export default DeviceContainer;
diff --git a/smart-hut/src/components/dashboard/devices/Dimmer.js b/smart-hut/src/components/dashboard/devices/Dimmer.js
index d4762fd..ccec658 100644
--- a/smart-hut/src/components/dashboard/devices/Dimmer.js
+++ b/smart-hut/src/components/dashboard/devices/Dimmer.js
@@ -29,6 +29,7 @@ import {
} from "./DimmerStyle";
import { RemoteService } from "../../../remote";
import { connect } from "react-redux";
+import mapStateToProps from "../../../deviceProps";
export class ButtonDimmerComponent extends Component {
increaseIntensity = () => {
@@ -128,15 +129,6 @@ export class KnobDimmerComponent extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- get stateOrDevice() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.sceneStates[ownProps.id];
- }
- },
-});
const conn = connect(mapStateToProps, RemoteService);
export const KnobDimmer = conn(KnobDimmerComponent);
diff --git a/smart-hut/src/components/dashboard/devices/Light.js b/smart-hut/src/components/dashboard/devices/Light.js
index ebf0565..def795e 100644
--- a/smart-hut/src/components/dashboard/devices/Light.js
+++ b/smart-hut/src/components/dashboard/devices/Light.js
@@ -31,6 +31,7 @@ import {
} from "./LightStyle";
import { RemoteService } from "../../../remote";
import { connect } from "react-redux";
+import mapStateToProps from "../../../deviceProps";
class Light extends Component {
constructor(props) {
@@ -62,7 +63,7 @@ class Light extends Component {
}
get intensity() {
- return this.props.stateOrDevice.intensity || 0;
+ return this.state.intensity || 0;
}
onClickDevice = () => {
@@ -119,7 +120,6 @@ class Light extends Component {
.saveDevice({ ...this.props.stateOrDevice, intensity })
.catch((err) => console.error("regular light update error", err));
} else {
- console.log("CIAOOOOOOOOO", this.props.stateOrDevice);
this.props
.updateState(
{ id: this.props.stateOrDevice.id, intensity: intensity },
@@ -153,7 +153,7 @@ class Light extends Component {
@@ -184,22 +184,5 @@ class Light extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- get stateOrDevice() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.sceneStates[ownProps.id];
- }
- },
- get device() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.devices[state.sceneStates[ownProps.id].deviceId];
- }
- },
-});
-
const LightContainer = connect(mapStateToProps, RemoteService)(Light);
export default LightContainer;
diff --git a/smart-hut/src/components/dashboard/devices/Sensor.js b/smart-hut/src/components/dashboard/devices/Sensor.js
index ad80a4c..f171b6a 100644
--- a/smart-hut/src/components/dashboard/devices/Sensor.js
+++ b/smart-hut/src/components/dashboard/devices/Sensor.js
@@ -38,6 +38,7 @@ import {
import { Image } from "semantic-ui-react";
import { RemoteService } from "../../../remote";
import { connect } from "react-redux";
+import mapStateToProps from "../../../deviceProps";
class Sensor extends Component {
constructor(props) {
@@ -194,14 +195,5 @@ class Sensor extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- get stateOrDevice() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.sceneStates[ownProps.id];
- }
- },
-});
const SensorContainer = connect(mapStateToProps, RemoteService)(Sensor);
export default SensorContainer;
diff --git a/smart-hut/src/components/dashboard/devices/SmartPlug.js b/smart-hut/src/components/dashboard/devices/SmartPlug.js
index 5074429..3e93749 100644
--- a/smart-hut/src/components/dashboard/devices/SmartPlug.js
+++ b/smart-hut/src/components/dashboard/devices/SmartPlug.js
@@ -15,6 +15,7 @@ import {
} from "./SmartPlugStyle";
import { RemoteService } from "../../../remote";
import { connect } from "react-redux";
+import mapStateToProps from "../../../deviceProps";
class SmartPlug extends Component {
constructor(props) {
@@ -70,21 +71,5 @@ class SmartPlug extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- get stateOrDevice() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.sceneStates[ownProps.id];
- }
- },
- get device() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.devices[state.sceneStates[ownProps.id].deviceId];
- }
- },
-});
const SmartPlugContainer = connect(mapStateToProps, RemoteService)(SmartPlug);
export default SmartPlugContainer;
diff --git a/smart-hut/src/components/dashboard/devices/Switch.js b/smart-hut/src/components/dashboard/devices/Switch.js
index 113c1f1..62e9c84 100644
--- a/smart-hut/src/components/dashboard/devices/Switch.js
+++ b/smart-hut/src/components/dashboard/devices/Switch.js
@@ -11,6 +11,7 @@ import { Image } from "semantic-ui-react";
import { imageStyle, nameStyle, turnedOnStyle } from "./SwitchStyle";
import { RemoteService } from "../../../remote";
import { connect } from "react-redux";
+import mapStateToProps from "../../../deviceProps";
class Switch extends Component {
constructor(props) {
@@ -55,8 +56,5 @@ class Switch extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- device: state.devices[ownProps.id],
-});
const SwitchContainer = connect(mapStateToProps, RemoteService)(Switch);
export default SwitchContainer;
diff --git a/smart-hut/src/components/dashboard/devices/Thermostats.js b/smart-hut/src/components/dashboard/devices/Thermostats.js
index c2012bd..17f33f2 100644
--- a/smart-hut/src/components/dashboard/devices/Thermostats.js
+++ b/smart-hut/src/components/dashboard/devices/Thermostats.js
@@ -5,6 +5,7 @@ import { connect } from "react-redux";
import "./Thermostat.css";
import Slider from "react-rangeslider";
import "react-rangeslider/lib/index.css";
+import mapStateToProps from "../../../deviceProps";
import {
stateTag,
@@ -144,24 +145,6 @@ class Thermostats extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- get stateOrDevice() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.sceneStates[ownProps.id];
- }
- },
- get device() {
- if (state.active.activeTab === "Devices") {
- return state.devices[ownProps.id];
- } else {
- return state.devices[state.sceneStates[ownProps.id].deviceId];
- }
- },
- activeTab: state.activeTab,
-});
-
const ThermostatContainer = connect(
mapStateToProps,
RemoteService
diff --git a/smart-hut/src/components/dashboard/devices/Videocam.js b/smart-hut/src/components/dashboard/devices/Videocam.js
index c434be0..ee52409 100644
--- a/smart-hut/src/components/dashboard/devices/Videocam.js
+++ b/smart-hut/src/components/dashboard/devices/Videocam.js
@@ -7,6 +7,7 @@ import { RemoteService } from "../../../remote";
import { endpointURL } from "../../../endpoint";
import { connect } from "react-redux";
import VideocamModal from "./VideocamModal";
+import mapStateToProps from "../../../deviceProps";
class Videocam extends Component {
constructor(props) {
@@ -58,12 +59,5 @@ class Videocam extends Component {
}
}
-const mapStateToProps = (state, ownProps) => ({
- device:
- ownProps.tab === "Devices"
- ? state.devices[ownProps.id]
- : state.devices[state.sceneStates[ownProps.id].deviceId],
- state: state.sceneStates[ownProps.id],
-});
const VideocamContainer = connect(mapStateToProps, RemoteService)(Videocam);
export default VideocamContainer;
diff --git a/smart-hut/src/deviceProps.js b/smart-hut/src/deviceProps.js
new file mode 100644
index 0000000..9f5f4ae
--- /dev/null
+++ b/smart-hut/src/deviceProps.js
@@ -0,0 +1,51 @@
+function getStateOrDevice(state, ownProps) {
+ switch (state.active.activeTab) {
+ case "Devices":
+ return state.devices[ownProps.id];
+ case "Scenes":
+ return state.sceneStates[ownProps.id];
+ case "Hosts":
+ return state.hostDevices[ownProps.hostId][ownProps.id];
+ default:
+ throw new Error(
+ `stateOrDevice has no value in tab "${state.active.activeTab}"`
+ );
+ }
+}
+
+function getDevice(state, ownProps) {
+ switch (state.active.activeTab) {
+ case "Scenes":
+ return state.devices[getStateOrDevice(state, ownProps).deviceId];
+ case "Devices":
+ case "Hosts":
+ return getStateOrDevice(state, ownProps);
+ default:
+ throw new Error(`device has no value in tab "${state.active.activeTab}"`);
+ }
+}
+
+function getRoomName(state, ownProps) {
+ switch (state.active.activeTab) {
+ case "Scenes":
+ case "Devices":
+ return (state.rooms[getDevice(state, ownProps).roomId] || {}).name;
+ case "Hosts":
+ return "Room Name not implemented yet";
+ }
+}
+
+export default function mapStateToProps(state, ownProps) {
+ return {
+ get stateOrDevice() {
+ return getStateOrDevice(state, ownProps);
+ },
+ get device() {
+ return getDevice(state, ownProps);
+ },
+ get roomName() {},
+ get type() {
+ return getDevice(state, ownProps).kind;
+ },
+ };
+}
diff --git a/smart-hut/src/store.js b/smart-hut/src/store.js
index 33b0bef..6d1ae28 100644
--- a/smart-hut/src/store.js
+++ b/smart-hut/src/store.js
@@ -3,7 +3,6 @@ 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;
diff --git a/smart-hut/src/views/Dashboard.js b/smart-hut/src/views/Dashboard.js
index e8c58c3..ab2c952 100644
--- a/smart-hut/src/views/Dashboard.js
+++ b/smart-hut/src/views/Dashboard.js
@@ -21,7 +21,6 @@ class Dashboard extends Component {
constructor(props) {
super(props);
this.state = this.initialState;
- this.setInitialState();
this.activeTab = "Devices";
this.selectTab = this.selectTab.bind(this);
}